Nuove risorse per web designer e sviluppatori (aprile 2018)

Questo mese abbiamo visto alcuni annunci di nomi importanti in tecnologia. Ad esempio, Apple ha aperto un nuovo sistema di database, Google ha rilasciato un nuovo strumento per misurare la velocità del tuo sito web su dispositivi mobili e Github con un corso gratuito per iniziare con Git, Github e la codifica in generale.

Inoltre, nel post di oggi, lo farò anche io presentano una serie di nuovi strumenti che sono attualmente in aumento. Passiamo a ciò che abbiamo di più sulla lista.

VuePress

Un nuovo strumento dal creatore di Vue, VuePress è un generatore di siti statici progettato con Vue.js in mente. Genera e pre-rendering HTML statico per ogni pagina, e funziona come una SPA (applicazione a pagina singola). Viene fornito con alcune funzionalità predefinite, tra cui la possibilità di aggiungere l'ID di Google Analytics, la ricerca, la navigazione successiva e precedente, la barra laterale e PWA.

IMG-2

Una libreria JavaScript che presenta a elemento personalizzato, img-2. Il nuovo elemento aggiunge una serie di ottimizzazioni che non vengono fornite con lo standard img elemento, migliorando il modo in cui l'immagine viene caricata per gli utenti. Con l'elemento personalizzato, l'immagine sarà pre-memorizzata nella cache, anche questa carico pigro le immagini e le pubblicazioni verranno inviate dalla cache solo quando le immagini entrano nella finestra dell'utente. Guarda la demo.

Tabler

Un elegante pannello di controllo / amministrazione basato su Bootstrap 4. La dashboard include componenti prefabbricati come grafici, moduli, gallerie, una tabella dei prezzi e una bella raccolta di icone personalizzate. Un ottimo punto di partenza per consentire agli sviluppatori di creare rapidamente un pannello di amministrazione. Guarda la demo!

DayJS

DayJS Libreria JavaScript per formattare date e ore. Ancor più, DayJS presenta API simili a Moment.js, ma ha solo un peso di 2 KB. Detto questo, potrebbe essere un ottima alternativa a Moment.js, se desideri una libreria più leggera, mantieni la familiarità con ciò che hai già conosciuto.

UnifiedArchive

Una libreria PHP per gestire file compressi, UnifiedArchive supporta una vasta gamma di formati inclusi RAR, Zip, Gzip, Tar, e molti altri tipi di compressione. Con questa libreria, puoi archiviare ed estrarre file o directory. Fornisce a una manciata di API per manipolare i file dopo che è stato estratto dall'archivio. UnifiedArchive è disponibile come pacchetto di Composer.

Github Learning Lab

Github ha appena annunciato un corso gratuito che copre principalmente Git in Github. Ci sono 5 corsi al momento in cui puoi imparare alcune cose utili come come usare Github per ospitare i tuoi codici, come usare le pagine di Github per ottenere un sito o blog gratuito per il progetto e come gestirlo Unisci conflitti comuni quando si lavora con molti sviluppatori su un progetto.

Parser DOM di WordPress UnitTest

Un bel consiglio da Takayuki Miyauchi su test di DOMElement durante l'esecuzione di UnitTest in applicazioni WordPress. Personalmente l'ho trovato davvero utile; spero che tu lo trovi lo stesso.

Popmotion

Una libreria JavaScript per un'animazione fluida e burrosa sul web, “Popmotion” fornisce un'API chiamata Fisica che ti consente di creare effetti di animazione quasi reali. È non specializzato; la biblioteca semplicemente emette valori basati sul set specifico della configurazione. Ciò ti consente di applicare queste uscite per animare qualsiasi mezzo tra cui CSS, SVG, Three.js e persino React.js.

Driver.js

Una libreria JavaScript che ti permette di “guidare” focus dell'utente su una pagina. Ciò è particolarmente utile se desideri introdurre funzionalità specifiche o guidarle verso attività specifiche nella pagina. Driver.js è giusto 4 KB di dimensioni, personalizzabili e tastiera.

Sostituisci GIF animata con video

GIF è ovunque, dopo aver fatto un grande ritorno. Ma il problema della GIF è che di solito è molto grande. È uno spreco di larghezza di banda, tuttavia la qualità grafica è spesso terribile. Questo le linee guida di Google mostrano come “video” può sostituire GIF per mostrare grafica animata.

Maschera di testo

Una libreria JavaScript a trasforma il testo che richiede una formattazione speciale come un numero di telefono, valuta, o un numero di carta di credito. Mentre l'utente sta digitando il testo verrà automaticamente trasformato nella sua formattazione appropriata migliorando l'esperienza dell'utente. TextMask può essere utilizzato con React, Vue o semplicemente con JavaScript vecchio.

Confronta la velocità del sito mobile

Questo è un altro utile strumento di Google. Questo strumento ti permetterà di controlla la velocità del tuo sito web durante il caricamento da cellulare e stimare la perdita totale di entrate quando il sito web si carica lentamente. Puoi seleziona il paese e la velocità di cui verrà testato il tuo sito web.

VueNut

Un compagno di sviluppo quando costruisce un'applicazione web con Vue.js e Vuex, VueNut lo fa più facile da esplorare lo stato dei dati memorizzati e ti consente di manipolare facilmente i dati durante lo sviluppo. Roba forte!

FoundationDB

Recentemente Apple ha reso open source FoundationDB in Github. È un sistema di database a coppie valore-chiave ciò promette scalabilità e prestazioni. È bello avere grandi aziende tecnologiche che iniziano a dedicare all'open source alcuni dei loro prodotti.

Libri di storia

StoryBooks è uno strumento per costruire un componente React in isolamento. Fornisce un'interfaccia utente sul browser che consente di visualizzare i diversi stati di ogni componente e testare i componenti.

GhostText

Un'estensione del browser che lo farà sincronizza ciò che scrivi sul browser nel tuo editor di testo o vice versa. Ho trovato questo in definitiva utile se si desidera poter scrivere su un sito Web con la praticità e le funzionalità del proprio editor di codice. GhostText è disponibile per Chrome, Firefox e Opera.

Coala

Il coala è un CLI fornisce un'interfaccia per il linting e il fissaggio del codice indipendentemente dalle lingue utilizzate. Puoi usare Coala all'interno di un editor di codice, integrarlo con un CI (Continuous Integration) e personalizzarlo con una sintassi di configurazione in .coafile. Coala supporta molti linguaggi come CSS, JavaScript, PHP e puoi trovare di più in questa directory.

ReactStrap

ReactStrap è una raccolta di componenti Bootstrap 4 trasformati in componenti React riutilizzabili. Se desideri modernizzare il tuo vecchio sito Web basato su Bootstrap, questa libreria è qualcosa che potresti voler esaminare.

Reacto

Un altro strumento correlato a React, Reacto è un IDE costruito su Electron e progettato per lo sviluppo di applicazioni Web con ReactJS. Questo sembra davvero utile se il tuo primario di sviluppo ruota attorno a ReactJS.

PicoJS

Una libreria JavaScript che abilita il rilevamento del volto. Funziona con una foto o con la fotocamera integrata. È davvero affascinante come la tecnologia web si sia evoluta negli ultimi anni.