목록Gatsby (4)
dev_eun
현재 gatsby로 github.io를 생성하여 개발 중입니다. 그런데 push 할 때마다 빌드하고 배포하는 것이 번거러워 찾아보니 Github Action으로 CI를 만드는 것이 있더라구요! 바로 적용을 해보았습니다. 먼저 보통 github page의 url은 제 페이지처럼 https://eun-seong.github.io/TIL/ 이렇게 생겼을 것입니다. 혹은 뒤에 repository 이름이 없는 username.github.io로만 구성이 되어 있기도 합니다. 1. gatsby-config.js 파일 수정 저처럼 url 뒤에 repo 이름이 붙는 페이지는 개츠비 프로젝트의 gatsby-config.js 파일에 pathPrefix를 추가로 설정을 해주어야 합니다. 형식은 pathPrefix: '/re..
열심히 블로그를 만들고 있었는데, footer가 컨텐츠의 길이에 맞춰 위로 올라오는 것이 보기 좋지 않았다. 구글링을 해보니 wrapper의 flex를 설정하는 글이 많아 시도했지만, 문제가 해결되지 않았다. Header Contents Footer * { margin: 0; padding: 0; box-sizing: border-box; } html, body { height: 100%; } #wrap { text-align: center; display: flex; flex-direction: column; height: 100%; } header { width: 100%; height: 60px; background: #ddd; } main { } footer { width: 100%; height..
로컬에서 실행할 때는 정상적으로 작동되었지만, deploy 후 github.io에서 실행했을 때 css가 정상적으로 작동하지 않는 상황이 발생했다. - 해결 내가 styled-components 만 add 해놓고, gatsby-plugin-styled-components 를 add 하지 않았다. $ yarn add gatsby-plugin-styled-components
항상 프로젝트가 끝나고 나서 드는 생각과 다짐이 있습니다. '다음 프로젝트 때는 매일 공부한 것을 기록해야지..!' 이지만, 항상 지키지 못했죠... 소마가 종료되고 난 후에 너무 후회가 됐습니다. 6개월이란 긴 시간동안 분명 많은 것을 배웠을 텐데, 기록을 하지 않아서 날아가버린 느낌입니다. 아쉽지만 이미 지나갔으니, 앞으로 기록을 꾸준히 해보자는 생각에 TIL 블로그를 제작하기로 하였습니다. 먼저 고민했던 플랫폼들을 살펴보자면, 1. github.io - 장점 github와 연동 - 아마 제일 큰 메리트가 아닐까 git에 대한 이해가 있다면, jekyll, gatsby 등 많은 테마로 커스텀할 수 있다. global - 단점 장벽이 높다. git과 github에 대한 이해가 필요하다. 제작하기 쉽지 ..