React.js 14 Værktøjer og ressourcer til webudviklere
Det popularitet af React.js har været hurtigt voksende siden Facebook først udgav biblioteket tilbage i 2013. Det er det femte mest fremtrædende open source-projekt på Github, og jobannoncer til React-udviklere er også stærkt stigende. React er a letvægts JavaScript-ramme til bygge brugergrænseflader - De mest fremtrædende eksempler er Facebook og Instagram.
React tilbyder en alternativ til MVC rammer, såsom vinkel eller rygrad, med a mere ligetil struktur og fokus på præstationsoptimering. Da React sikkert vil definere webudviklingslandskabet i de kommende år, vil vi i denne artikel gerne give dig en udvikler værktøjssæt for at hjælpe dig med at sætte foden i React development.
Officielle React.js dokumenter fra Facebook
Facebook giver udviklere en detaljeret dokumentation på den hovedbegreber for reaktion. Udover docs kan du også finde her en god tutorial på hvordan man opbygger et interaktivt tic-tac-toe spil med React, og a diskussionsforum til React-udviklere. Som den docs er open source, Du kan endda redigere dem, hvis du vil.
React.js Github repo
I React Github repo kan du tjek Reacts kildekode når du har brug for det. Hvis du vil holde dig orienteret med den nuværende udviklingstilstand, kan du også kigge på problemer, det milepæle, og seneste trækforespørgsler. Hvis du sidder fast, kan det også være en god ide at studere Fejlfinding Guide en smule.
Hej World starter kode
Hvis du vil give et hurtigt forsøg på at reagere, kan du starte med dette “Hej Verden” interaktive demo på Codepen. Det omfatter alle de nødvendige aktiver og starter kode såvel. Som Babel også er på, kan du bruge både ECMAScript 6 og JSX-syntaksen. Bare gaffel denne pen, og du kan gå videre uden at have opsat hele miljøet alene.
Reager Starter Kit
Det Reager Starter Kit er en isomorf web app boilerplate bygget af Node.js, Express, GraphQL, React, og et håndfuldt webudviklingsværktøj, som f.eks Webpack, Babel, og Browsersync. Det giver dig med samme frontend stack Facebook bruger og giver dig mulighed for at hoppe ind fuld stack React udvikling uden for meget besvær.
ReactCSS
ReactCSS gør det muligt at Tilføj inline CSS-stilarter i JavaScript. ReactCSS leveres med support til React, Redux, React Native (et rammeværk til opbygning af native mobile apps ved hjælp af React), autoprefixing, hover, pseudo-elementer og medieforespørgsler. Du kan hurtigt installer det med npm.
Reakt JSFiddle integration (med og uden JSX)
Dette er en stor online legeplads hvis du vil have et sted, hvor du kan begynde at øve React. Det er vært på JSFiddle, og har to versioner: en med JSX og en uden JSX, vælg hvilken du er mere komfortabel med.
React style guide generator
Du kan hurtigt generere en stil guide til dit React-projekt med denne nemme at bruge React style guide generator. Du skal kun tilføj lidt dokumentation til dine filer, og generatoren tager sig af resten. Værktøjet leveres med en detaljeret readme-fil.
Belle konfigurerbare React komponenter
Belle er en Reag komponent bibliotek det udstyrer dig med et sæt React-komponenter du vil måske bruge i dit projekt, f.eks “Knap”, “Kort”, “Spinner”, “Toggle”, “Bedømmelse”, forskellige formkomponenter og andre. Komponenterne fungerer både på mobil og på skrivebordet, og de er tilpasses såvel.
Belle er ikke det eneste React-komponentbibliotek derude kan du finde andre gode på github, som f.eks Reag widgets eller Elemental.
React Storybook UI Development Environment
Hvis du ikke vil bruge en andens komponentbibliotek, men ønsker at bygge din egen, det er værd at prøve React StoryBook som er en UI udviklingsmiljø for React komponenter. Historiebog giver dig mulighed for udvikle komponenter interaktivt. Det har en uddybende dokumentation, og du kan Kom i gang med udviklingen i Storybook Hub.
React-Bootstrap
React-Bootstrap integrerer reaktion med de populære Bootstrap 3 frontend rammer. Dens udviklere genopbyggede grundlæggende Bootstrap komponenter med React.js. Dette resulterer i a renere kodebase med mindre gentagelse, og a højere ydeevne.
Bemærk, at som repo er under aktiv udvikling, vil API'erne ændre sig i fremtiden. For nuværende udviklingstilstand, tjek den køreplan for projektet.
Reag Developer Tools til Chrome
Reag DevTools til Chrome er en udvidelse til Chrome Developer Tools og giver dig mulighed for at inspicere komponent hierarki. Det var oprettet af Facebook med bestræbelserne på at hjælpe udviklerne med at opbygge nye React apps. Du kan simpelthen Tilføj det som en Chrome-udvidelse til din browser. Du kan gennemse tilhørende kildekode på Github også.
Reag Developer Tools til Firefox
Dette er Firefox version af det samme Reag Developer Tools skabt af Facebook. Bare tilføj det som en tilføjelse til din Firefox-browser, og begynd at inspicere hierarkietræet i din React-app på en gang.
React.js Pakke til Atom
Du kan tilføje Reagér støtte til din Atom-kode editor med denne Atom React-pakke. Det følger med syntax fremhævning, autofuldførelse, kodestykker, HTML til JSX konvertering, og nogle andre nyttige funktioner, der i høj grad kan lette React udvikling.
React.js Fundamentals - gratis online kursus
Der er mange gode og temmelig billige kurser, hvor du kan lær reaktionsudvikling, men du kan tilmelde dig dette React.js Fundamentals online kursus for helt gratis. Det består af 12 lektioner, starter med Grundlæggende om React, og har a flot pensum der dækker alle vigtige ting.
