Friske ressurser for webdesignere og utviklere (oktober 2018)

I motsetning til hvilken som helst annen bransje, endres nettutviklingen med hopp og grenser. Det er nye verktøy, metoder og rammer utviklet nesten hver dag for å imøtekomme nyere trender og teknologiske fremskritt i nettbransjen.

Så her er en liste over de nyeste verktøyene og ressursene, inkludert et PHP-rammeverk for å enkelt utføre E2E-testing for PHP-applikasjonen, et verktøy for å generere farger som overholder W3C-tilgjengelighetsstandarder, og en håndfull Vue.js-utvidelser. La oss hoppe inn for å se hele listen.

Keyframes App

En web-basert applikasjon gir en fin GUI for å komponere CSS animasjon og visualiser animasjonen med en tidslinje. Appen lar deg også laste ned CSS-utgangen når du er fornøyd. CSS keyframes er ikke den enkleste spesifikasjonen i CSS, så å ha en app som dette ville definitivt være en timesaver.

Symfony Panther

“Symfony Panther” er et fantastisk PHP-rammeverk fra Symfony til å utføre E2E (End-to-end) test. Den følger med innebygd webserver og kunne utnytte Chrome installert på datamaskinen din for å utføre E2E-testen.

Videre støtter det JavaScript henrettelser, skjermbildeopptak, tilpasset Selen-driver, Chrome og Firefox-klient. Å være en frittstående rammeverk, kan du inkludere Panther i alle PHP-prosjekter som for eksempel WordPress, Joomla, etc..

TrendyPalettes

En samling av vakre fargepaletter. Samlingen tilbyr tusenvis av håndplukkede fargepaletter. Brukere kan sende inn en ny fargepalett, så det er alltid nye paletter lagt til i dag. TrendyPalettes er også tilgjengelig som en Chrome-utvidelse.

Eagle.js

Eagle.js er et rammeverk for å lage lysbilder bygget på toppen av Vue.js, slik at du enkelt kan gjenbruke egendefinerte Vue.js-komponenter i lysbildene. Lysbildet støtter også tastatur og mus navigasjon, tilpasset styling eller tema, interaktive widgets, og gir en boilerplate som hjelper deg med å sette opp og presentere lysbildet raskt. Det kan være bra alternativ til Reveal.js, spesielt hvis du allerede er kjent med Vue.js.

Grape.js

GrapeJS er en open source webbygger som lar deg bygge websider bare ved dra og slippe komponenter. Det gir noen vanlige komponenter som Tekst, Bilde, Vidoe, Kolonner, Kart, Sitat, etc. Du kan eksportere den til HTML og CSS og utdataene er utrolig ryddige, i motsetning til noen lignende verktøy som jeg prøvde før. Sjekk ut demoen.

vapid

Vapid er et nytt CMS bygget med Node.js med en interessant og unik tilnærming. De fleste CMS, forutsatt at du vil inkludere en ny type data, må først definere den egendefinerte inntastingen i Dashboard / Admin-området.

Med Vapid er det motsatte som du kan definere malen, og Vapid vil automatisk generere innspillet i Dashboard / Admin-området. Den er tilgjengelig som en NPM-pakke.

WP CLI Notification

Navnet sier alt. Det er en egendefinert WP-CLI-pakke for å vise OS-varslinger når WP-CLI allerede er utført. Ganske fancy.

CSSGr.id

Et nettbasert program for å komponere CSS-nettverket. Du kan konfigurere antall elementer, kolonner, gapet mellom hvert element, i tillegg til hvert elementspor og deretter generere HTML- og CSS-koden. CSS Grid er en av de CSS-spesifikasjonene som ikke er ganske lett å forstå. Men dette verktøyet gjør det så mye lettere å håndtere det.

Bla Hint

ScrollHint er et JavaScript-bibliotek som lar deg lage et element over toppen for å vise at en seksjon på nettsiden din kan rulles. Dette er spesielt nyttig hvis du har et horisontalt rullegardinelement på websiden din, da de fleste ikke blar naturlig fra venstre til høyre (eller omvendt) når de bruker nettet.

PristineJS

Et JavaScript-bibliotek for å legge til validering til en inngang. HTML5 leveres med noen type validering allerede med “type = e”, og “type = antall” for eksempel. Men hvis du trenger en egendefinert validator som ikke er implementert i HTML5, Dette JavaScript-biblioteket kommer til nytte.

SelectionJS

De fleste er sikkert kjent med hvordan man velger flere mapper eller filer i datamaskinen. de holder vanligvis med museklikk og drar det rundt filene eller mappene de ønsker å velge. Hvis du vil bruke den samme UX på nettstedet ditt, vil SelectionJS komme til nytte.

Webdash

Webdash er et verktøy som kan vis prosjektet ditt i GUI-grensesnittet. Det kobles gjennom package.json filen i datamaskinen din. Så det kan vise listen over NPM-pakker, oppdater pakken, de registrerte skriptene, kjør skriptet, og forhåndsvisning av README-filene rett fra Webdash. Ganske utrolig!

CanJS

Et JavaScript-rammeverk for å bygge webgrensesnitt. Det ligner på React.js med noen ekstra funksjoner og følger med router, DOM Utilities og AJAX-funksjon rett ut av boksen. Det har også en ganske aktiv fellesskapsstøtte gir noen utvidelser.

CheerioJS

Et JavaScript-bibliotek som implementerer jQuery Core-spesifikasjon for DOM (Document Object Model) og er designet for å brukes på server-siden. Hvis du er jobber med Node.js mens du også nyter jQuery-syntaks som addClass (), attr (), og finne(), Dette er JavaScript du leter etter.

Fargeboks

Colorbox er Lyft-initiativ for å generere en fargesammensetning som overholder fargen Accessiblity-standarden. Verktøyet er drevet med en smart algoritme som lar deg enkelt Flytt rundt knappen, endre konfigurasjonen, og det vil generere de riktige fargene for deg. Det er bare fantastisk.

Typede egenskaper i PHP 7.4

PHP7.3 er rett rundt hjørnet, som vi har nevnt i forrige avdrag. Men PHP7.4 er allerede på planen. En av planene er Typed Property. Dette betyr at du snart vil kunne skriv noe sånt offentlig int $ id; i PHP-klassen din. Det er en stor forandring som kan bidra til å redusere PHP-programmene dine.

stencil

En JavaScript-kompilator som gjør det enkelt å lage webkomponenter med den nyeste standarden. På toppen av det, legger StencilJS også noen moderne webutvikling tilnærming til blandingen inkludert JSX-støtte, reaktivitet, ruteren og statsadministrasjon bruker et plugin.

Vue Infinite Loading

En Vue-utvidelse for å lage en uendelig rulleside. Det er mobilvennlig og kompatibel med alle rullbare elementer. Den støtter også to rulleretninger, og best av alt sparer det mye tid.

V Utklippstavle

En tilpasset Vue.js-utvidelse som gjør det slik Lett å lage en “Kopiere” knapp. Du kan ganske enkelt legge til en v-utklippstavlen Tilordne en knapp, og du er helt klar. Denne Vue.js-utvidelsen fungerer for hver moderne nettleser, i tillegg til IE11 og det siste.

Vue Velg

En Vue.js-komponent som gir lignende funksjonalitet til Select2. Den er designet for Vue.js som det tillater å være kompatibel med Vuex, Custom Templating, og en gjeng med andre Vue.js godhet.