Ubuntu 20.04에 Gatsby를 설치하는 방법

이 기사에서는 Ubuntu 20.04에 Gatsby를 설치하는 방법을 설명합니다.

Gatsby는 웹사이트와 앱을 만들기 위한 React 기반 오픈 소스 프레임워크입니다. 포트폴리오 사이트나 블로그를 구축하거나 트래픽이 많은 전자 상거래 상점이나 회사 홈페이지를 구축하는 것이 좋습니다. 놀랍도록 빠른 웹사이트와 앱을 만들고 2000개 이상의 플러그인을 활용하세요. Gatsby의 2000개 이상의 플러그인을 사용하여 Shopify, Stripe 및 WordPress와 같은 원하는 서비스로 사이트를 빠르고 쉽게 구축하십시오. API, 데이터베이스, CMS, 정적 파일 또는 여러 소스를 한 번에 어디서나 데이터 통합

이 기사에서는 설치 프로세스와 기본 스타터 Gatsby 사이트 배포를 안내합니다.

전제 조건

• Ubuntu 20.04가 설치된 전용 서버 또는 KVM VPS.
• sudo 관리자 권한이 있는 루트 사용자 또는 일반 사용자.

Ubuntu 20.04에 Gatsby 설치

1단계 - 서버를 최신 상태로 유지

# apt update -y && apt upgrade -y

2단계 - NodeJS 및 NPM 설치

NodeJS의 안정적인 최신 릴리스를 설치합니다.

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

# apt-get install -y nodejs

설치가 성공했는지 확인합니다.

# node -v && npm -v

산출:

v15.9.0
7.5.4

3단계 - gatsby-cli 설치

Gatsby CLI( gatsby-cli )는 전역적으로 사용할 수 있는 실행 파일로 패키징됩니다. Gatsby CLI는 npm을 통해 사용할 수 있습니다 . 다음 명령을 실행하여 gatsby-cli 를 설치하십시오 .

# npm install -g gatsby-cli

설치 확인:

# gatsby --version

산출:

# Gatsby CLI version: 2.19.1

4단계 - 새 사이트 배포

새 Gatsby 사이트를 생성하려면 다음 명령을 실행하십시오.

# gatsby new

산출:

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는 Gatsby 사이트를 생성하기 전에 이러한 옵션을 요청하는 대화형 셸을 실행합니다. 웹사이트 요구 사항에 따라 선택하고 채우십시오. /root 에 Gatsby 사이트와 디렉토리를 생성합니다 .

https://www.gatsbyjs.com/docs/gatsby-cli/에서 모든 명령을 참조하십시오.

스타터에서 사이트 만들기

기본 스타터를 사용하여 my-awesome- site라는 Gatsby 사이트를 생성하려면 다음 명령을 실행합니다.

# gatsby new my-awesome-site

위의 명령은 /root 에 my-awesome-site 디렉토리를 생성 합니다 .

자세한 내용은 Gatsby 스타터 문서를 참조하세요.

개발하다

Gatsby 사이트를 설치했으면 프로젝트의 루트 디렉터리로 이동하고 다음 명령을 사용하여 개발 서버를 시작합니다.

# cd my-awesome-site

# gatsby develop -H 0.0.0.0

옵션:

• -H, --host 호스트를 설정합니다. 기본값은 localhost
• -p, --port 포트를 설정합니다. 기본값은 env.PORT 또는 8000입니다.
• -o, --open (기본) 브라우저에서 사이트를 엽니다.
• -S, --https HTTPS 사용

이제 브라우저에서 my-awesome-site를 볼 수 있습니다.

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

짓다

Gatsby 사이트의 루트에서 애플리케이션을 컴파일하고 배포할 준비를 합니다.

# gatsby build

옵션

• --prefix-paths 접두어가 붙은 링크 경로로 사이트 빌드(구성에서 pathPrefix 설정)
• --no-uglify JS 번들을 uglify하지 않고 사이트 빌드(디버깅용)
• --profile 반응 프로파일링으로 사이트를 빌드합니다. React Profiler로 사이트 성능 프로파일링 보기
• --open-tracing-config-file 추적기 구성 파일(OpenTracing 호환). 성능 추적 보기
• --graphql-tracing 모든 graphql 리졸버를 추적(위 참조)하면 성능에 영향을 미칠 수 있습니다.
• --no-color, --no-colors 컬러 터미널 출력을 비활성화합니다.

그게 다야 설치가 성공적으로 완료되었습니다.