Nuove risorse per Web designer e sviluppatori (ottobre 2018)

A differenza di qualsiasi altro settore, lo sviluppo del web sta cambiando a passi da gigante. Ci sono nuovi strumenti, metodi e strutture sviluppate quasi ogni giorno per soddisfare nuove tendenze e progresso tecnologico nel settore web.

Quindi ecco un elenco degli strumenti e delle risorse più recenti tra cui un framework PHP da eseguire facilmente Test E2E per la tua applicazione PHP, uno strumento per generare colori conformi agli standard di accessibilità W3C e una manciata di estensioni Vue.js. Facciamo un salto per vedere l'elenco completo.

Fotogrammi chiave

Un'applicazione web-based fornendo una bella GUI per comporre l'animazione CSS e visualizzare l'animazione con una timeline. L'app ti consente anche di scaricare l'output CSS una volta che sei soddisfatto. I keyframe CSS non sono le specifiche più semplici nei CSS, quindi avere un'app di questo tipo sarebbe sicuramente un risparmio di tempo.

Symfony Panther

“Symfony Panther” è un incredibile framework PHP di Symfony per eseguire test E2E (End-to-end). Viene con il suo server Web incorporato e potrebbe sfruttare Chrome installato nel computer per eseguire il test E2E.

Inoltre, supporta Esecuzioni JavaScript, acquisizione screenshot, driver Selenium personalizzato, Chrome e il client Firefox. Essendo un framework standalone, è possibile includere Panther in qualsiasi progetto PHP come, ad esempio, WordPress, Joomla, ecc.

TrendyPalettes

Una collezione di bellissime tavolozze di colori. La collezione offre migliaia di tavolozze dei colori raccolte a mano. Gli utenti possono inviare una nuova tavolozza di colori, quindi ci sono sempre nuove tavolozze aggiunte ogni giorno. TrendyPalettes è disponibile anche come estensione Chrome.

Eagle.js

Eagle.js è un framework per creare diapositive create su Vue.js in modo da poter riutilizzare facilmente i componenti personalizzati di Vue.js all'interno delle diapositive. La diapositiva supporta anche navigazione con tastiera e mouse, stile personalizzato o tematizzazione, widget interattivi e fornisce uno standard per aiutare a impostare e presentare rapidamente la diapositiva. Può essere fantastico alternativa a Reveal.js, specialmente se hai già familiarità con Vue.js.

Grape.js

GrapeJS è un web builder open-source che ti permette di creare pagine web semplicemente da trascinando e rilasciando componenti. Fornisce alcuni componenti comuni come Testo, Immagine, Vidoe, Colonne, Mappa, Citazione, ecc. È possibile esportarlo in HTML e CSS e l'output è straordinariamente pulito, a differenza di alcuni strumenti simili che ho provato prima. Guarda la demo.

insulso

Vapid è un nuovo CMS realizzato con Node.js con un approccio interessante e unico. La maggior parte dei CMS, supponendo che si desideri includere un nuovo tipo di dati, richiederà prima di definire l'input personalizzato nell'area di Dashboard / Amministrazione.

Con Vapid, è il contrario in quanto è possibile definire il modello e Vapid genererà automaticamente l'input nell'area di Dashboard / Admin. È disponibile come pacchetto NPM.

Notifica CLP WP

Il nome dice tutto. È un pacchetto WP-CLI personalizzato per visualizzare le notifiche del sistema operativo quando WP-CLI è già in esecuzione. Abbastanza elegante.

CSSGr.id

Un'applicazione web-based per comporre la griglia CSS. È possibile configurare il numero di elementi, colonne, il divario tra ogni elemento, nonché ogni intervallo di elementi e quindi generare il codice HTML e CSS. La griglia CSS è una di quelle specifiche CSS che non è abbastanza facile da capire. Ma questo strumento rende molto più facile gestirlo.

Suggerimento di scorrimento

ScrollHint è una libreria JavaScript che ti consente di creare un elemento in alto per mostrare che una sezione della tua pagina web è scorrevole. Ciò è particolarmente utile se si dispone di un elemento di scorrimento orizzontale sulla pagina Web poiché la maggior parte delle persone non scorre in modo naturale da sinistra a destra (o viceversa) quando consuma il Web.

PristineJS

Una libreria JavaScript per aggiungere la convalida a un input. HTML5 viene fornito con alcuni tipi di convalida già con “type = e-mail”, e “type = Numero” per esempio. Ma se hai bisogno di un validatore personalizzato che non è implementato in HTML5, questa libreria JavaScript ti tornerà utile.

SelectionJS

La maggior parte delle persone probabilmente ha già familiarità su come selezionare più cartelle o file nel proprio computer; in genere terranno il loro clic del mouse e lo trascinano intorno ai file o alle cartelle che vorrebbero selezionare. Se vuoi applicare la stessa UX sul tuo sito web, SelectionJS ti tornerà utile.

Webdash

Webdash è uno strumento che può mostra il tuo progetto nell'interfaccia grafica. Si connette attraverso il package.json file nel tuo computer. Quindi può visualizzare l'elenco dei Pacchetti NPM, aggiornare il pacchetto, gli script registrati, eseguire lo script, e l'anteprima dei file README direttamente dal Webdash. Abbastanza bello!

CanJS

Un framework JavaScript per costruire l'interfaccia web. È simile a React.js con alcune funzionalità aggiuntive e viene fornito con router, utilità DOM e funzione AJAX subito disponibili. Ha anche un supporto di comunità abbastanza attivo fornisce alcune estensioni.

CheerioJS

Una libreria JavaScript che implementa le specifiche jQuery Core per DOM (Document Object Model) ed è progettata per essere utilizzata sul lato server. Se tu sei funziona con Node.js e ti piace anche la sintassi jQuery piace addClass (), attr (), e trova(), questo è il codice JavaScript che stai cercando.

Scatola dei colori

Colorbox è un'iniziativa Lyft per generare una composizione di colori conforme allo standard Accessiblity del colore. Lo strumento è alimentato da un algoritmo intelligente che ti consente semplicemente di farlo muovi la manopola, cambia la configurazione, e genererà i colori corretti per te. È semplicemente fantastico.

Proprietà tipizzate in PHP 7.4

PHP7.3 è proprio dietro l'angolo, come abbiamo menzionato nella puntata precedente. Ma PHP7.4 è già sul piano. Uno dei piani è proprietà digitato. Questo significa che presto sarai in grado di scrivi qualcosa come pubblico int $ id; nella tua classe PHP. È un enorme cambiamento che potrebbe aiutare notevolmente a ridurre i bug delle applicazioni PHP.

stampino

Un compilatore JavaScript che semplifica la creazione di componenti Web con lo standard più recente. Oltre a ciò, StencilJS aggiunge anche alcuni moderni strumenti di sviluppo web nel mix incluso Supporto JSX, reattività, router e gestione dello stato usando un plugin.

Vue Infinite Loading

Un'estensione Vue per creare una pagina di scorrimento infinita. È mobile-friendly e compatibile con qualsiasi elemento scorrevole. Supporta anche due direzioni di scorrimento e, soprattutto, consente di risparmiare molto tempo.

V Appunti

Un'estensione Vue.js personalizzata che lo rende così facile da creare a “copia” pulsante. Puoi semplicemente aggiungere un v-clipboard attributo a un pulsante e sei tutto pronto. Questa estensione Vue.js funziona per tutti i browser moderni nonché IE11 e l'ultima.

Vue Select

Un componente Vue.js che offre funzionalità simili a Select2. È progettato per Vue.js che consente di essere compatibile con Vuex, Custom Templating, e un sacco di altri Vue.js bontà.