🥇8 õppeprojekti

«Meister teeb rohkem vigu kui algaja — katseid»

Pakume 8 projektivarianti, mida saab teha nalja pärast, et saada tõelist arenduskogemust.

Projekt 1. Trello kloon

Trello kloon Indrek Lasnilt.

Mida te õpite:

Päringute töötlemise marsruutimise korraldamine.
Lohista ja taga.
Uute objektide (tahvlid, nimekirjad, kaardid) loomine.
Sisendandmete töötlemine ja kontrollimine.
Kliendi poolelt: kuidas kasutada kohaliku salvestamise funktsiooni, kuidas salvestada andmeid kohalikku salvestusse, kuidas andmeid kohalikust salvestusest lugeda.
Serveri poolelt: kuidas kasutada andmebaase, kuidas salvestada andmeid andmebaasi, kuidas andmeid andmebaasist lugeda.

Siin on näide hoonest., mis on tehtud React+Reduxiga.

Projekt 2. Administraatori paneel

Githubi repo.

Lihtne CRUD rakendus, ideaalne alustamiseks. Õpime:

Kasutajate loomine, kasutajate haldamine.
Andmebaasiga suhtlemine — kasutajate loomine, lugemine, redigeerimine, kustutamine.
Sisendi kontrollimine ja vormidega töötamine.

Projekt 3. Krüptovaluuta jälgija (natiivne mobiilirakendus)

Githubi repo.

Mis tahes platvormil: Swift, Objective-C, React Native, Java, Kotlin.

Uurime:

Kuidas toimivad natiivrakendused.
Kuidas andmeid API-st välja tõmmata.
Kuidas töötavad natiivsed lehtede paigutused.
Kuidas töötada mobiilisimulaatoritega.

Proovige seda API-d. Kui leiate parema, kirjutage kommentaaridesse.

Kui see huvitab, siis siin on see õpetus.

Projekt 4. Seadistage oma webpack konfiguratsioon nullist.

Tehniliselt pole see rakendus, aga väga kasulik ülesanne, et mõista, kuidas webpack seestpoolt töötab. Nüüd ei ole see enam 'must kast', vaid arusaadav tööriist.

Nõuded:

Kompileerida es7 es5-ks (alusteadmised).
Kompileerida jsx js-iks või - .vue .js-ks (peab õppima laadijaid).
Seadistada webpack dev server ja kuum mooduli laadimine (vue-cli ja create-react-app kasutavad mõlemat).
Kasutada Herokut, now.sh või Github'i, õppida webpack projektide juurutamist.
Seadistada oma lemmik eeltöötleja, et kompileerida css - scss, less, stylus.
Uurida, kuidas kasutada pilte ja svg-sid webpackiga.

Siin on suurepärane ressurss täielikele algajatele.

Projekt 5. Hackernews kloon

Iga Jedi peab tegema oma Hackernews.

Mida te õpite selle teekonna jooksul:

Kuidas suhelda hackernews API-ga.
Kuidas luua ühe lehe rakendus.
Kuidas rakendada selliseid funktsioone nagu kommentaaride, üksikute kommentaaride ja profiilide vaatamine.
Päringute töötlemise marsruutimise korraldamine.

Projekt 6. Toodetav nimetamine

TodoMVC.

Tõsiselt? To-Do rakendus? Neid on ju tuhandeid. Kuid uskuge, selle populaarsuse taga on põhjus.
To-Do rakendus on suurepärane viis veenduda, et mõistate põhitõdesid. Proovige kirjutada üks rakendus puhta Javascriptiga ja teine oma lemmikraamistiku abil.

Õppige:

Uute ülesannete loomine.
Väljade täitmise kontrollimine.
Ülesannete filtreerimine (tehtud, aktiivne, kõik). Kasutage filter ja reduce.
Mõistma Javascripti põhialuseid.