Friske ressourcer til webdesignere og udviklere (oktober 2018)

I modsætning til enhver anden industri ændrer webudviklingen sig ved spring og grænser. Der er nye værktøjer, metoder og rammer udviklet næsten hver dag for at imødekomme nyere tendenser og teknologiske fremskridt i webbranchen.

Så her er en liste over de nyeste værktøjer og ressourcer, herunder en PHP-ramme til nemt at udføre E2E test for din PHP applikation, et værktøj til at generere farver, der overholder W3C Accessibility Standards, og en håndfuld Vue.js extensions. Lad os hoppe ind for at se den fulde liste.

Keyframes App

En web-baseret applikation giver en god GUI til at komponere CSS animation og visualiser animationen med en tidslinje. Appen giver dig også mulighed for at downloade CSS output, når du er tilfreds. CSS keyframes er ikke den nemmeste spec i CSS, så at have en app som dette ville helt sikkert være en timesaver.

Symfony Panther

“Symfony Panther” er en fantastisk PHP ramme fra Symfony til at udføre E2E (End-to-end) test. Det kommer med sin indbygget webserver og kunne udnytte Chrome installeret på din computer til at udføre E2E testen.

Desuden støtter den JavaScript henrettelser, screenshot capture, brugerdefineret Selen driver, Chrome og Firefox-klient. At være en selvstændig ramme kan du inkludere Panther i alle PHP-projekter som f.eks. WordPress, Joomla, osv..

TrendyPalettes

En samling af smukke farvepaletter. Samlingen tilbyder tusindvis af håndplukket farvepaletter. Brugere kan indsende en ny farvepalet, så der er altid nye paletter tilføjet nogensinde yday. TrendyPalettes er også tilgængelig som en Chrome-udvidelse.

Eagle.js

Eagle.js er en ramme for at oprette dias bygget oven på Vue.js, så du nemt kan genbruge brugerdefinerede Vue.js komponenter i diasene. Diaset understøtter også tastatur og mus navigation, brugerdefineret styling eller tema, interaktive widgets og giver en kedelplade, der hjælper med at oprette og præsentere diasshowet hurtigt. Det kan være en stor alternativ til Reveal.js, især hvis du allerede er bekendt med Vue.js.

Grape.js

GrapeJS er en open source webbygger, der giver dig mulighed for at bygge websider simpelthen ved trække og slippe komponenter. Det giver nogle almindelige komponenter som tekst, billede, vidoe, kolonner, kort, citat osv. Du kan eksportere det til HTML og CSS, og outputen er utroligt pæn, i modsætning til nogle lignende værktøjer, som jeg forsøgte før. Tjek demoen.

vapid

Vapid er et nyt CMS bygget med Node.js med en interessant og unik tilgang. De fleste CMS, hvis du vil medtage en ny type data, skal først definere den brugerdefinerede indgang i Dashboard / Admin-området.

Med Vapid er det modsat, da du kan definere skabelonen, og Vapid genererer automatisk indtastningen i Dashboard / Admin-området. Den er tilgængelig som en NPM-pakke.

WP CLI Meddelelse

Navnet siger det hele. Det er en brugerdefineret WP-CLI-pakke, der viser OS-underretninger, når WP-CLI allerede er udført. Ganske fancy.

CSSGr.id

En web-baseret applikation til at komponere CSS-net. Du kan konfigurere antallet af genstande, kolonner, mellemrummet mellem hvert enkelt emne og hvert emne og derefter generere HTML- og CSS-koden. CSS-net er en af ​​de CSS-specifikationer, der ikke er helt let at forstå. Men dette værktøj gør det meget nemmere at håndtere det.

Scrolltips

ScrollHint er et JavaScript-bibliotek, der giver dig mulighed for at oprette et element over toppen for at vise, at et afsnit på din webside kan rulles. Dette er særligt nyttigt, hvis du har et vandret rulleelement på din webside, da de fleste ikke rulle naturligvis til venstre mod højre (eller omvendt), når de bruger nettet.

PristineJS

Et JavaScript-bibliotek til at tilføje validering til et input. HTML5 leveres med en type type validering allerede med “type = email”, og “type = nummer” for eksempel. Men hvis du har brug for en brugerdefineret validator, der ikke er implementeret i HTML5, Dette JavaScript-bibliotek vil komme til nytte.

SelectionJS

De fleste mennesker er sikkert allerede bekendt med, hvordan man vælger flere mapper eller filer i deres computer; de vil typisk holde deres museklik og trække det rundt om de filer eller mapper, de gerne vil vælge. Hvis du vil anvende den samme UX på din hjemmeside, vil SelectionJS komme til nytte.

Webdash

Webdash er et værktøj, der kan vis dit projekt til GUI-grænseflade. Det forbinder gennem package.json fil i din computer. Så det kan vise listen over NPM pakker, opdater pakken, de registrerede scripts, kør scriptet, og forhåndsvisning af README-filerne lige fra Webdash. Ret sejt!

CanJS

En JavaScript-ramme til at opbygge web-interface. Det ligner React.js med nogle ekstra funktioner og leveres med router, DOM Utilities og AJAX-funktion lige ud af boksen. Det har også en ret aktiv community support giver nogle udvidelser.

CheerioJS

Et JavaScript-bibliotek, der implementerer jQuery Core-specifikationen for DOM (Document Object Model) og er designet til at blive brugt på server-siden. Hvis du er arbejder med Node.js mens du også nyder jQuery-syntaks synes godt om addClass (), attr (), og finde(), Dette er JavaScript, du leder efter.

Colorbox

Colorbox er Lyft initiativ til at generere en farvesammensætning, der overholder Color Accessiblity standard. Værktøjet er udstyret med en smart algoritme, der giver dig mulighed for at simpelthen Flyt rundt på knappen, skift konfigurationen, og det vil generere de rigtige farver til dig. Det er bare fantastisk.

Typede egenskaber i PHP 7.4

PHP7.3 er lige rundt om hjørnet, som vi har nævnt i den foregående rate. Men PHP7.4 er allerede på planen. En af planerne er Typed Property. Det betyder, at du snart vil kunne skriv noget lignende offentlige int $ id; i din PHP klasse. Det er en enorm ændring, der kan bidrage væsentligt til at reducere dine PHP-applikationsfejl.

Stencil

En JavaScript compiler, der gør det nemt at oprette Web Components med den nyeste standard. Ud over det tilføjer StencilJS også nogle moderne webudviklingsmetoder i blandingen JSX support, reaktivitet, router og State Management ved hjælp af et plugin.

Vue uendelig indlæsning

En Vue forlængelse for at skabe en uendelig rulle side. Det er mobilvenligt og kompatibel med et rullerbart element. Det understøtter også to rulle retninger og bedst af alt sparer det meget tid.

V Udklipsholder

En brugerdefineret Vue.js udvidelse, der gør det sådan let at oprette en “Kopi” knap. Du kan blot tilføje en v-udklipsholderen Tilskrive en knap, og du er helt indstillet. Denne Vue.js-udvidelse virker for hver moderne browser samt IE11 og det seneste.

Vue Vælg

En Vue.js komponent, der giver lignende funktionalitet til Select2. Det er designet til Vue.js at det tillader at være kompatibel med Vuex, Custom Templating, og en masse andre Vue.js godhed.