8 mācību projekti

«Meistars pieļauj vairāk kļūdu nekā iesācējs — mēģinājumu»

Piedāvājam 8 projektu variantus, kurus var izveidot „priecai”, lai iegūtu reālu izstrādes pieredzi.

Projekts 1. Trello klons

Trello klons no Indrek Lasn.

Ko jūs apgūsiet:

• Pieprasījumu apstrādes maršrutu organizācija (Routing).
• Drag and drop.
• Kā veidot jaunus objektus (dēļus, sarakstus, kartītes).
• Ieejas datu apstrāde un pārbaude.
• Klientu pusē: kā izmantot lokālo krātuvi, kā saglabāt datus lokālajā krātuvē, kā nolasīt datus no lokālās krātuves.
• Servera pusē: kā izmantot datu bāzes, kā saglabāt datus datu bāzē, kā nolasīt datus no datu bāzes.

Šeit ir piemērs repozitorijam, izveidotam izmantojot React+Redux.

Projekts 2. Admin paneļa izveide

Github repozitorijs.

Vienkārša CRUD lietotne, lieliski piemērota, lai apgūtu pamatus. Mācīsimies:

• Izveidot lietotājus, pārvaldīt lietotājus.
• Sazināties ar datu bāzi — izveidot, nolasīt, rediģēt, dzēst lietotājus.
• Ievades pārbaude un darbs ar formām.

Projekts 3. Kriptovalūtu trackers (nativs mobilais lietotne)

Github repozitorijs.

Uz jebkuras platformas: Swift, Objective-C, React Native, Java, Kotlin.

Iemācīsimies:

• Kā darbojas nativās lietotnes.
• Kā iegūt datus no API.
• Kā darbojas nativās lapu izvietojumi.
• Kā strādāt ar mobilajiem simulātoriem.

Pamēģiniet šo API. Ja atrodat labāku — rakstiet komentāros.

Ja interesē, šeit ir šis tutoriāls.

Projekts 4. Savs webpack konfigurācija no nulles

Tehniski tas nav lietotne, bet ļoti noderīgs uzdevums, lai saprastu, kā webpack darbojas iekšēji. Tagad tas vairs nebūs „melns kaste”, bet saprotams rīks.

Prasības:

• Kompilēt es7 uz es5 (pamati).
• Kompilēt jsx uz js  — vai  -  .vue uz .js (jāiemācās ielādētājus)
• Iestatīt webpack dev serveri un hot module reloading. (vue-cli un create-react-app to izmanto abi)
• Izmantot Heroku, now.sh vai Github, iemācīties izvietot webpack projektus.
• Iestatīt savu iecienīto priekšprocesoru, lai kompilētu css  —  scss, less, stylus.
• Iemācīties, kā izmantot attēlus un svgs ar webpack.

Šeit ir brīnišķīgs resurs, lai pilnīgi iesācējiem.

Projekts 5. Hackernews klons

Katram džedajam ir jāizveido savs Hackernews.

Ko jūs apgūsiet ceļa laikā:

• Kā sazināties ar hackernews API.
• Kā izveidot vienu lapu lietotni.
• Kā īstenot tādas funkcijas kā komentāru apskate, atsevišķu komentāru, profilu.
• Pieprasījumu apstrādes maršrutu organizācija (Routing).

Projekts 6. To-do

TodoMVC.

Tiešām? To-do lietotne? To taču ir tūkstošiem. Bet ticiet man, ir iemesls tās popularitātei.
To-do lietotne ir lielisks veids, kā pārliecināties, ka saprotat pamatprincipus. Mēģiniet uzrakstīt vienu lietotni izmantojot tīru Javascript un otru ar savu iecienītāko ietvaru.

Mācieties:

• Izveidot jaunas uzdevumus.
• Pārbaudīt lauku aizpildījumu.
• Filtrēt uzdevumus (pabeigts, aktīvs, visi). Izmantojiet filtrs un reduce.
• Saprast Javascript pamatprincipus.

Projekts 7. Sakārtota drag and drop saraksts.

Github repozitorijs.

Ļoti noderīgi, lai saprastu drag and drop API..

Mācīsimies:

• Drag and drop API.
• Izveidot bagātas lietotāja saskarnes.

Projekts 8. Messenger klons (vietējā lietotne).

Jūs sapratīsit, kā darbojas gan tīmekļa lietotnes, gan vietējās lietotnes, kas izcels jūs no pelēkās masas.

Ko mēs apgūsim:

• Web sockets (momentānie ziņojumi).
• Kā darbojas nativās lietotnes.
• Kā darbojas veidnes vietējās lietotnēs.
• Maršrutu apstrādes organizēšana vietējās lietotnēs.

Tā būs pietiekami uz mēnesi diviem.

Pārskats ir izpildīts ar EDISON Software atbalstu. EDISON Software, kas profesionāli nodarbojas ar lietotņu un tīmekļa vietņu izstrādi PHP lieliem klientiem, kā arī mākoņu pakalpojumu un mobilā lietotņu izstrādi Java.

Avots: habr.com