Introducere

Daca acum inveti sa programezi, inseamna ca cel mai probabil ai ceva idei pentru o aplicatie ce vrei sa o construiesti. Dar inainte de a construii aplicatia, va trebuii sa alegi un set de tehnologii – asa ca mai bine te-ai documenta inainte, deoarece daca iei decizia gresita iti vei da cu capul de pereti destul de des.

Fiecare aplicatie este defapt o shaorma cu tehnologii, iar in videoul de astazi va voi invata cum sa faceti o shaorma. O sa ne uitam la stack-uri populare, precum: LAMP, MEAN, MERN MEVN, FLUF, samd. Iar mai apoi o sa va arat ce decizii am luat in procesul de alegere a tehnologiilor pentru platforma-de.info

LAMP

Cel mai popular tech stack este LAMP – ce a fost definit prima oara in 1998, iar abrevierea literelor vine de la Linux Apache MySQL si PHP. Daca voiai sa cosntruiesti un website in anii ’90 era mult mai complicat fata de procesul din ziua de azi. LAMP este un tech stack gratuit si open-source care in cele din urma a favorizat aparitia framework-urilor precum Wordpress si Joomla.

In vremurile noastre in schimb, sa construiesti o aplicatie este mult mai usor, dar paradoxal tech stack-urile au devenit din ce in ce mai complicate.

Ce este un tech stack?

Din nefericire nu exista o definitie exact a acesteia, asa ca o sa sparg explicatia in 3 parti:

• Front-End – sau diverse tool-uri ce sunt necesare pentru a construii o interfata pentru utilizatori. Atunci cand construiesti website-uri asta va insemna de cele mai multe ori JavaScript, sau pentru mobile cel mai probabil vei ajunge la: Swift (pentru iOS), Kotlin (pentru Android) sau Flutter daca doresti ceva mai hibrid.
• API – este practic un lipici ce vine intre front-end si back-end pentru a conecta cele doua componente. Asta ar putea include REST sau GraphQL. Daca doresti sa introduci chestii mai avansate (de exemplu plata cu cardul online), atunci vei mai apela la Stripe (pentru procesarea platilor cu cardul), Twillio (pentru trimiterea notificarilor prin SMS) sau Mailgun (pentru trimiterea e-mail-urilor in siguranta)
• Back-End – ce include logica aplicatiei tale. Aici ai de ales intre limbaje precum NodeJS si Python. De asemenea mai trebuie sa alegi si o baza de date, iar aici intervin MongoDB, Redis sau MySQL. Iar pentru a urca toata infrastructura vei apela de cele mai multe ori la Amazon Web Services sau Google Cloud.

Stack-uri populare

Iar acum haideti sa analizam cele mai populare stack-uri existente.

MEAN – Vine de la MongoDB Express Angular si NodeJS – dar acesta poate avea diferite variatii in functie de tehnologiile folosite. De exemplu noi la platforma avem MySQL Express Vue si NodeJs, abreviat ar venii MEVN.

Daca doresti sa vedeti ce alte companii folosesc, atunci va recomand stackshare.io unde puteti vedea ce tehnologii sunt populare si ce companii apeleaza la ele.

Cum am construit platforma?

Front-end

Prima intrebare care ne-a venit in minte a fost: “de unde vor accesa utilizatorii cel mai des website-ul?”. Iar intre toate optiunille posibile (Web, iOS, Android, Desktop) cred ca este evident ca majoritatea utilizatorilor vor venii din traficul web.

Atunci cand lucrezi pe aplicatii web, singura ta optiune este sa mergi pe JavaScript, desigur ca avem alternative precum Blazor (pentru C#) si Flutter pentru a ocolii lumea JS, dar pentru mai multe siguranta, am decis sa mergem pe JavaScript.

Am ales sa mergem pe Vue deoarece aveam deja experienta in acesta si este destul de usor de invatat. De cele mai multe ori, framework-ul pe care il alegi este acela in care te simti cel mai comfortabil, asa ca asta am facut si noi. Pentru a gestiona variabilele de pe o pagina pe alta (cunoscut drept state management) am mers pe Vuex.

Pentru a nu petrece sute de ora scriind un CSS, am ales sa merge pe Bootstrap deoarece tot ceea ce trebuie sa facem este sa apelam clasele in HTML. De asemenea, am dorit sa avem un procesator de CSS asa ca am apelat la SASS deoarece avem optiuni in plus precum: variabile, mosteniri si functii. Iar pentru a construii bundle-urile finale, practic fisierele js care sunt incarcate catre utilizatori am apelat la Webpack.

Back-end

Primul lucru la care ne-am gandit atunci cand am inceput sa lucram la back-end a fost baza de date. Deoarece avem foarte multe relatii intre entitati (useri, probleme, lectii, intrebari, s.a.m.d.) am ales sa merge pe MySQL. Si dupa cum prea bine stiti, query-urile catre o baza de date MySQL nu sunt cele mai eficiente, asa ca am apelat si la Redis pentru a stoca in cache anumite valori, si pentru a usura apelurile catre DB.

Acum ca am hotarat ce baze de date vom folosii, mai trebuie sa alegem un environment in care legaturile intre front-end si db vor fi scrise. In general avem foarte multe optiuni din care putem alege, de exemplu daca am fi mers pe PHP, aveam Laravel la indemana, sau daca alegeam sa mergem pe Python am fi avut Flask sau Django. Dar deoarece am construit deja front-end-ul in JS am ales sa mergem pe NodeJs, mai precis: Express.

Pentru ca nu am vrut sa scriem query-uri manual, am ales sa mergem pe Sequelize – o librarie care adauga obiectelor functii precum findOne, findAll, sum si asa mai departe. Practic noi ne vom putea concentra mai mult pe arhitectura, iar libraria se va ocupa de scrierea query-urilor catre baza de date.

Sockets

Din cate probabil ati observat, pe website avem optiunea de a trimite notificari live. De exemplu daca cineva iti da o cerere de prietenie, o vei primii instant, fara sa fie nevoie sa dai refresh la pagina pentru a o vedea. Un sistem similar este folosit si in Facebook atunci cand folosesti Messenger.

Docker

Pentru a standardiza mediul de lucru, am apelat la Docker pentru a creea containere care ne ajuta in momentul cand dam deploy la o noua versiune a aplicatiei. Sau atlfel spus: folosim Docker pentru a urca ultimele imagini pe AWS.

APIs

Apelam la mai multe APIs care ne usureaza mult munca, precum:

– Mailgun pentru a trimite notificari prin e-mail catre voi (atunci cand va inregistrati sau pierdeti parola, de exemplu)
– Sentry pentru a colecta si analiza mai usor erorile care apar pe in FE si BE
– NewRelic pentru a analiza performanta aplicatiei si modul cum aceasta scaleaza