🥇8 vzdelávacích projektov

„Majster robí viac chýb ako začiatočník – pokusov“

Ponúkame 8 projektových variantov, ktoré môžete urobiť „pre zábavu“, aby ste získali skutočné skúsenosti s vývojom.

Projekt 1. Klon Trello

Klon Trello od Indrek Lasn.

Čo sa naučíte:

Organizácia trás spracovania požiadaviek (Routing).
Drag and drop.
Ako vytvárať nové objekty (tabuľky, zoznamy, karty).
Spracovanie a overenie vstupných údajov.
Na strane klienta: ako používať lokálne úložisko, ako ukladať dáta do lokálneho úložiska, ako čítať dáta z lokálneho úložiska.
Na strane servera: ako používať databázy, ako ukladať dáta do databázy, ako čítať dáta z databázy.

Tu je príklad repozitára, vytvoreného na React+Redux.

Projekt 2. Administrátorský panel

Github Repository.

Jednoduchá CRUD aplikácia, ideálna na učenie základov. Naučíme sa:

Vytvoriť používateľov, spravovať používateľov.
Interagovať s databázou – vytvárať, čítať, upravovať, mazať používateľov.
Overenie vstupu a práca s formulármi.

Projekt 3. Sledovač kryptomien (nativná mobilná aplikácia)

Github repository.

Na čomkoľvek: Swift, Objective-C, React Native, Java, Kotlin.

Naučíme sa:

Ako fungujú natívne aplikácie.
Ako extrahovať dáta z API.
Ako fungujú natívne rozloženia stránok.
Ako pracovať s mobilnými simulátormi.

Vyskúšajte toto API. Ak nájdete lepšie – napíšte v komentároch.

Ak vás to zaujíma, tu je tento tutoriál.

Projekt 4. Nastavte svoj vlastný webpack config od nuly

Technicky to nie je aplikácia, ale veľmi užitočná úloha na pochopenie, ako webpack funguje zvnútra. Teraz to nebude „čierna skrinka“, ale zrozumiteľný nástroj.

Požiadavky:

Kompilovať es7 do es5 (základy).
Kompilovať jsx do js – alebo – .vue do .js (bude potrebné naučiť sa načítače)
Nastaviť webpack dev server a hot module reloading. (vue-cli a create-react-app používajú oboje)
Používať Heroku, now.sh alebo Github, naučiť sa nasadzovať webpack projekty.
Nastaviť svoj obľúbený preprocesor na kompiláciu css – scss, less, stylus.
Naučiť sa, ako používať obrázky a svgs s webpack.

Tu je skvelý zdroj pre úplných začiatočníkov.

Projekt 5. Klon Hackernews

Každý Jedi by mal vytvoriť svoj vlastný Hackernews.

Čo sa naučíte cestou:

Ako interagovať s hackernews API.
Ako vytvoriť jednorazovú aplikáciu.
Ako implementovať také funkcie, ako sú zobrazenie komentárov, jednotlivých komentárov, profilov.
Organizácia trás spracovania požiadaviek (Routing).

Projekt 6. Todoček

TodoMVC.

Naozaj? Todoška? Tých je predsa tisíce. Ale verte, je dôvod, prečo sú tak populárne.
Todo aplikácia je skvelý spôsob, ako sa uistiť, že rozumiete základom. Skúste napísať jednu aplikáciu vo vanilkovom JavaScripte a jednu vo svojom obľúbenom rámci.

Naučte sa: