Friske ressourcer til webdesignere og udviklere (juli 2017)

Tiden flyver, og vi er nu midt i 2017. I denne måneds aflevering har vi en række gode JavaScript-biblioteker og et par andre som et plugin til at aktivere GraphQL i WordPress, et desktop-program til at gengive CSV-data og et par hjemmesider rammer. Lad os tjekke dem ud.

HeroPatterns

En samling af gentageligt mønster lavet med SVG som du kan bruge som baggrund på dit websted. Webstedet er udstyret med en praktisk indstilling til tilpasse mønsterets farve og opacitet og lader dig simpelthen kopiere og indsætte koden, der skal tilføjes i dit CSS.

TestCafe

TestCafe er en end-to-end (e2e) testværktøj som giver dig mulighed for at teste dine hjemmesider og webapplikationer som om de bliver brugt af rigtige brugere. Det vil automatisere flere ting, når du udfører testen herunder start browseren, kør specificeret testenhed, generer rapporter, screenshots samt sourcemap til fejlfinding af fejl nemt.

SugarJS

SugarJS er et JavaScript-bibliotek til manipulere Objekter, Arrays og Datoer med en pænere og mere læsbar syntaks. Biblioteket leveres også med en håndfuld hjælpefunktioner, .escapeHTML () hvilket vil konvertere HTML-elementer til deres Entity-format.

FRK

Et praktisk JavaScript bibliotek til drej tid, tal og regelmæssig streng til millisekunder. ms ('2 dage'), for eksempel vil blive konverteret til 172800000.

pa11y

En stor samling værktøjer til at hjælpe forbedre tilgængeligheden på dit websted og web apps. pa11y består af en CLI til at teste alle websider for eventuelle tilgængelighedsproblemer, a Dashboard for at vise genererede rapporter om fejl og advarsler, og en CLI, der er specielt designet til et CI-værktøj som Codeship eller Travis.

Fjer ikoner

EN indsamling af ikoner med moderne stemning. Disse ikoner er en perfekt pasform til hjemmesider og apps designet til alle platforme (iOS, Windows eller Ubuntu). Ikonerne kommer ind SVG såvel som i React og Angular komponenter.

Reag Flight

Et reaktionsmodul til bygg animationssammensætning i din ansøgning. Biblioteket er inspireret af Princip for Sketch, som du kan Tilføj interaktivitet til en UI-komponent hurtigt og nemt.

BounceJS

Et bibliotek til opret animationer med bounce effekt. Animationen drives af CSS3 og en række forudindstillede animationer. Du kan installere JavaScript-biblioteket via npm, bower eller simpelthen kopiere CSS animationen genereret på hjemmesiden.

Bojler

Bojler er en email ramme med vejledningen til at skrive HTML kode Det vil gøre det rigtigt på de fleste populære e-mail-klienter. Du kan finde flere email rammer i vores tidligere indlæg.

Devicon

En samling af ikoner til programmeringssprog, design og udviklingsværktøjer. Ikonerne er tilgængelige i SVG og Font format. Nogle særligt ikoner som Firefox, AWS og HTML5 kommer også med deres detaljerede varianter. Godt koldt rigtigt?

Nu UI Kit

En samling responsiv grænseflade baseret på Bootstrap 4. Det indeholder 50 elementer og 3 brugerdefinerede skabeloner. Bortset fra HTML-versionen er brugergrænsefladen også leveret i PSD og Sketch-formater.

T-Scroll

T-Scroll er en JavaScript bibliotek til at anvende animation når et element er synligt i visningsporten. Den er udstyret med en håndfuld indstillinger og forudindstillede animationer.

Ory Editor

ORY er en moderne og mere tilgængelig webredaktør på nettet. ORY Editor er bygget oven på React and Flux. Det gør redigering let ved at lade brugerne redigere indhold og se resultatet straks uden at skulle vide særlige syntakser som HTML eller Markdown.

TadViewer

TadViewer er en praktisk desktop app for at se CSV og det virker på store data og filer. Appen er tilgængelig på MacOS, Windows og Linux.

Glat Scroll Polyfill

Glat rulning har vist sig at tjene en mere behagelig brugeroplevelse. Det er nu foreslået og udarbejdet officielt i W3C. I øjeblikket arbejder den kun i Chrome, Firefox og Opera. Brug dette bibliotek til emulere den glatte rulningsadfærd i Internet Explorer og Safari.

Noty

Et JavaScript-bibliotek for at vise meddelelser, Noty gør det nemt at vise en Alart, Succes, Fejl, Advarsel, Information eller en dialogbesked. Den kan bruges sammen med et animationsbibliotek som mo.js og bounce.js for at gøre notifikationen glider ind og ud yndefuldt.

hinke

Hopscotch er en open-source-projekt instanseret af LinkedIn. Det er en ramme, der gør det nemt for udviklere at tilføje produktture. Tjek demoen for et levende eksempel og API.

SurveyJS

SurveyJS er et andet fantastisk JavaScript-bibliotek. Som navnet antyder, er det designet til at skabe undersøgelsesindgange. Den indeholder forskellige inputtyper til at udfylde undersøgelsens svar og er også blevet sendt til flere populære JavaScript rammer herunder AngularJS, VueJS og React.

WP GraphQL

GraphQL er stigende og kan være a stærk contender til at erstatte REST arkitektur der har næsten alle web-API'er. Dette er et plugin, der giver dig mulighed for Hent dit WordPress-indhold med GraphQL. Her er en stor henvisning til, hvordan REST og GraphQL er forskellige fra hinanden.

Monaco Editor

Monaco Editor er redaktøren som beføjelser Visual Code Editor. Det er bygget af Microsoft og understøtter flere sprog ud af boksen, herunder HTML, CSS, LESS, CoffeeScript og PHP sammen med Intellisense, der hjælper dig med at skrive kode hurtigere.