React.js 14 Narzędzia i zasoby dla programistów internetowych

The popularność React.js był szybko rośnie odkąd Facebook po raz pierwszy wydał bibliotekę w 2013 roku piąty najczęściej wybierany projekt open source na Github, a ogłoszenia o pracy dla deweloperów React również bardzo się rozwijają. Reaguj to lekki framework JavaScript dla budowanie interfejsów użytkownika - najważniejszymi przykładami są Facebook i Instagram.

React oferuje alternatywa dla ram MVC, takie jak Kątowe lub Szkieletowe, z bardziej prosta struktura i nacisk na optymalizację wydajności. Ponieważ React z pewnością określi krajobraz tworzenia stron internetowych w nadchodzących latach, w tym artykule chcielibyśmy przedstawić Wam zestaw narzędzi dla programistów aby pomóc Ci postawić stopę w dziedzinie rozwoju React.

Oficjalne dokumenty React.js z Facebooka

Facebook zapewnia programistom szczegółowa dokumentacja na główne koncepcje React. Oprócz dokumentów znajdziesz tu także świetny samouczek jak zbudować interaktywną grę kółko i krzyżyk z React, a forum dyskusyjne dla programistów React. Jako docs są open-source, możesz nawet edytować je, jeśli chcesz.

React.js Repo Github

W repozytorium React Github możesz sprawdź kod źródłowy React kiedy tylko tego potrzebujesz. Jeśli chcesz być na bieżąco z aktualnym stanem rozwoju, możesz również zapoznać się z zagadnienia, kamienie milowe, i najnowsze żądania ściągania. Jeśli utkniesz, dobrym pomysłem może być również studiowanie Podręcznik rozwiązywania problemów trochę.

Witaj Światowy kod startowy

Jeśli chcesz szybko spróbować React, możesz zacząć od tego “Witaj świecie” interaktywne demo na Codepen. Obejmuje wszystkie niezbędne aktywa i kod startowy także. Ponieważ Babel jest również włączony, możesz go używać zarówno ECMAScript 6, jak i składnia JSX. Wystarczy rozwidlić pióro, a możesz iść dalej bez konieczności konfigurowania całego środowiska na własną rękę.

React Starter Kit

The React Starter Kit jest izomorficzna aplikacja sieciowa zbudowany z Node.js, Express, GraphQL, React, i kilka narzędzi do tworzenia stron internetowych, takich jak Pakiet internetowy, Babel, i Browsersync. Dostarcza Ci ten sam frontendowy stos Facebooka i pozwala wskoczyć full-stack React development bez zbytniego kłopotu.

ReactCSS

ReactCSS daje możliwość dodaj wbudowane style CSS w JavaScript. ReactCSS zawiera wsparcie dla React, Redux, React Native (ramy do tworzenia rodzimych aplikacji mobilnych przy użyciu React), autoprefixing, hover, pseudoelementy i zapytania o media. Możesz szybko zainstaluj go za pomocą npm.

React integracja JSFiddle (z i bez JSX)

To wspaniale plac zabaw online jeśli chcesz miejsce, w którym możesz zacząć ćwiczyć React. Jego hostowane na JSFiddle, i ma dwie wersje: jeden z JSX i jeden bez JSX, wybierz ten, z którym jesteś bardziej komfortowy.

Reaktywuj generator przewodnika stylu

Możesz szybko wygeneruj przewodnik stylu dla twojego projektu React z tym łatwym w użyciu Reaktywuj generator przewodnika stylu. Musisz tylko dodaj trochę dokumentacji do twoich plików, a generator zajmie się resztą. Narzędzie zawiera szczegółowy plik Readme.

Konfigurowalne elementy Reaguj

Piękność jest Reaguj na bibliotekę komponentów które cię wyposaża zestaw komponentów React możesz użyć w swoim projekcie, na przykład “Przycisk”, “Karta”, “Prządka”, “Przełącznik”, “Ocena”, różne komponenty formularza i inne. Komponenty działają zarówno na urządzeniach mobilnych, jak i stacjonarnych, i oni są konfigurowalny także.

Belle jest nie jedyna biblioteka komponentów React tam możesz znaleźć inne wspaniałe na Githubie, takie jak Reaguj na widgety lub Pierwiastkowy.

React Storybook UI Development Environment

Jeśli nie chcesz używać biblioteki komponentów innej osoby, ale chcesz zbudować swój własny, warto spróbować React StoryBook który jest Środowisko programistyczne interfejsu użytkownika dla komponentów React. Storybook pozwala na rozwijać komponenty interaktywnie. Ma rozbudowana dokumentacja, i możesz zacznij od rozwoju w Storybook Hub.

React-Bootstrap

React-Bootstrap integruje React z popularnym Struktura frontendowa Bootstrap 3. Jego twórcy zasadniczo przebudowali komponenty Bootstrap za pomocą React.js. Powoduje to a czystsza baza kodu z mniejszą liczbą powtórzeń i a wyższa wydajność.

Zauważ, że ponieważ repo jest aktywnie rozwijane, interfejsy API zmienią się w przyszłości. Dla aktualny stan rozwoju, Sprawdź mapa drogowa projektu.

Reaguj na narzędzia programistyczne dla Chrome

Reaguj na DevTools dla Chrome to rozszerzenie do narzędzi programistycznych Chrome i pozwala na sprawdź hierarchię komponentów. To było stworzony przez Facebook starając się pomóc społeczności programistów w tworzeniu nowych aplikacji React. Możesz po prostu dodaj go jako rozszerzenie Chrome do twojej przeglądarki. Możesz przeglądać przynależny kod źródłowy na Githubie.

Reaguj na narzędzia programistyczne dla Firefoksa

To jest Wersja Firefox tego samego React Tools Developer stworzony przez Facebook. Po prostu dodaj jako dodatek do przeglądarki Firefox, i zacznij natychmiast sprawdzać drzewo hierarchii swojej aplikacji React.

Pakiet React.js dla Atom

Możesz dodać Reaguj na pomoc do edytora kodu Atom z tym pakietem Reakcji Atom. To przychodzi podświetlanie składni, autouzupełnianie, fragmenty kodu, konwersja HTML do JSX, i kilka innych przydatnych funkcji, które mogą znacznie ułatwić rozwój Reactu.

React.js Fundamentals - bezpłatny kurs online

Istnieje wiele doskonałych i dość niedrogich kursów, gdzie możesz uczyć się rozwoju React, jednak możesz to zapisać React.js Podstawy kurs online za darmo. Składa się z 12 lekcji, zaczyna się od podstawy Reactu, i ma ładny program nauczania który obejmuje wszystkie ważne rzeczy.