본문 바로가기

IT/Gatsby3

[Gatsby] Styled-Components 적용하기 Gatsby plugin을 포함하여 styled-components를 위한 필수 dependencies를 설치합니다. # Yarn yarn add gatsby-plugin-styled-components styled-components babel-plugin-styled-components # Npm npm install gatsby-plugin-styled-components styled-components babel-plugin-styled-components gatsby-config.js에 다음을 추가합니다. module.exports = { plugins: [`gatsby-plugin-styled-components`], } 2022. 2. 3.
첫 Gatsby 사이트 만들고 Gatsby Cloud에 배포하기 사이트를 만드는 과정의 전체 프로세스는 다음과 같습니다. 로컬에서 Github로 소스를 push 합니다. Gatsby Cloud에서 Github에 있는 소스를 빌드하고 배포합니다. 사용자들이 사이트에 접속할 수 있습니다. Gatsby 사이트 만들기 Gatsby 사이트를 만들기위해 Gatsby CLI에서 명령어를 사용해야 합니다. gatsby new 위 명령어를 입력하면 여러 질문들이 터미널에 나타납니다. What would you like to call your site? → 사이트 이름 입력 What would you like to name the folder where your site will be created? → 사이트의 폴더 명 Will you be using CMS? → CMS를 사용할 지.. 2022. 1. 23.
[Gatsby] 환경 구축 시작하기 앞서... Gatsby는 React기반으로 정적사이트(Static Site), 일반 웹사이트를 구현할 수 있는 오픈소스 프레임워크입니다. Gatsby라는 프레임워크를 알고만 있었고, 이를 이용해서 사이트를 개발해보고 싶었는데, 이번 기회에 Gatsby로 사이트를 만들어보면서 공부한 내용을 하나씩 정리해보려고 합니다. 주로 공식사이트를 기준으로 정리를 할 예정이고, 다른 블로그나 사이트에서 참고하면 아래의 참고자료로 남길 예정이니 자세한 내용은 아래 참고자료를 확인해주세요. 사전지식 Gatsby를 이용해서 사이트를 만들기 위해서는 Web 기술과 친해져야하고, 필요 소프트웨어 툴을 설치했는지 확인해야 합니다. 아래 4가지는 Gatsby에서 요구하는 사전지식 입니다. HTML (https://www... 2022. 1. 19.