# gatsby
LIKELION🦁 TIL(2022-06-28)
git rm —cached \[파일명] ⇒ git add 삭제 (index에서 그냥 지워버리는 것)특정 파일을 제외할 때 사용하자.git resotre a ⇒ 파일 수정되었을 때, 그 이전으로 바꾸는 코드서버 시작하기 npm run startcat .gitignore
Gatsby: Link 태그
Gatsby에서 pages 폴더에 파일을 생성하면 바로 이 페이지로 갈 수 있는 url을 만들어준다.예시) pages 폴더에 info.tsx파일 있는 경우, 'http://localhost:8000/info'로 그냥 들어갈 수 있음.따라서 다음과 같이 a 태그
GraphiQL & Gatsby에서 GraphQL 사용 예시
GraphQL이 제공하는 IDE. 이를 사용함으로써 어떤 데이터를 요청할 수 있는지 알 수 있음.GraphiPL IDE 링크: 다음과 같이 gatsby develop으로 서버 실행시 나오는 두 개의 링크 중 아래 거.GraphiPL IDE우리 사이트의 메타데이터를 가져
맥북 M1 Monterey에서 Gatsby 프로젝트 생성하기(Gatsby Command Not Found 해결)
터미널에서 gatsby-cli 를 설치하고 이를 사용해서 프로젝트를 생성한 후, 다음과 같이 프로젝트에 들어가 로컬 서버를 실행하려 했으나 gatsby command not found 라는 오류가 났다.이를 해결하기 위해 다음과 같이 진행해주었다.1\. npm path
JAM Stack과 Gatsby
an architecture designed to make the web faster, more secure, and easier to scale.자바스크립트와 HTML, CSS, API 기술을 사용하여 웹을 구성한다.기존 웹사이트와 달리 JAM Stack은 구성 방식
개인 블로그에 다크모드 적용하기
Gatsby 는 리액트 기반 정적 사이트 생성기로, 개인 블로그나 소개 페이지같은 정적 사이트를 제작할 때 많은 사람들이 사용하는 프레임워크입니다. 정적 사이트기에 빌드 과정이나, 하이드레이트되는 것이 일반 리액트 앱과는 많이 다랐고 다크모드를 적용할 때 많은 시행착오
Gatsby 동적 페이지 생성
Gatsby.js는 JAM 스택을 기반으로 한 정적 사이트 생성기이다. 정적 사이트란 서버에 존재하는 데이터를 변화시키는 일 없이 그대로 사용자에게 보여주는, 고정된 웹 사이트 형식을 말한다.복잡한 API 통신이나 백엔드를 설계해야 할 일이 적으므로 순수 자바스크립트나
외부 망에서 localtunnel 사용하여 Localhost 접속하기
Localtunnel은 nodejs 기반으로 개발되어 있어 npm을 먼저 설치하고 localtunnel 설치를 진행합니다.Windows: sudo apt install npmMac: brew install nodesudo npm install -g localtunel진
[gatsby] reach-router 이해하기, <Link> 클릭하면 location.pathname이 이상해요
Gatsby는 React 기반 프레임워크지만, react-router-dom을 사용하는 React와 달리 reach-router를 사용한다. 이로 인해 발생한 엉뚱한 에러를 해결하는 과정이다.
[SSR/SSG] Gatsby 시작하기
안녕하세요. 김용성입니다.오늘은 정적 사이트 구축을 위해 사용되는 Gatsby JS를 설명하고 이를 이용해서 프로젝트를 시작하는 방법에 대해 포스팅하고자 합니다.
[Gatsby] Gatsby 개념 이해하고 튜토리얼 시작하기
Gatsby 란 무엇인지, 어떠한 장점이 있는지 전반적인 개념에 대해 알아본 후 튜토리얼을 통해 Gatsby 개발 시작하는 과정을 정리했습니다 💻
Gatsby로 나만의 블로그 만들기 feat. gatsby-starter-bee (2)
Gatsby로 나만의 블로그 만들기 feat. gatsby-starter-bee (1)1) 정적 사이트 생성기인 Jekyll 또는 Gatsby를 이용해서 블로그를 만든다.2) github pages 또는 netlify로 호스팅을 한다.3) google search co