# gatsbyjs
GatsbyJS
React 기반의 정적 HTML 페이지 생성기로 기존에 블로그 제작에 많이 사용되었던 Jekyll와 비슷하다기본적인 default 생성 방법과 starter pack 을 사용하는 두가지 방법이 있는데, 포트폴리오 또는 블로그를 빠르게 구축하고 싶을 경우 starter
[GatsbyJS] 'document is not defined' 해결하기
[GatsbyJs] 'document is not defined' 해결하기
[Gatsby JS - Typescript] StyledComponent 로 Dark Theme 구현하기.
Gatsby JS를 간단히 말하자면 정적페이지이다.그래서 동적으로 Javascript 코드로 CSS를 바꾸는 방법은 정적페이지인 Gatsby JS에는 CRA로 만드는 웹페이지와 다르게 해줘야한다.작성중Styled Component에서 제공하는 Theme(직접 커스텀)
첫 포스트: 처음 해보는 정적 블로그
2021년 새해를 맞아 velog에 작성하는 첫 포스팅이다.그동안 나는 AWS Lightsail의 가상 서버 상에서 워드프레스 기반의 블로그를 돌렸었다. (모두들 알다시피 워드프레스는 동적 웹페이지 기반 CMS의 대표주자다) 하지만 개인적 사정으로 인해 서버 유지비로
Gatsby 로 블로그 만들기 (4) (최종)
이번에는 최상위 주소로 들어갔을 때, 최근에 작성한 게시글 목록을 표시하는 기능과 utterances 위젯을 활용하여 덧글 기능을 구현 해 보겠습니다. 지금 index.tsx 파일에는 기본으로 작성 된 내용이 있으니 먼저 이 내용을 지우고 임시로 내용을 채웠습니다. _(2)-e4f006ba-f204-49d7-b43d-a7c258abe18f.png) 그 ...
Gatsby 로 블로그 만들기 (3)
지난번에는 마크다운 파일을 사용하여 동적으로 페이지를 만드는 작업까지 진행 했습니다. 이번에는 타입스크립트를 사용하면서 발생하는 미묘한 불일치를 해결 해 보겠습니다. GraphQL 쿼리의 반환 타입 지정 Untitled-3bd2a666-5f39-45c1-b7cd-ffdc6fa6a758.png createPages 함수 내에서 allMarkdown...
Gatsby 로 블로그 만들기 (2)
Gatsby 로 블로그 만들기 (2) 지난번에는 Gatsby 로 새로운 프로젝트를 생성하고, 타입스크립트와 Prettier 설정을 진행했습니다. 이번에는 Gatsby 의 기능을 이용해서 동적으로 페이지를 생성하는 기능을 구현 해 보겠습니다. 일반적으로는 pages 폴더에 컴포넌트를 추가하는 방식으로 페이지를 추가할 수 있지만, 블로그처럼 파일을 읽어서 ...
Gatsby 로 블로그 만들기 (1)
최근 들어 개인 블로그의 필요성을 느꼈습니다. Velog 는 제가 좋아하는 플랫폼이지만, 여전히 가슴 한 켠에 있는, 개인 블로그를 만들고 싶다는 욕망이 솟아난게 아닐까 싶습니다. 어떻게 만들어야 할 지 고민한 결과, 지금이 GatsbyJS 를 사용하기 가장 적당하다고 생각했습니다. GatsbyJS 는 유명한 정적 사이트 생성기 입니다. 자바스크립트와 리...