Web Dev/Gatsby :: 개츠비

[Gatsby] 개츠비 설치 & 기본 프로젝트 만들기

HJPlumtree 2020. 10. 12. 23:22

0. 사전작업

개츠비를 설치하기 위해서 Node.js를 먼저 깔자.

Node.js 공식사이트에서 다운 받으면 된다.

nodejs.org/

 

1. Node.js 터미널 실행

 

 

2. 개츠비 설치

npm install -g gatsby-cli

위의 입력하면 개츠비 설치가 시작된다.

 

 

3. 프로젝트 생성

cd "원하는 폴더 루트"

 

우선 프로젝트가 설치되기 원하는 폴더로 이동

gatsby new gatsby-bootcamp https://github.com/gatsbyjs/gatsby-starter-hello-world

이렇게 입력하면

프로젝트(폴더)와 필요한 파일들으 생성한다.

 

 

4. 생성된 프로젝트 불러오기

저는 에디터로 VSCode를 사용합니다.

code.visualstudio.com/

에디터에서 폴더 열기

 

 

5. 에디터에서 터미널열기

여기부터는 Node.js 터미널을 사용안합니다.

상단 옵션에서 Terminal -> New Terminal

 

 

6. 개츠비 develop 이용하기

터미널에 밑에 내용 실행

npm run develop

개츠비 프로젝트가 실행되고 로컬호스트 8000을 확인할 수 있게된다.

 

로컬호스트 8000

지금 작업하고 있는 내용을 로컬에서 확인할 수 있는 공간

 

 

7. 로컬호스트 8000 열기

인터넷창에 localhost:8000 검색

그럼 Hello world!를 볼 수 있다.

 

개츠비 설치하고, 프로젝트 만들기 완료