Hoe Gatsby op Ubuntu 20.04 te installeren

In dit artikel leggen we uit hoe u Gatsby installeert op Ubuntu 20.04.

Gatsby is een op React gebaseerd open-source framework voor het maken van websites en apps. Het is geweldig, of u nu een portfoliosite of blog bouwt, of een e-commerce winkel met veel verkeer of een startpagina van uw bedrijf. Maak razendsnelle websites en apps EN benut de kracht van meer dan 2000 plug-ins. Bouw snel en eenvoudig sites met de gewenste services, zoals Shopify, Stripe en WordPress, met Gatsby's 2000+ plug-ins. Integreer gegevens van overal: API's, databases, CMS'en, statische bestanden - of meerdere bronnen tegelijk

Dit artikel zal u begeleiden bij het installatieproces en het implementeren van de standaard Gatsby-startsite.

Vereisten

• Een Ubuntu 20.04 geïnstalleerde dedicated server of KVM VPS.
• Een rootgebruiker of normale gebruiker met sudo-beheerdersrechten.

Installeer Gatsby op Ubuntu 20.04

Stap 1 - Houd de server up-to-date

# apt update -y && apt upgrade -y

Stap 2 - Installeer NodeJS en NPM

Installeer de nieuwste stabiele release van NodeJS.

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

# apt-get install -y nodejs

Controleer of de installatie is gelukt.

# node -v && npm -v

Uitgang:

v15.9.0
7.5.4

Stap 3 - Gatsby-cli . installeren

De Gatsby CLI ( gatsby-cli ) is verpakt als een uitvoerbaar bestand dat wereldwijd kan worden gebruikt. De Gatsby CLI is beschikbaar via npm . Voer de volgende opdracht uit om gatsby-cli te installeren :

# npm install -g gatsby-cli

Controleer de installatie:

# gatsby --version

Uitgang:

# Gatsby CLI version: 2.19.1

Stap 4 - Nieuwe site implementeren

Voer de volgende opdracht uit om een ​​nieuwe Gatsby-site te genereren:

# gatsby new

Uitgang:

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

De CLI voert een interactieve shell uit waarin om deze opties wordt gevraagd voordat een Gatsby-site voor u wordt gemaakt. Kies en vul volgens uw websitevereisten. Het zal een Gatsby-site en -map maken in /root .

Bekijk alle opdrachten op https://www.gatsbyjs.com/docs/gatsby-cli/

Een site maken vanuit een starter

Voer de volgende opdracht uit om een ​​Gatsby -site met de naam my-awesome-site te maken met behulp van de standaardstarter:

# gatsby new my-awesome-site

Bovenstaande opdracht maakt een map my-awesome-site aan in /root .

Zie de startersdocumenten van Gatsby voor meer informatie.

Ontwikkelen

Nadat u een Gatsby-site hebt geïnstalleerd, gaat u naar de hoofdmap van uw project en start u de ontwikkelserver met de volgende opdracht:

# cd my-awesome-site

# gatsby develop -H 0.0.0.0

Opties:

• -H, --host Stel host in. Standaard ingesteld op localhost
• -p, --port Poort instellen. Standaard ingesteld op env.PORT of 8000
• -o, --open Open de site in uw (standaard) browser voor u
• -S, --https Gebruik HTTPS

Je kunt nu my-awesome-site in de browser bekijken.

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

Bouwen

Compileer uw toepassing aan de basis van een Gatsby-site en maak deze gereed voor implementatie:

# gatsby build

Opties

• --prefix-paths Bouw een site met vooraf ingestelde linkpaden (stel pathPrefix in in uw configuratie)
• --no-uglify Bouw site zonder lelijke JS-bundels (voor foutopsporing)
• --profile Site bouwen met reageren profilering. Zie Profilering van siteprestaties met React Profiler
• --open-tracing-config-file Tracer-configuratiebestand (compatibel met OpenTracing). Zie prestatietracering
• --graphql-tracing Traceer (zie hierboven) elke graphql-resolver, kan gevolgen hebben voor de prestaties.
• --no-color, --no-colors Schakelt gekleurde terminaluitgang uit

Dat is het. De installatie is succesvol voltooid.