Svježi resursi za web-dizajnere i razvojne programere (listopad 2017.)
Ovaj mjesec Fresh Resouces bit će nešto drugačiji od prethodnih mjeseci. Mi, web-programeri, živimo u industriji koja se brzo mijenja, i vidjela sam mnogo najava nekih od najvećih tehnoloških tvrtki kao što su Google, Microsoft, Firefox i PHP, što će promijeniti način na koji gradimo na webu.
U ovom dijelu pola našeg popisa bit će o tim najavama. Dakle, budite spremni pozdraviti budućnost!
Osnovna optimizacija slike
To je iscrpan članak za optimizaciju slike za web napisao Addy Osmani. To nije kao drugi pisati-ups koji se vrte oko kako-to, ili učiniti i ne samo.
Ovaj članak vas zapravo vodi kroz tehničke detalje kao i znanost iza optimizacije. Također ćete pronaći temeljite informacije o nekoliko pristupa za optimizaciju i formate slika, alate, savjete i neke primjere iz stvarnog svijeta.
PHP 7.2
Sveobuhvatan referenca na ono što dolazi u PHP 7.2. Osim dodataka koji poboljšavaju performanse aplikacija PHP, dolazi i PHP 7.2 amortizacija u kojoj će se ukloniti nekoliko stvari i ne bi se više trebala koristiti.
U PHP-u 7.2 postoje dvije funkcije koje će biti zastarjele create_function () i __autoload (). Ako ste web-razvojni programer, pregledajte svoj kôd i izvršite potrebne promjene. Vidio sam brojne WordPress dodatke koji još uvijek koriste te dvije funkcije.
Web Share API
Iskreno, nisam vidio ovaj API koji dolazi na web. Međutim, s obzirom na pola naše interakcije na webu “dijeljenje”, ovaj API uvelike će učiniti stvari web-razvojnim programerima lakše izraditi izvorno iskustvo dijeljenja, osobito na mobilnoj platformi.
Ovaj je API trenutno dostupan samo u pregledniku Google Chrome za stolna računala i Androidu. Pogledajte ovaj videozapis na usluzi Youtube da biste ga vidjeli na djelu.
Atribut Async slike
Još jedna stvar koja će revolucionirati web je async atribut za element img. U vrijeme pisanja, postoji nekoliko pristupa učitajte sliku asinkrono koja uključuje mali JavaScript. Uskoro ćemo moći dodati asinkroni = o na img element.
Kvantni Firefox
Mozilla agresivno gura ažuriranja za Firefox s nekim poboljšanjima, pod nazivom pod nazivom “Projekt Quantum”. To uključuje i Quantum CSS - novi motor za iznimno brzi CSS prikaz, novi sučelje i novi DevTools.
Izdanje je dobivanje vuču u web programerima a neki su već prebacili svoj glavni preglednik na Firefox. Postoji još nešto što će se pojaviti u ovom projektu, uključujući Quantum DOM i WebRender. Hoćemo li vidjeti kandidata Node.js na temelju Firefox Quantum motora? Pa, možda da.
MS Edge za iOS i Android
Microsoft je upravo objavio objavite svoj najnoviji preglednik, Edge, za iOS i Android. To znači da postoji još jedan preglednik za vaše web-lokacije za testiranje.
Gutenberg
WordPress je trenutno na ambicioznom projektu, koji se zove Gutenberg. Gutenberg je facelift u WordPress uređivač izgrađen gotovo u cijelosti s JavaScriptom.
U ovom trenutku, Gutenberg je izgrađena s React ali projekt razmatra drugi okvir kao što su Preact, Vue ili nešto drugo. Za sada je to komplicirana situacija. Dakle, za WordPress programere izgradnju teme i dodataka, držati tvoj oči na projektu kao to će zauvijek promijeniti način na koji gradimo WordPress.
FoitFout
FoitFout je praktičan alat za usporedbu dva različita pristupa takozvanim FOIT i FOUT do učitajte prilagođene fontove na webu. Pomoću ovog alata možete emulirati dva pristupa i odlučiti koji je pristup najprikladniji za vašu web-lokaciju.
Vuera
Vuera je a JavaScript knjižnica koja vam omogućuje da koristite Vue i React zajedno. Možete uključiti Vue komponentu iz .vue ili upotrijebite komponentu React u Vue. Vaš tim sada može biti produktivniji s bilo kojim okvirom koje preferiraju.
Mogućnost povlačenja
“Mogućnost povlačenja” je fantastična knjižnica iz Shopifya. Izgrađen je na izvornom pregledniku Drag-n-Drop API i omogućuje vam opsežan API za rad. U slučaju da ne sadrži nešto što vam je potrebno, možete napisati a prilagođeni modul za proširenje njegovih funkcionalnosti. Pogledajte demo da biste vidjeli kako radi.
FlowchartJS
Kao što ime implicira, FlowchartJS je a koja omogućuje izgradnju dijagrama toka kao u PowerPointu. Slično tome, možete stvoriti različite oblike grafikona uključujući krug, elipsu, kvadrat, dijamant, trokut itd.
QuickBill
Lagana i jednostavna web-aplikacija za izradu računa. Koristi tehnologiju izvornog preglednika i API-je za pokretanje tako da nema potrebe za računom. Jednostavno idite na web-lokaciju, dodajte stavke na račun i generirajte PDF datoteku. To je to!
Mocka
Mocka je a sadržaja rezerviranog mjesta koje možete koristiti za izradu prototipova web-lokacije. To je samo 500 bajtova i potpuno prilagodljivo. Možete ga jednostavno uključiti u CSS datoteku svog projekta pomoću Sass mixina.
CSS pruža brojne klase uključujući mocka-media da biste stvorili rezervirano mjesto slike, mocka-naslov za stvaranje naslova i mocka tekst za izradu proizvoljnog teksta.
VueStar
VueStar je a Vue komponenta za dodavanje iskričavog efekta kada kliknete na ikonu, slično onome što Twitter radi s “srce” u svojoj mobilnoj aplikaciji. Komponenta predstavlja novi element pod nazivom vue zvjezdica gdje ga možete dodati u web-doba. I gotovi ste!
Grid igralište
CSS Grid uvodi novi koncept na webu za izgradnju rasporeda i na prvi pogled je kompleksan s obzirom na brojne nove značajke koje ima.
GridPlayground je u osnovi a Mozilla inicijativa za podučavanje CSS Grid i guranje CSS Grid naprijed. Čak i Firefox donosi novi alat za DevTools za pregled Grid izgleda.
Upravitelj isječka
“Upravitelj isječka” je jednostavan aplikacija za pohranu i upravljanje isječcima koda. Možete stvoriti novu stavku, zalijepiti kôd i postaviti točku. U ovom trenutku, ništa previše fancy i to samo daje izvorni kod koji ćete morati kompajlirati pomoću NPM.
Kartično sučelje
Velika prolazak kroz izgradnju progresivne i pristupačne navigacije pomoću kartica uz minimalno korištenje JavaScripta. Izvrstan izvor za one koji žele saznati više o pristupačnom dizajnu.
SwissInCSS
SwissInCSS izlaže nekoliko klasičnih švicarskih dizajna plakata koristeći samo jedan CSS. Izvorni kod dostupan je u CodePenu.
