Resurse proaspete pentru designeri web și dezvoltatori (iunie 2015)

Puteți crede că această serie a fost difuzată de aproape 3 ani? În această perioadă scurtă de timp, am prezentat cel puțin 30 de liste cu cele mai proaspete resurse pentru web designeri și dezvoltatori. Și vom continua să mergem cu o nouă compilație pentru luna iunie.

În această compilație vom analiza câteva biblioteci JavaScript pentru afișarea glisoarelor, derularea mai ușoară a tabelelor de date, efectul ascensorului răcoros pentru un buton de derulare în sus și multe altele.

Să le verificăm.

Confirmarea stilului mediu

Mediu a fost lăudat pentru designul său; aspectul și interfața de utilizare pare să fi fost gândite în detaliu. În plus, aceasta îi inspiră pe dezvoltatorii web să dezvolte librării JavaScript sau CSS pentru a replica interfața utilizator. Medium Style Confirm este o bibliotecă JavaScript care seamănă cu fereastra pop-up sau dialog din Medium.

Pinguin

Penguin este un nou cadru front-end pe care l-ați putea folosi ca bază a site-urilor dvs. web. Cu instrumente cum ar fi Grunt și Sass, puteți adăuga sau elimina cu ușurință biblioteci sau CSS pe care nu aveți nevoie să le scoateți din cadru, făcându-l cât mai ușor posibil. Este, de asemenea, o bună alternativă pentru Bootstrap și Fundația.

Elevator.js

Ați văzut acel buton dintr-un site web care vă permite să alunecați în partea de sus a paginii? Cele mai multe butoane te iau pe partea de sus, dar cu Elevator.js, vei obține un efect de accelerare alunecător similar unui lift, muzicii și “Ding!” sună când ajungi la ultimul etaj. Foarte dragut!

X-Instagram

X-Instagram este un element personalizat din polimer care trage și arată imagini din Instagram după etichetă. Acest element face întregul proces mult mai ușor. Pur și simplu adăugăm elementul la fel ca un element HTML obișnuit și specificăm cuvântul cheie tag ca element de atribut.

Și să înceapă magia!

CamanJS

CamanJS este o mare bibliotecă JavaScript pentru manipularea imaginii. Acesta vine cu un set de caracteristici pe care l-ați găsi în mod obișnuit într-un editor de imagini. Puteți bloca imaginea, alb-negru și chiar crește contrastul.

ClusterizeJS

Clusterize.js este o bibliotecă JavaScript care va crește performanța atunci când se ocupă de o mulțime de date din tabele. Pe măsură ce defilați pe o masă cu, să zicem, 5000 în listă, în mod normal, experiența se va întoarce lagună și jignitoare. Această bibliotecă JavaScript va aborda această problemă, făcând acțiunea de defilare să navigheze perfect până la capăt.

Stați testul

Stați testul este o colecție de întrebări pentru a vă evalua abilitățile și cunoștințele pe CSS3, HTML5 și JavaScript. Fiecare test are numeroase întrebări și un timp limitat pentru a completa toate aceste întrebări. Este o sursă bună pentru a afla cât de bune suntem cu aceste limbi.

Șuruburi HTML

Aceasta este o colecție de simboluri native Unicode speciale pe care le puteți încorpora în HTML și CSS. Aceste caractere includ săgeți, valută și punctuație. Veți găsi că, uneori, nu aveți nevoie de pictograma pentru a afișa aceste caractere.

Flickity

Flickity este o bibliotecă JavaScript pentru a afișa caruseluri, galerii sau glisoare pe site-ul dvs. Web. Este optimizat pentru ecranul tactil; puteți glisa caruselile fără efort cu un deget sau cu trackpad-ul dacă sunteți pe un laptop. De asemenea, vine cu o grămadă de opțiuni care permit personalizarea completă în orice fel doriți.

Typeslab

Typeslab este un instrument util pentru a crea un poster de tip Slab. Pur și simplu scrieți conținutul și alegeți fontul, Tipeslab va genera instant posterul. Apoi îl puteți descărca sau îl puteți publica în Imgur.

MatchMedia

Matchmedia este o bibliotecă care reproduce interogările media CSS. Biblioteca nu este chiar așa proaspătă, dar este o bibliotecă foarte utilă pe care am decis să o pun pe listă. Dacă trebuie să faceți scripturi bazate pe dimensiunea portului de vizualizare al utilizatorului sau pe tipul de media, aceasta este biblioteca dorită.

Următorul este un exemplu folosit pentru a rula un script într-o dimensiune de vizualizare de 320px și mai mică:

 dacă (matchMedia ("numai ecranul și (max-width: 320px)"). 

Sass Burger

Sass Burger vine cu un Mixin care vă permite să creați un “Hamburger” pictograma și transforma-o într-o marcă încrucișată cu mai puțin hassle.

Marx

Marx este o colecție de reguli de stil CSS pentru a face stilurile de elemente mai coerente. Este personalizabil (cu Sass), ușor, și funcționează din cutie. O bună alternativă la utilitarele CSS de resetare deja cunoscute, cum ar fi Normalize.css.

CSS.js

CSS.js este folosit pentru a analiza fișiere CSS pentru declarația de stil. Biblioteca a fost inițial utilizată pentru echipa de la Jotform pentru a construi o experiență WYSIWYG pentru editarea formelor cu CSS. Acum ei au deschis acest lucru pentru ca noi toți să le folosim. Merită să economisiți, doar dacă aveți nevoie mai târziu.