Stwórz aplikację React, stwórz swoją pierwszą aplikację w React Ubuntu 20.04

W następnym artykule przyjrzymy się temu jak możemy stworzyć naszą pierwszą aplikację z ReactJS na Ubuntu 20.04 przy użyciu aplikacji Create React. ReactJS to biblioteka JavaScript typu open source używana do tworzenia interfejsu użytkownika, utrzymywana przez Facebooka i społeczność programistów. ReactJS może być używany do tworzenia aplikacji internetowych lub aplikacji mobilnych.

W reakcji, znany również jako ReactJSdane są przetwarzane w DOM. Do uruchomienia aplikacji React wymagane są dodatkowe biblioteki do zarządzania routingiem i stanem. Niektóre przykłady tych bibliotek to Redux y Reaguj na router.

Instalowanie React na Ubuntu 20.04

Aby zainstalować React w naszym systemie, musimy najpierw wiedzieć, czym jest npm i zrozumieć, dlaczego ich potrzebujemy. Npm to skrót od Node Package Manageri jest to największy na świecie rejestr oprogramowania typu open source. Zawiera ponad 800.000 XNUMX pakietów kodów. Npm jest darmowy, a każde publiczne oprogramowanie można pobrać i używać bez rejestracji lub logowania.

Npm to narzędzie do zarządzania zależnościami w aplikacjach javascript, który pomaga zainstalować wszystkie biblioteki i inne narzędzia wspierające rozwój aplikacji JS.

Zainstaluj npm

do zainstaluj nodejs, który zawiera npm, będziemy musieli tylko otworzyć terminal (Ctrl + Alt + T) i wykonać następujące polecenie:

sudo apt install nodejs

Po zakończeniu instalacji npm możemy sprawdź swoją wersję i wersję node. Możemy to zrobić poleceniem:

npm -v

Wersja zainstalowanego npm zależy od daty instalacji, ponieważ aktualizacja jest wykonywana często. Konieczne jest upewnienie się, że mamy zainstalowaną wersję wyższą niż 5.

do sprawdź zainstalowaną wersję węzłapolecenie do użycia to:

node -v

Jeśli nie masz zainstalowanej najnowszej wersji npm w swoim systemie, możesz zaktualizować Node Package Manager (npm) do najnowszej wersji uruchamiając to polecenie w terminalu:

sudo npm install -g npm@latest

Zainstaluj aplikację create-react-app

Aby zainstalować wydajne środowisko React, będziemy musieli skonfigurować narzędzia, takie jak babel, webpack itp., Które są skomplikowane w konfiguracji dla początkujących w świecie React. Ale możemy znaleźć kilka narzędzi, które pomogą nam w konfiguracji. Wśród nich znajdziemy create-react-app, czyli najłatwiejsze w obsłudze i konfiguracji narzędzie.

Create React App to wygodne środowisko do nauki Reacti jest to najlepszy sposób na rozpoczęcie tworzenia nowej aplikacji jednostronicowej przy użyciu React.

Utwórz aplikację React, skonfiguruj swoje środowisko programistyczne abyś mógł korzystać z najnowszych funkcji JavaScript, zapewniając dobre wrażenia programistyczne i optymalizując aplikację pod kątem produkcji. Jak wskazano na ich stronie internetowej, konieczne jest zainstalowanie Node> = 8.10 i npm> = 5.6 na twoim komputerze.

Możemy zainstaluj aplikację create-react-app za pomocą npm. Aby to zrobić, w terminalu (Ctrl + Alt + T) będziemy musieli wykonać tylko następujące polecenie instalacji:

sudo npm install -g create-react-app

Po zakończeniu instalacji aplikacji create-react-app w naszym systemie możemy sprawdź zainstalowaną wersję wykonanie następującego polecenia:

create-react-app --version

Utworzenie pierwszej aplikacji React

Naszą pierwszą aplikację React można stworzyć po prostu za pomocą aplikacji create-react-app. Będziemy musieli użyć tylko następującego polecenia:

create-react-app mi-primera-app

Powyższe polecenie utworzy aplikację React o nazwie moja-pierwsza-aplikacja. W tym samym czasie zostanie utworzony nowy folder o tej samej nazwie, co aplikacja, zawierający wszystkie niezbędne pliki, ustawienia i biblioteki.

Uruchomienie aplikacji React

Po utworzeniu projektu React, będziemy musieli przejść do katalogu projektu i uruchomić aplikację React za pomocą następującego polecenia w terminalu (Ctrl + Alt + T):

npm start

Polecenie początek npm uruchom serwer programistyczny, który wykona cały proces kompilacji.

Terminal powie nam, że musimy otwórz przeglądarkę i załaduj aplikację, która będzie domyślnie działać pod adresem URL http: // localhost: 3000. Po otwarciu przeglądarki zobaczymy logo React i teksty na ekranie.

Odinstaluj aplikację create-react-app i npm

Użytkownicy możemy odinstalować każdą bibliotekę zainstalowaną z npm za pomocą polecenia npm uninstall. Uruchom następujące polecenie w terminalu (Ctrl + Alt + T), aby odinstalować Utwórz aplikację reagującą:

sudo npm uninstall -g create-react-app

Podobnie możemy odinstaluj npm używając tego innego polecenia w tym samym terminalu:

sudo apt remove nodejs

Więcej informacji na temat tej biblioteki JavaScript do tworzenia interfejsów użytkownika można znaleźć w dokumentacja projektu.