15 proiecte Full Stack interesante pe GitHub pentru începători [2022]

Publicat: 2021-01-06

Dezvoltarea full-stack implică atât software pentru client, cât și pentru server. Pentru a face o carieră de succes ca dezvoltator web, veți avea nevoie de cunoștințe despre dezvoltarea front-end și back-end. Proiectele complete pe GitHub oferă o modalitate grozavă de a învăța și de a-ți dezvolta abilitățile de dezvoltare. Implementarea unui proiect full-stack vă va ajuta să stăpâniți HTML și CSS în timp ce vă îmbunătățiți capabilitățile de programare legate de:

  • Browsere (folosind jQuery, Angular, JavaScript, Vue etc.)
  • Servere (folosind PHP, Python, Node etc.)
  • Baza de date (folosind SQL, SQLite, MongoDB etc.)

În plus, dezvoltarea full-stack este o profesie foarte solicitată. Deoarece dezvoltatorii cunosc cele mai recente tehnologii și toate aspectele tehnicilor utilizate, ei pot realiza rapid un prototip și pot sprijini alți membri ai echipei. În acest fel, dezvoltatorii calificați full-stack reduc costul total al proiectului și permit comunicarea eficientă în echipă.

Cuprins

Proiecte complete pe GitHub

Învață să construiești aplicații precum Swiggy, Quora, IMDB și multe altele

1. Atingeți Știri

Este o aplicație web bazată pe React, care recomandă automat știri pe baza jurnalelor utilizatorilor. Practic, TapNews colectează știri dintr-o varietate de surse și aplică învățarea automată pentru a sugera subiecte. Îndepărtează duplicatele folosind algoritmul TF-IDF și prezice subiecte de știri folosind TensorFlow CNN. În plus, JSON-RPC ajută la comunicarea între mai multe servicii backend.

2. Fullstackinator

Acest proiect folosește un server Node.js cu Express și Next.js pentru aplicația React. Acesta servește ca o placă solidă pentru proiecte la scară largă și cuprinde o structură simplă de organizare a dosarelor. Fullstackinator încorporează Redux pentru gestionarea globală a stării și o configurare Typescript atât în ​​fișierele server, cât și în fișierele client. Deci, puteți verifica acest proiect open-source pentru a obține mai multă claritate despre funcționarea Node.js, Next.js, Typescript, Redux și a componentelor stilate.

3. PostVapoRS

PostVapoRS se referă la stiva completă cu PostgreSQL, Vapor, React și Swift. Acest proiect GitHub, de asemenea, următoarele instrumente de dezvoltare backend și front-end:

  • MySQL
  • SQLite
  • MariaDB
  • JavaScript
  • jQuery
  • Reacţiona
  • Vue
  • unghiular
  • Svelt
  • Popper, etc.

4. MongoVapoRS

Acest proiect este destul de similar cu ideea de mai sus, dar folosește MongoDB în loc de PostgreSQL. Puteți replica MongoVapoRS pentru a vă familiariza cu dezvoltarea bazelor de date, driverele de baze de date, cadrele de aplicații și bibliotecile. Deci, accesează codul și exersează departe!

5. De asemenea, PPM full-stack

Puteți găsi codul acestui instrument personal de management de proiect aici , disponibil gratuit pe GitHub. A fost construit folosind React și SpringBoot. Proiectul full-stack-ppm-tool are următoarele funcționalități:

  • Caracteristici de înregistrare și autentificare utilizator
  • Autentificarea utilizatorului prin JWT Token
  • Operațiuni CRUD

6. CodingAI

Acest proiect inovator se bucură de o mare comunitate de colaboratori. CodingAI este un exemplu excelent de aplicație full-stack care le permite dezvoltatorilor să găsească mentori legați de tehnologia lor. Documentația sa cuprinzătoare de proiect vă poate ajuta să aflați despre React, CSS, Redux și dezvoltarea responsive.

7. Catalog de articole

Un proiect tipic de catalog de articole oferă o listă de articole din diferite categorii și constă în înregistrarea utilizatorului și sistemul de autentificare. Acest depozit GitHub include toate aceste caracteristici și le acoperă în detaliu. Proiectul de catalog de articole a fost construit cu HTML5, Bootstrap, SQLAlchhemy, Vagrant și Flask. De asemenea, permite conectarea socială OAuth2 cu Google și Facebook.

La autentificare, utilizatorii pot selecta anumite articole pentru a aduna informații despre produse. De asemenea, pot adăuga, edita și șterge informații despre articol. La deconectare, pagina de pornire apare goală, fără elemente adăugate.

Proiectul indică, de asemenea, posibilități de îmbunătățire a designului layout-ului și implementarea protecției CSRF pe operațiunile CRUD. Dacă aveți deja ceva experiență în acest domeniu, ar putea merita să încercați.

8. Tutorial complet

