Come installare Gatsby su Ubuntu 20.04

In questo articolo spiegheremo come installare Gatsby su Ubuntu 20.04.

Gatsby è un framework open source basato su React per la creazione di siti Web e app. È fantastico se stai costruendo un sito portfolio o un blog, un negozio di e-commerce ad alto traffico o una home page aziendale. Crea siti Web e app velocissimi E sfrutta la potenza di oltre 2000 plug-in. Crea siti con i servizi che desideri, come Shopify, Stripe e WordPress, in modo rapido e semplice con gli oltre 2000 plug-in di Gatsby. Integra i dati da qualsiasi luogo: API, database, CMS, file statici o più fonti contemporaneamente

Questo articolo ti guiderà con il processo di installazione e la distribuzione del sito Gatsby di partenza predefinito.

Prerequisiti

• Un server dedicato Ubuntu 20.04 installato o KVM VPS.
• Un utente root o un utente normale con privilegi di amministratore sudo.

Installa Gatsby su Ubuntu 20.04

Passaggio 1 - Mantieni aggiornato il server

# apt update -y && apt upgrade -y

Passaggio 2: installa NodeJS e NPM

Installa l'ultima versione stabile di NodeJS.

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

# apt-get install -y nodejs

Verificare che l'installazione sia andata a buon fine.

# node -v && npm -v

Produzione:

v15.9.0
7.5.4

Passaggio 3 - Installa gatsby-cli

La Gatsby CLI ( gatsby-cli ) è impacchettata come eseguibile che può essere utilizzata globalmente. La CLI di Gatsby è disponibile tramite npm . Esegui il seguente comando per installare gatsby-cli :

# npm install -g gatsby-cli

Verificare l'installazione:

# gatsby --version

Produzione:

# Gatsby CLI version: 2.19.1

Passaggio 4 - Distribuisci nuovo sito

Per generare un nuovo sito Gatsby, esegui il seguente comando:

# gatsby new

Produzione:

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

La CLI eseguirà una shell interattiva che richiede queste opzioni prima di creare un sito Gatsby per te. Scegli e compila secondo i requisiti del tuo sito web. Creerà un sito e una directory Gatsby in /root .

Vedi tutti i comandi su https://www.gatsbyjs.com/docs/gatsby-cli/

Creare un sito da un principiante

Per creare un sito Gatsby denominato my-awesome-site utilizzando lo starter predefinito, esegui il seguente comando:

# gatsby new my-awesome-site

Il comando precedente creerà una directory my-awesome-site in /root .

Per maggiori dettagli, consulta i documenti di base di Gatsby.

Sviluppare

Una volta installato un sito Gatsby, vai alla directory principale del tuo progetto e avvia il server di sviluppo usando il seguente comando:

# cd my-awesome-site

# gatsby develop -H 0.0.0.0

Opzioni:

• -H, --host Imposta l'host. Il valore predefinito è localhost
• -p, --port Imposta la porta. Il valore predefinito è env.PORT o 8000
• -o, --open Apri il sito nel tuo browser (predefinito) per te
• -S, --https Usa HTTPS

Ora puoi visualizzare my-awesome-site nel browser.

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

Costruire

Nella radice di un sito Gatsby, compila la tua applicazione e rendila pronta per la distribuzione:

# gatsby build

Opzioni

• --prefix-paths Crea un sito con percorsi di collegamento prefissati (imposta pathPrefix nella tua configurazione)
• --no-uglify Crea il sito senza bruttare i bundle JS (per il debug)
• --profile Costruisci il sito con la profilazione delle reazioni. Vedi Profilazione delle prestazioni del sito con React Profiler
• --open-tracing-config-file File di configurazione di Tracer (compatibile con OpenTracing). Vedi Tracciamento delle prestazioni
• --graphql-tracing Traccia (vedi sopra) ogni risolutore di graphql, può avere implicazioni sulle prestazioni.
• --no-color, --no-colors Disabilita l'output del terminale colorato

Questo è tutto. L'installazione è stata completata con successo.