Share
CodePen este un instrument de neprețuit - ne ajută să explicăm lucrurile și să facem tutorialele noastre de cod de la front-end cu atît mai atrăgătoare. Ca recunoaștere a acestui fapt, să aruncăm o privire asupra unor pixuri din Tuts + tutoriale și cursuri care au lovit cu adevărat o coardă cu comunitatea noastră!
Acest tutorial de George Martsoukos ia o listă neordonată, afișează elementele sale ca o cronologie verticală (receptivă). George continuă apoi să verifice dacă elementele au intrat în fereastra de vizualizare pe parcurgere, animându-le la locul lor odată.
Cu peste 21.000 de vizionări și 500 de placeri, acest stilou este unul dintre cele mai populare pe care le-am postat!
Donovan cu sediul în Dublin știa exact ce vroiai cu toții când a scris acest lucru. Urmați tutorialul acestui începător pentru a afla nu numai aspectele practice ale animației CSS de codificare, dar și craftul intangibil al "recursului" care merge împreună cu acesta.
Acest curs este extrem de popular. Urmați-o pe Kezz Bracey pe măsură ce construiește zece proiecte CSS3 diferite, toate pe CodePen, toate concentrate pe interfața și layout-ul. Iată un astfel de proiect, în care demonstrează cum se construiește un UI funcțional, animat, fără un jot de JavaScript:
Cursul de urmărire al lui Kezz sa inspirat din "Branding and Presentation", demonstrând încă o dată modul în care se construiesc 10 proiecte CSS3 din mediul familial al CodePen. Acest demo particular este o prezentare de tipul "PowerPoint", din nou fara nici un JavaScript.
Acest tutorial a fost așteptat cu nerăbdare de mulți dintre dvs., dornici să transfere învățările materiale ale Google în browserul web. Iată doar unul dintre pixurile din tutorial, dar unul care a văzut câteva câteva mii de vizionări. Dă-i drumul!
Imi place asta. Dar atunci, ca și purtător de pavilion pentru proiectul de traducere Tuts +, nu-i așa? În orice caz, dacă nu ați gândit niciodată la ce unicode-bidi: încorporați; va face pentru paginile dvs. de web RTL, poate că este timpul să verificați acest stilou popular!
Dennis a făcut o treabă bună din acest! Doar încercați să vă opuneți derulării ... Dacă sunteți interesat să aflați despre ScrollMagic, acesta este un tutorial cu adevărat accesibil pentru a vă începe. Luați o cafea și se arunca cu capul înăuntru.
Multe dintre cursurile lui Craig Campbell utilizează CodePen ca o modalitate de a stabili proiecte și de a le vedea până la finalizare. În acest curs demonstrează o serie de modalități de utilizare a platformei de animație GreenSock (GSAP), inclusiv acest preloader mesmeric popular:
Un alt curs de aici, și unul dintre cursurile cele mai vizionate din ultimele luni. Învață exact ceea ce te-ai aștepta, așa că, dacă încă ai murdărit mâinile cu flexbox, aceste proiecte (ca această rețea de imagini receptivă) te vor duce!
Ce sa mai spus? Bucurați-vă de stilourile menționate mai sus, verificați tutorialele și cursurile de la care au fost preluate și asigurați-vă că urmați Envato Tuts + pe CodePen!
Accentsconagua