Ionic framework

Zpět na kurzy

Všechny ONLINE kurzy

od 1 299,00 KČ

Všechny online kurzy od 1 299 KČ

Více info

Course duration 2h 11m 51s
Course chapters 36 kapitol
Course difficulty Začátečník

Popis online kurzu

V tomto online kurze si predstavíme Ionic Framework, ktorý nám umožňuje tvoriť mobilné aplikácie so znalosťami webových technológií. Ionic je open-source SDK na vývoj rôznych mobilných aplikácií. Ionic je framework napísaný v JavaScripte, ktorý dokážeme rozbehať veľmi jednoducho na Windowse či Macu.

Pre porozumenie odporúčam mať aspoň základné porozumenie:

  • HTML, CSS, JavaScript
  • TypeScript
  • Angular

V kurze sa snažím tie koncepty prechádzať tak, aby boli zrozumiteľné aj bez nich. V podstate ak vieš moderný JavaScript, budeš rozumieť aj TypeScriptu, ktorý tu používame.

Ionic je UI framework určený pre tvorbu mobilných aplikácií, ale vďaka jeho toolkitu umožuje tvorbu aj tých desktopových (electron) a samozrejme klasických webových. Vzľad týchto komponentov je tak perfektne naštýlovaný, že by sme takmer nerozoznali rozdiel od tých natívnych v iOS, resp. Androide. Komponenty boli vytvorené pomocou štandardu Web Components, ktorý umožňuje využitie akéhokoľvek frameworku pre interakciu s nimi. Poskytuje integrovanú podporu pre tie najznámejšie ako Angular, React, Vue alebo aj čistý JavaScript. My sa budeme venovať použitiu Ionicu s Angularom.

V úvode kurzu sa najprv pripravíme vývojové prostredie a nainštalujeme potrebné nástroje.

Ďalšia časť kurzu bude o vygenerovaní prvej aplikácie, aby sme vedeli čo nás čaká so základnými UI prvkami, aby sme ich vedeli neskôr použiť. Vysvetlíme si aj základnú štruktúru projektu. Zároveň si ukážeme, ako bude prebiehať vývoj mobilnej aplikácie (može to byť v simulátore alebo cez webový prehliadač).

Následujúca časť bude o ukážke UI komponentov, ako sa s nimi pracuje a podobne.

V poslednej časti si to dáme celé dokopy a ukážeme príklady na aplikácii, ktorú som nazval IonBank.Tam budú využité tieto komponenty, zároveň si napíšeme nejaký jednoduchý TypeScript/Angular kód. Aplikácia bude obsahovať stránky ako transakcie, ich detail, profil, upráva profilu a neskôr do tohto kurzu pribudnú ešte aj ďalšie zaujímavé kapitoly.

Do tohto online kurzu pribudnú ešte ďalšie sekcie a následne sa cena kurzu zvýši na 129 Eur.

Čo sa teda naučíš?

  • ako používať UI knižnicu Ionic.
  • základné koncepty komponentov v Ionicu prostredníctvom Angularu.
  • vytvoriť jednoduchú aplikáciu, kde tieto poznatky aplikuješ.

Ak si zbehlý v nástrojoch ako VSCode a NPM, tak prvé dve videá môžes s kľudom preskočiť.

Osnova kurzu

  • Príprava prostredia   
    •  01. Prostredie Visual Studio Code  
    •  02. Inštalácia Node.js a NPM pre použitie v termináli  
    •  03. Inštalácia Ionic CLI  
  •  Prvá Ionic aplikácia  
    •  04. Práca s Ionic CLI v termináli  
    •  05. Priečinky a štruktúra projektu  
    •  06. Použitie Ionic CLI  
    •  07. Spustenie a vývoj aplikácie v prehliadači  
    •  08. Spustenie a vývoj aplikácie v iOS simulátore  
    •  09. Spustenie a vývoj aplikácie v Android simulátore  
  •  Ionic UI komponenty   
    •  10. Prehľad Ionic UI komponentov  
    •  11. Komponent ion-button  
    •  12. Komponent ion-list  
    •  13. Komponent ion-input  
    •  14. Komponent ion-radio  
    •  15. Komponent ion-checkbox  
    •  16. Komponent ion-select  
    •  17. Komponent ion-grid  
    •  18. Komponent ion-modal  
  •  Aplikácia IonBank     
    •  19. IonBank intro  
    •  20. Stránka s transakciami  
    •  21. Zobrazenie dát v transakciách  
    •  22. Práca s dátami pomocou Angular Service konceptu  
    •  23. Stránka s detailom transakcie  
    •  24. Prenos parametrov v url pri prechode na novú stránku  
    •  25. Previazanie master/detail medzi stránkami  
    •  26. Profilová stránka  
    •  27. Úprava Ionic UI komponentov pomocou CSS  
    •  28. Práca s dátami cez service vrámci profilovej stránky  
    •  29. Stránka pre úpravu profilu  
    •  30. Kategorizácia formulárových prvkov a tlačidlá v toolbare  
    •  31. Presmerovanie medzi stránkami profile a profile-edit  
    •  32. Upráva profilu - reaktívne formuláre  
    •  33. Inicializácia dát vo formulári  
    •  34. Validácia formuláru pomocou Validators triedy  
    •  35. Vizuálne zobrazenie validačných chýb  
    •  36. Uloženie dát do service

Do tohto online kurzu pribudnú ešte ďalšie sekcie a následne sa cena kurzu zvýši na 129 Eur.

Online kurz Ionic framework je možné vyzkoušet i zdarma!

Instruktor

Erich Stark

Erich Stark