Tuoreet resurssit web-suunnittelijoille ja kehittäjille (maaliskuu 2017)

CLI (Command Line Interface) -toiminnolla pystymme virtaviivaistaa ja automatisoida web-kehityksen työnkulkuja. Siksi tässä erässä olemme sisällyttäneet melkoisen määrän mahtavia CLI: itä, jotka voit asentaa paikalliselle tietokoneellesi tai suorittaa jotakin tavaraa palvelimella. Lisäksi olemme myös ottaneet muutamia PHP-työkalut, selaimen lisäosat ja JavaScript-kirjastot. Tarkistetaan ne.

Klikkaa lisää resursseja

Etsi koko kokoelma suositeltuja resursseja ja parhaat web-suunnittelu- ja kehitystyökalut.

Guetzli

Uusi kooderi Googlelta mahdollistaa kuvan pienentämisen jopa 35% alkuperäisestä koosta säilyttäen samalla laatu. Se on melko läpimurto, kun otetaan huomioon, että samankaltaiset avoimen lähdekoodin lähettimet, kuten JPEGOptim ja jpegtran ovat enintään 20% keskiarvosta. Näen, että CMS-alustalle tulee useita sovelluksia ja laajennuksia, jotka integroivat Guetzlin JPEG-tiedostojen optimointiin.

Kehittäjän etenemissuunnitelma

Kuten nimestä käy ilmi, kehittäjän etenemissuunnitelma on Web-kehittäjän matkojen infografia. On kolme kursseja: Front-end, Back-end ja DevOps. Nämä etenemissuunnitelmat ovat kuin kartta; ja ovat hyvä viittaus Missä olemme tällä hetkellä, mitä olisimme voineet unohtaa ja mihin olemme menossa seuraavaksi.

Netlify CMS

SmashingMagazine on äskettäin tehnyt a rohkea siirto ojaan WordPress ja kokeile jotain uutta kokonaan uudella CMS: llä nimeltä Netlify CMS. Se on uusi CMS, joka on rakennettu React.js: n päälle ja voi olla integroitu mihin tahansa staattiseen sivuston generaattoriin, kuten Jekyll, Hugo ja MiddleMan.

BadSSL

Se on a Web-sivusto tarkistaa SSL-määritykset. BadSSL on kätevä työkalu virheenkorjauksen ja virheiden tekemiseen sivustossasi asennettuun SSL: ään.

Alix

Alix on a Chrome-laajennus, jonka avulla voit tarkistaa sivustosi saatavuuden. Kun laajennus on asennettu ja otettu käyttöön, se lisää overlay-ruudun useisiin sivun elementteihin jotka aiheuttavat varoituksia tai virheitä.

AR.js

AR.js on JavaScript-kirjastot toisin kuin muut. Tämän kirjaston avulla voimme luoda laajennetun todellisuuden Web-tekniikan avulla yllättäen kulkee todella nopeasti matkapuhelimissa.

Reagoi trendiin

Se on a reagoi Unsplash-komponenttiin luodaksesi ihanan viivakaavion tyypillisesti trendien näyttämiseksi. Komponentti on konfiguroitavissa; voit määrittää linjan paksuuden, värin, kaltevuudet ja käyrän sileyden. Voit yksinkertaisesti käyttää käyttöliittymää luo kätevästi komponenttikoodi.

Gitee

macOS-sovellus, jolla voit seurata Github-toimintaasi suoraan työpöydältäsi, Gitee lisää tilariville uuden kohteen, jossa näkyy tähtiä, seuraajia ja ilmoitusta. Lisäksi voit myös tarkastella push-kaavioita ja sitoutuu arkistoon sekä trendikäyttöön nykyisellä kuukaudella ja viikolla. Se on Github Desktopissa pähkinänkuoressa.

Goops