Puteți parcurge acest tutorial pentru a înțelege cum să implementați o aplicație CRUD folosind JavaScript (React) pentru front-end și Python (Flask) pentru backend. Condițiile preliminare pentru dezvoltarea de la zero includ Node.js și Anaconda (Python 3). Un tutorial de aplicație se poate dovedi benefic pentru începătorii care altfel ar putea fi intimidați să înceapă singuri.

9. Simțiți

Feel este o aplicație open-source care oferă o soluție progresivă pentru a aborda problema anxietății umane. Conectează oameni care au trecut prin situații de viață similare și indică postări legate de cărți, mâncare, jocuri, filme și muzică. În acest fel, creează un spațiu sigur pentru împărtășirea problemelor și chiar oferind o distragere zilnică a atenției unora. Iată o privire asupra conținutului tehnic al aplicației Feel:

  • Back end: NodeJS, Express și MongoDB
  • Front end: ReactJs și alte câteva dependențe
  • Mobil: Expo și React Native

10. Harta cartierului Berlinului

Este o aplicație web cu o singură pagină care prezintă o hartă a cartierului dvs. Cu acest proiect de hartă, evidențiați locuri, identificați locuri populare cu marcatori de hărți, adăugați date terțe și includeți o funcție de căutare și o listă de vizualizare a tuturor locațiilor. Vă puteți îmbunătăți abilitățile KnockoutJS și Google Maps API prin replicarea codului acestui proiect.

11. Menajera

Aplicația web Housekeeper le permite studenților să programeze servicii de curățenie pentru camerele lor de la cămin. Deoarece studenții au orele de curs variate, curățarea camerelor la timp într-un mod eficient din punct de vedere al resurselor este o provocare semnificativă. Acest proiect abordează această problemă direct prin designul schemei bazei de date și prin aplicațiile web front-end și backend. Codul sursă pentru toate cele trei segmente este disponibil în depozit.

12. Sistemul de management al spitalelor

Acest proiect GitHub folosește următoarele limbaje și tehnologii:

  • HTML5/CSS3
  • PHP
  • Bootstrap
  • Javascript (pentru a actualiza conținutul dinamic)
  • XAMPP (un server web Apache Friends)
  • TCPDF (software open source pentru generarea PDF)

Puteți rula acest proiect pe computer pentru a vă da seama cum funcționează și pentru a vă familiariza cu complexitățile sale. Ar trebui să instalați XAMPP în mașina dvs. și, în mod ideal, să utilizați Sublime Text ca editor de text și Google Chrome pentru a rula proiectul.

13. BookMyShow Clone

Dacă vrei să înveți cum să folosești Django, acest proiect este pentru tine. Acest depozit GitHub vă oferă o replică completă a Book My Show cu următoarele elemente:

  • Pagina Filtru film
  • Pagina cu detaliile filmului
  • Lista teatrelor/sălilor de cinema
  • Pagina de rezervare

14. Blog de mâncare japoneză

Acest depozit GitHub are codul sursă al site-ului J Food Blogger. Stack-ul de tehnologie a fost construit folosind Node.js, Express, MongoDB, Bootstrap și Cloudinary. Oamenii pot împărtăși experiențe culinare japoneze pe site creând un profil personal, încărcând imagini, scriind bloguri, comentând etc. Utilizatorii pot căuta și postări de interes.

15. Veudo

Este un exemplu de aplicație de gestionare a sarcinilor care vă permite să vă organizați activitățile de zi cu zi și să vă îmbunătățiți productivitatea. Veudo utilizează stiva PEVN, care constă din PostgreSQL, Express, Vue și Node. Pe măsură ce locurile de muncă adoptă din ce în ce mai mult modelul de lucru de acasă, relevanța aplicațiilor de făcut este în creștere. De asemenea, puteți utiliza astfel de aplicații pentru a urmări treburile și responsabilitățile personale, cum ar fi realizarea de liste de cumpărături sau setarea mementourilor pentru zile de naștere.

Aflați: Django vs NodeJS: Diferența dintre Django și NodeJS

Învață cursuri de inginerie software online de la cele mai bune universități din lume. Câștigă programe Executive PG, programe avansate de certificat sau programe de master pentru a-ți accelera cariera.

Încheierea

Cu aceasta, am acoperit un amestec interesant de idei care ar fi utile pentru dezvoltatorii web și studenții aspiranți. Lista de mai sus de proiecte cu stiva completă de pe GitHub vă va ajuta să vă familiarizați cu cele mai bune practici de dezvoltare și să vă îmbunătățiți competențele tehnice. Așadar, încercați-vă mâna la un proiect complet și începeți călătoria de învățare astăzi!

Dacă sunteți interesat să aflați mai multe despre Javascript, dezvoltarea full-stack, consultați programul Executive PG de la upGrad și IIIT-B în dezvoltarea software full-stack, care este conceput pentru profesioniști care lucrează și oferă peste 500 de ore de formare riguroasă, peste 9 proiecte , și misiuni, statutul de absolvenți IIIT-B, proiecte practice practice și asistență pentru locuri de muncă cu firme de top.

Deveniți un dezvoltator Full Stack

Aplicați acum pentru Programul Executive PG în Full Stack Development