Cum se instalează Gatsby pe Ubuntu 20.04

În acest articol, vom explica cum să instalați Gatsby pe Ubuntu 20.04.

Gatsby este un cadru open-source bazat pe React pentru crearea de site-uri web și aplicații. Este minunat indiferent dacă creați un site de portofoliu sau un blog sau un magazin de comerț electronic cu trafic intens sau pagina de pornire a companiei. Creați site-uri web și aplicații rapide și folosiți puterea a peste 2000 de pluginuri. Construiți site-uri cu serviciile pe care le doriți, cum ar fi Shopify, Stripe și WordPress, rapid și ușor cu ajutorul celor peste 2000 de pluginuri ale lui Gatsby. Integrați date de oriunde: API-uri, baze de date, CMS-uri, fișiere statice - sau mai multe surse simultan

Acest articol vă va îndruma cu procesul de instalare și implementarea site-ului Gatsby de pornire implicit.

Condiții prealabile

• Un server dedicat instalat Ubuntu 20.04 sau KVM VPS.
• Un utilizator root sau un utilizator normal cu privilegii de administrator sudo.

Instalați Gatsby pe Ubuntu 20.04

Pasul 1 - Păstrați serverul la zi

# apt update -y && apt upgrade -y

Pasul 2 - Instalați NodeJS și NPM

Instalați cea mai recentă versiune stabilă a NodeJS.

# curl -sL https://deb.nodesource.com/setup_15.x | sudo -E bash -

# apt-get install -y nodejs

Verificați instalarea cu succes.

# node -v && npm -v

Ieșire:

v15.9.0
7.5.4

Pasul 3 - Instalați gatsby-cli

Gatsby CLI ( gatsby-cli ) este ambalat ca un executabil care poate fi utilizat la nivel global. Gatsby CLI este disponibil prin npm . Rulați următoarea comandă pentru a instala gatsby-cli :

# npm install -g gatsby-cli

Verificați instalarea:

# gatsby --version

Ieșire:

# Gatsby CLI version: 2.19.1

Pasul 4 - Implementați un nou site

Pentru a genera un nou site Gatsby, rulați următoarea comandă:

# gatsby new

Ieșire:

create-gatsby version 0.5.1

Welcome to Gatsby!

This command will generate a new Gatsby site for you in /root with the setup you select. Let’s answer some
questions:

What would you like to call your site?
· My Gatsby Site

CLI va rula un shell interactiv care solicită aceste opțiuni înainte de a crea un site Gatsby pentru dvs. Alegeți și completați conform cerințelor site-ului dvs. web. Se va crea un site și un director Gatsby în / root .

Vedeți toate comenzile la https://www.gatsbyjs.com/docs/gatsby-cli/

Crearea unui site de la un starter

Pentru a crea un site Gatsby numit my-awesome-site folosind starter -ul implicit, executați următoarea comandă:

# gatsby new my-awesome-site

Comanda de mai sus va crea un director my-awesome-site în / root .

Consultați documentele pentru începători Gatsby pentru mai multe detalii.

Dezvolta

După ce ați instalat un site Gatsby, accesați directorul rădăcină al proiectului dvs. și porniți serverul de dezvoltare folosind următoarea comandă:

# cd my-awesome-site

# gatsby develop -H 0.0.0.0

Opțiuni:

• -H, --host Set host. Implicit la localhost
• -p, --port Setați portul. Valorile implicite sunt env.PORT sau 8000
• -o, --open Deschideți site-ul în browserul (implicit) pentru dvs.
• -S, --https Folosiți HTTPS

Acum puteți vizualiza site-ul meu-minunat în browser.

Local: http://localhost:8000/
On Your Network: http://192.168.0.102:8000/

Construi

La rădăcina unui site Gatsby, compilați aplicația și pregătiți-o pentru implementare:

# gatsby build

Opțiuni

• --prefix-căi Construiți site-ul cu căi de legătură prefixate (setați caleaPrefix în configurația dvs.)
• --no-uglify Build site fără a uglifica pachete JS (pentru depanare)
• --profile Construiți site-ul cu profil de reacție. Consultați Profilarea performanței site-ului cu React Profiler
• --open-tracing-config-file Fișier de configurare Tracer (compatibil OpenTracing). Consultați urmărirea performanței
• --graphql-tracing Urmăriți (a se vedea mai sus) fiecare rezolvator graphql, poate avea implicații de performanță.
• --no-color, --no-colors Dezactivează ieșirea terminalului colorat

Asta e. Instalarea a fost finalizată cu succes.