Skip to main content

Structura – Framework (cadre, grile) – partea 1

Daca vrei o solutie rapida pentru a avea un site responsive sau nu ai cunostintele necesare CSS pentru a crea unul asa cum trebuie, poti sa folosesti una dintre uneltele de tip framework gratuite:

  1. Twitter Bootstrap, momentan la versiunea 4.3, disponibil la adresa http://getbootstrap.com/getting-started/, a fost prima oara lansat in 2011 de catre doi dintre programatorii retelei de socializare Twitter, Mark Otto si Jacob Thornton. Pe GitHub, o platforma unde sunt puse scripturi web, are o popularitate in jur de 75000 stele. Aceasta grila are un comportament perfect chiar si pentru ultimele telefoane, calculatoare, tablete si laptopuri. De asemenea, design-ul este unul de bun gust. Poti descarca Twitter Bootstrap fie luand codul sursa, fie versiunea compilata care trebuie dezarhivata. Indiferent de optiunea aleasa, trebuie incarcata in directorul radacina prin clientul FTP. Boostrap vine cu fisiere al caror cod contine HTML, JS si CSS. Ca si elemente, el contine butoane, meniuri, liste, antente, alerte, bare de progres, pop-up-uri, carousel, slide, galerii si multe altele. Aditional, poti sa descarci versiunea portabila de la Less la Sass pentru a include framework-ul usor in proiecte facute in Rails on Ruby si Compass. Bootstrap este valabil in mai multe limbi si este suportat de navigatoare de internet cum ar fi Firefox, Chrome, Safari, Opera, Dolphin, Chromium, Edge, Internet Explorer si altele. In prezent, framework-ul este folosit si in teme WordPress, dar nu numai.
  2. Foundation 6 este disponibil la https://foundation.zurb.com/ si este un alt framework, super interesant. A fost creat in 2011 de ZURB, iar popularitatea sa creste pe zi ce trece, ajungand la peste 28.000 de stele pe GitHub. Dintre caracteristicile generale mentionam: flexibilitate, posibilitatea de personalizare, lizibilitatea si actualizarile constante care includ si teme HTML, resurse si diferite coduri. Poti folosi Foundation 6 pentru a crea site-uri in HTML, CSS si Javascript, sau pentru a crea e-mailuri in HTML si aplicatii cu Angular si Flexbox. Printre companiile mari care folosesc Foundation 6 se numara Adobe, eBay, HP, Cisco, Amazon, EA, Samsung, Ford, Mozilla, Pixar, Disney si asa mai departe. Echipa din spatele framework-ului ofera tutoriale, cursuri personalizate si certificari. Daca folosesti Yeti Launch pentru Mac, poti crea si proiecte Sass cu un click. Trebuie doar sa descarci si sa instalezi unealta. Yeti foloseste librarii JS cum ar fi UnCSS, UglifyJs, HandleBars si compresia imaginilor pentru a imbunatatii viteza de incarcare a site-ului. Pentru a folosi Foundation pentru e-mailuri, ai nevoie de Outlook, unde vei face testele si vei adauga stilul tau folosind Inky’s Inliner. Iar pentru a crea aplicatii, instaleaza versiunea Foundation pentru Apps CLI, creeaza un proiect nou si porneste procesul de creare a aplicatiei.
  3. Semantic UI este un alt framework responsiv, mai nou decat Bootstrap si Foudnation, creat in 2013 de Jack Lukic si are o popularitate mai mica pe GitHub. Cu aceasta unealta, poti realiza site-uri frumoase si prietenoase rapid datorita codului HTML concis, codul Javascript intuitiv, a sistemului simplificat de verificare a erorilor, a mai mult de 3000 de teme, 50 de componente, librarii JQuery si parteneri care lucreaza constant la proiect. Pentru a folosi Semantic UI, trebuie sa il descarci de la https://semantic-ui.com/, sa il incarci prin FTP sau sa il instalezi direct prin pachetul NPM. Manual, il poti instala incepand cu instalarea NodeJS, Gulp, Semantic UI si apoi includerea fisierului index.html. Diferitele componente aflate in acest framework, te pot ajuta sa creezi teme, sa creezi grile, sa migrezi de la Bootstrap, sa creezi pagini, meniuri sticky sau fixe, formulare de logare, butoane, antete, iconite, imagini, liste, tabele, comentarii si altele. Semantic UI foloseste module ca si Accordion, Checkbox, Dimmers, Dropdown, Embed, Modal, Nag, Pop, Progress, Rating, Search, Shape, Sidebar, Sticky, Tab si Transition.

Leave a Reply

Suna
Whatsapp