🥇8 vzdělávacích projektů

„Mistr dělá více chyb než nováček — pokusů“

Nabízíme 8 variant projektů, které můžete udělat „pro zábavu“, abyste získali skutečné zkušenosti s vývojem.

Projekt 1. Klon Trello

Klon Trello od Indrek Lasn.

Co se naučíte:

Organizace směrování zpracování požadavků (Routing).
Drag and drop.
Jak vytvářet nové objekty (tabule, seznamy, karty).
Zpracování a ověřování vstupních dat.
Na straně klienta: jak používat lokální úložiště, jak ukládat data do lokálního úložiště, jak číst data z lokálního úložiště.
Na straně serveru: jak používat databáze, jak ukládat data v databázi, jak číst data z databáze.

Tady je příklad repozitáře, vyrobeného na React+Redux.

Projekt 2. Admin panel

Github Repository.

Jednoduchá CRUD aplikace, ideální pro učení základů. Naučíme se:

Vytvářet uživatele, spravovat uživatele.
Interakce s databází — vytvářet, číst, upravovat, mazat uživatele.
Ověření vstupu a práce s formuláři.

Projekt 3. Tracker kryptoměn (nativní mobilní aplikace)

Github repository.

Na čemkoli: Swift, Objective-C, React Native, Java, Kotlin.

Naučíme se:

Jak fungují nativní aplikace.
Jak extrahovat data z API.
Jak fungují nativní rozložení stránek.
Jak pracovat s mobilními simulátory.

Vyzkoušejte toto API. Najdete-li lepší — napište do komentářů.

Pokud máte zájem, tady je tutoriál.

Projekt 4. Nastavení vlastního webpack konfigu z nuly

Technicky to není aplikace, ale velmi užitečný úkol, abyste pochopili, jak webpack funguje zevnitř. Nyní to nebude „černá skříňka“, ale srozumitelný nástroj.

Požadavky:

Kompilovat es7 do es5 (základy).
Kompilovat jsx do js — nebo - .vue do .js (budete muset se naučit načítače)
Nastavit webpack dev server a hot module reloading. (vue-cli a create-react-app používají obojí)
Použít Heroku, now.sh nebo Github, naučit se nasazovat webpack projekty.
Nastavit svůj oblíbený preprocesor pro kompilaci css — scss, less, stylus.
Naučit se, jak používat obrázky a svgs s webpack.

Tady je skvělý zdroj pro úplné nováčky.

Projekt 5. Klon Hackernews

Každý Jedi by měl udělat svůj vlastní Hackernews.

Co se naučíte cestou:

Jak interagovat s hackernews API.
Jak vytvořit jednopageovou aplikaci.
Jak realizovat funkce, jako je prohlížení komentářů, jednotlivých komentářů a profilů.
Organizace směrování zpracování požadavků (Routing).

Projekt 6. ToDočka

TodoMVC.

Opravdu? ToDočka? Je jich přece tisíce. Ale věřte, že existuje důvod k této popularitě.
ToDo aplikace je skvělý způsob, jak si ověřit, že rozumíte základům. Zkuste napsat jednu aplikaci ve vanilkovém Javascriptu a jednu ve svém oblíbeném rámci.

Naučte se: