Mājas lapa » Toolkit » React.js 14 Web rīku rīki un resursi

    React.js 14 Web rīku rīki un resursi

    The React.js popularitāte ir bijis strauji aug kopš Facebook pirmo reizi atbrīvoja bibliotēku 2013. gadā piektais visbiežāk atzīmētais atklātā pirmkoda projekts Github, un React izstrādātājiem paredzētās darba reklāmas arī ievērojami pieaug. Reakcija ir a viegls JavaScript ietvars par veidot lietotāja saskarnes - vissvarīgākie piemēri ir Facebook un Instagram.

    Reaģē piedāvā alternatīva MVC sistēmām, piemēram, leņķveida vai mugurkauls, ar a vienkāršāka struktūra un koncentrēties uz veiktspējas optimizāciju. Tā kā React noteikti noteiks tīmekļa attīstības ainavu tuvākajos gados, šajā rakstā mēs vēlētos sniegt jums izstrādātāja rīkkopa lai palīdzētu jums uzstāties React attīstības sfērā.

    Oficiālie React.js dokumenti no Facebook

    Facebook sniedz izstrādātājiem a detalizētu dokumentāciju uz React galvenie jēdzieni. Papildus dokumentiem jūs varat atrast arī lielisku pamācību kā veidot interaktīvu tic-tac-toe spēli ar React un a diskusiju forums React izstrādātājiem. Kā dokumenti ir atvērtā koda, jūs pat varat tos rediģēt, ja vēlaties.

    React.js Github repo

    Repo Github reakcijā jūs varat pārbaudiet React pirmkodu kad vien tas ir nepieciešams. Ja jūs vēlaties palikt informēti par pašreizējo attīstības stāvokli, jūs varat arī apskatīt jautājumiem, the atskaites punkti, un pēdējie vilces pieprasījumi. Ja jums ir iestrēdzis, tas var būt arī laba ideja Problēmu novēršanas rokasgrāmata mazliet.

    Hello World starta kods

    Ja vēlaties ātri mēģināt reaģēt, varat sākt ar to “Sveika pasaule” interaktīva demonstrācija uz Codepen. Tas iekļauj visus nepieciešamos aktīvus un startera kods arī. Tā kā Babels arī ir, jūs varat izmantot gan ECMAScript 6, gan JSX sintakse. Vienkārši izvelciet šo pildspalvu, un jūs varat doties uz priekšu, nenodrošinot visu vidi.

    Reaģējiet uz starta komplektu

    The Reaģējiet uz starta komplektu ir izomorfs tīmekļa lietotņu katls būvēts Node.js, Express, GraphQL, React, un daži tīmekļa izstrādes rīki, piemēram, Webpack, Babel, un Pārlūkprogrammas sinhronizācija. Tas nodrošina jūs ar tajā pašā frontend stack Facebook izmanto un ļauj pāriet uz pilna kaudze Reaģējiet uz attīstību bez pārāk daudz problēmu.

    ReactCSS

    ReactCSS ļauj pievienojiet iekšējos CSS stilus JavaScript. ReactCSS tiek nodrošināts ar React, Redux, React Native atbalstu (sistēma, lai veidotu vietējās mobilās lietotnes, izmantojot React), autoprefiksēšana, hover, pseidoelementi un mediju vaicājumi. Jūs varat ātri instalējiet to ar npm.

    Reaģējiet uz JSFiddle integrāciju (ar un bez JSX)

    Tas ir liels tiešsaistes rotaļu laukums ja vēlaties vietu, kur var sākt nodarboties ar React. Tas ir JSFiddle, un ir divas versijas: viens ar JSX un viens bez JSX, izvēlēties, kurš no jums ir ērtāks.

    Reaģējiet uz stila gida ģeneratoru

    Jūs varat ātri izveidot stila ceļvedi Jūsu React projektam ar šo viegli lietojamo Reaģējiet uz stila gida ģeneratoru. Jums ir tikai pievienojiet nelielu dokumentāciju failus, un ģenerators rūpējas par pārējo. Rīks nāk ar detalizētu readme failu.

    Konfigurējamas Belle Reaģēšanas sastāvdaļas

    Belle ir Reaģējiet uz komponentu bibliotēku kas jums nodrošina React komponentu kopums jūs varat izmantot savā projektā, piemēram, “Poga”, “Karte”, “Spinner”, “Pārslēgt”, “Reitings”, dažādas formas sastāvdaļas un citi. Komponenti darbojas gan mobilajā, gan darbvirsmā, un viņi ir pielāgojama arī.

    Belle ir ne tikai React komponentu bibliotēka tur, jūs varat atrast citus lieliskus Github, piemēram, Reaģējiet uz logrīkiem vai Elementārā.

    React Storybook UI izstrādes vide

    Ja nevēlaties izmantot kādu citu komponentu bibliotēku, bet vēlaties izveidot savu, ir vērts mēģināt React StoryBook kas ir a UI izstrādes vide React komponentiem. Storybook ļauj jums attīstīt komponentus interaktīvi. Tam ir izstrādāt dokumentāciju, un jūs varat sākt ar attīstību iekš Storybook Hub.

    React-Bootstrap

    React-Bootstrap integrē Reaģē ar populāro Bootstrap 3 frontend sistēma. Tās izstrādātāji būtībā pārbūvēja Bootstrap komponentus ar React.js. Tā rezultātā a tīrāku kodu bāze ar mazāku atkārtojumu, un a augstāka veiktspēja.

    Ņemiet vērā, ka, tā kā repo darbojas aktīvā attīstībā, API mainīsies nākotnē. Priekš pašreizējais attīstības stāvoklis, izbraukšana projekta vadlīnijas.

    Reaģējiet uz Chrome izstrādātāju rīkiem

    Reaģējiet uz DevTools Chrome ir Chrome izstrādātāju rīku paplašinājums un ļauj jums pārbaudīt sastāvdaļu hierarhiju. Tas bija izveidoja Facebook cenšoties palīdzēt attīstītājiem veidot jaunas React lietotnes. Jūs varat vienkārši pievienojiet to kā Chrome paplašinājumu pārlūkprogrammā. Varat pārlūkot piederības avota kods Githubā.

    Reaģējiet uz izstrādātāja rīkiem Firefox

    Tas ir Firefox versija tās pašas Reaģējiet uz izstrādātāju rīkiem, ko izveidojis Facebook. Vienkārši pievienojiet to kā Firefox pārlūkprogrammas papildinājums, un nekavējoties sākt pārbaudīt savas React lietotnes hierarhijas koku.

    React.js pakete Atom

    Jūs varat pievienot Reaģējiet uz Atom koda redaktoru ar šo Atom React paketi. Tas nāk ar sintakses izcelšana, automātiskā pabeigšana, koda fragmenti, HTML uz JSX konversiju, un dažas citas noderīgas funkcijas, kas var ievērojami atvieglot reaģēšanu.

    React.js Fundamentals - bezmaksas tiešsaistes kurss

    Ir daudzi lieliski un diezgan lēti kursi, kur var mācīties Reaģēt uz attīstību, tomēr jūs varat to reģistrēt React.js pamati tiešsaistes kurss pilnīgi bez maksas. Tas sastāv no 12 stundas, sākas ar Reakcijas pamati, un tam ir a jauka mācību programma kas aptver visas svarīgās lietas.