8 edukativnih projekata

“Majstor pravi više grešaka nego početnik pokušava”

Nudimo 8 projektnih opcija koje se mogu raditi “za zabavu” kako bi stekli pravo razvojno iskustvo.

Projekat 1. Trello klon

Trello klon od Indreka Lasna.

Šta ćete naučiti:

• Organizacija ruta obrade zahtjeva (Routing).
• Prevucite i ispustite.
• Kako kreirati nove objekte (ploče, liste, kartice).
• Obrada i provjera ulaznih podataka.
• Sa strane klijenta: kako koristiti lokalnu pohranu, kako spremiti podatke u lokalnu pohranu, kako čitati podatke iz lokalne memorije.
• Sa strane servera: kako koristiti baze podataka, kako sačuvati podatke u bazi podataka, kako čitati podatke iz baze podataka.

Evo primjera spremišta, napravljen u React+Redux.

Projekat 2. Admin panel

Github Repository.

Jednostavna CRUD aplikacija, idealna za učenje osnova. naučimo:

• Kreirajte korisnike, upravljajte korisnicima.
• Interakcija sa bazom podataka - kreiranje, čitanje, uređivanje, brisanje korisnika.
• Validacija unosa i rad sa obrascima.

Projekat 3. Praćenje kriptovaluta (nativna mobilna aplikacija)

Github spremište.

Bilo šta: Swift, Objective-C, React Native, Java, Kotlin.

Hajde da proučimo:

• Kako funkcionišu izvorne aplikacije.
• Kako dohvatiti podatke iz API-ja.
• Kako funkcioniraju izvorni izgledi stranica.
• Kako raditi sa mobilnim simulatorima.

Isprobajte ovaj API. Ako nađete nešto bolje, pišite u komentarima.

Ako ste zainteresovani, evo ga evo tutorijala.

Projekt 4. Postavite vlastitu webpack konfiguraciju od nule

Tehnički, ovo nije aplikacija, ali je vrlo koristan zadatak za razumijevanje kako webpack radi iznutra. Sada to neće biti „crna kutija“, već razumljiv alat.

Uslovi:

• Prevedite es7 u es5 (osnove).
• Prevedite jsx u js - ili - .vue u .js (morat ćete naučiti loadere)
• Postavite webpack dev server i ponovno učitavanje vrućih modula. (vue-cli i create-react-app koriste oboje)
• Koristite Heroku, now.sh ili Github, naučite kako implementirati webpack projekte.
• Postavite svoj omiljeni predprocesor za kompajliranje css-a - scss, less, stylus.
• Naučite kako koristiti slike i svgs s webpackom.

Ovo je nevjerovatan resurs za potpune početnike.

Projekat 5. Klon Hackernews-a

Svaki Džedaj je dužan da napravi sopstveni Hackernews.

Šta ćete naučiti usput:

• Kako komunicirati sa hackernews API-jem.
• Kako kreirati aplikaciju na jednoj stranici.
• Kako implementirati funkcije kao što su pregled komentara, pojedinačnih komentara, profila.
• Organizacija ruta obrade zahtjeva (Routing).

Projekat 6. Tudušečka

TodoMVC.

Ozbiljno? Tudushka? Ima ih na hiljade. Ali vjerujte mi, postoji razlog za ovu popularnost.
Aplikacija Tudu je odličan način da se uvjerite da razumijete osnove. Pokušajte napisati jednu aplikaciju u vanilla Javascript-u i jednu u svom omiljenom frameworku.

Naučite:

• Kreirajte nove zadatke.
• Provjerite da li su polja popunjena.
• Filtrirajte zadatke (dovršeni, aktivni, svi). Koristi filter и reduce.
• Razumjeti osnove Javascripta.

Projekat 7. Lista za sortiranje drag and drop

Github spremište.

Vrlo korisno za razumijevanje drag and drop api.

naučimo:

• Prevucite i ispustite API
• Kreirajte bogata korisničko sučelje

Projekat 8. Messenger klon (nativna aplikacija)

Razumjet ćete kako funkcioniraju i web aplikacije i izvorne aplikacije, što će vas izdvojiti iz sive mase.

Šta ćemo proučavati:

• Web utičnice (instant poruke)
• Kako funkcionišu izvorne aplikacije.
• Kako predlošci rade u izvornim aplikacijama.
• Organiziranje ruta za obradu zahtjeva u izvornim aplikacijama.

Ovo će vam biti dovoljno za mesec-dva.

Prevod je obavljen uz podršku kompanije EDISON softverkoji je profesionalno angažovan razvoj aplikacija i web stranica u PHP-u za velike kupce, kao i razvoj cloud servisa i mobilnih aplikacija u Javi.

izvor: www.habr.com