Goops on a kätevä CLI, joka analysoi projektihakemistosi ja määritä hakemistot ja tiedostot, jotka haluat lisätä .gitignore. CLI voidaan asentaa NPM: n kautta. Kun olet asentanut, kirjoita goops ja tehty.

Debug CSS

DebugCSS on a CSS-pudotusohjelma, jonka avulla voit analysoida ja validoida selaimen CSS-lähdön. Se toimii aivan samanlaisena kuin Alix, kun lataat debugCSS-tyylitaulukon tai käytät kirjanmerkkiä korostaa sivun elementtejä, jotka aiheuttavat virheitä tai varoituksia.

EagleJS

EagleJS on a JavaScript-kirjasto luo esityksen samanlainen kuin RevealJS. EagleJS on eri tavoin erilainen; se on rakennettu Vue.js: n, JavaScript-MVC-kehyksen avulla ja käytä Pugiä mallinnusjärjestelmänä dia luodakseen.

BootstrapTour

JavaScript-kirjasto rakentaa ponnahdusikkunoita Bootstrap-komponentin avulla. Pop-up-oppaat näkyvät yleensä uudelle käyttäjälle kävelemään niitä sovellusliittymän, uusien ominaisuuksien ja vinkkien näyttämiseksi. Se on täydellinen kirjasto, jos sivustosi on rakennettu myös Bootstrapilla.

Tiili

Brick on JavaScript-kirjasto, joka on suunniteltu web-sovellusten käyttöliittymän rakentamiseen. Löydät joitakin yleisiä niitä, kuten kalenteri, valikko ja lomake, joka on yhdistettyinä komponentteihin "Varastointi-IndexedDB" komponentin avulla tallenna tiedot asiakaskoneelle käyttämällä IndexedDB: tä.

OctoTree

OctoTree on mukava apuohjelma, jonka avulla voit selata lähdekoodeja ja tiedostoja Githubissa puurakenteella kuten IDE: ssä tai koodieditorissa. Se on Chrome-, Safari-, Firefox- ja Opera-apuohjelmien lisäosa, ja se on saatavilla niiden virallisessa lisätiedostossa. Octotree tukee yksityisen ja yrityksen Github-arkistoa.

Githubin ilmoitus

Toinen hyödyllinen Github-laajennus Chromeen. Kun olet asentanut, voit vastaanottaa ilmoituksen, vaikka et ole tällä hetkellä Github-sivuilla. Hyvä plugin, jos haluat pysyä silmukassa arkistojen kanssa.

Deployer

Deployer on työkalu PHP-sivustojen käyttöönottoon. Se toimii useita suosittuja kehyksiä ja alustoja, kuten WordPress, Drupal, Magento, Laravel ja CodeIgniter. Tämän työkalun avulla voit säveltää omia reseptejäsi, käskyn, joka voidaan suorittaa asennuksen aikana. Se tulee palautus ominaisuus, jonka avulla voit palata edelliseen versioon vikojen sattuessa.

PHPStan

CLI, joka skannaa PHP-tiedostoja etsimään virheitä suorittamatta suoritusta. Tämä tarkoittaa sitä, että sinun ei tarvitse koko pino-PHP-ympäristöä, jos haluat korjata projektin PHP-tiedostot.

NGINX-kattilalevy

Kokoelma tavallisia Nginx-kokoonpanoja, jotka sisältävät Backend-välimuistin, yhteyden ja pyyntöjen nopeusrajoituksen sekä joitakin muita parhaita käytäntöjä, joiden avulla sivustosi voidaan nopeuttaa ja virittää liikenteen kiireeksi.

Kupliva

Bubbly on loistava komentorivi, jonka voit asentaa palvelimellesi sertifikaatin luomiseen, hallintaan ja uusimiseen Let's Encrypt -toiminnon avulla. Doplying SSL on nyt paljon helpompaa.

Vohveliruudukko

Kuitenkin toinen CSS-runkorakenne, joka on rakennettu Flexboxiin ja jonka mielestä sinun pitäisi tutkia.