ryosuke gatsby blog 다운로드 -Ryosuke ryosuke gatsby blog 소스 코드 다운로드

ryosuke gatsby blog

기타 카테고리

1.0.0

다운로드

Ryosuke의 개인 포트폴리오 및 블로그

Gatsbyjs 프레임 워크로 만든 개인 포트폴리오 및 블로그는 정적 React 전원 웹 사이트를 생성합니다. 번개가 빠르고 SEO 및 PWA 친화적이며 GitHub 페이지 또는 NetLify와 같은 CDN에 직접 배포됩니다.

이것은 Go 또는 Ruby로 작성된 정적 사이트 생성기 솔루션에 대한 JavaScript 대안입니다. 또한 블로그 아카이브, 이미지 처리, SEO 최적화 및 몇 가지 기능과 같은 기능을 갖춘 Gatsby 스타터 블로그보다 더 많은 양육입니다.

구조

집
프로젝트
- Pagination 아카이브
블로그
- Pagination 아카이브
태그
- 태그 아카이브
에 대한

포스트 형식 / 필드

 ---
title : Deploy a Static React Blog using GatsbyJS and Github
date : " 2018-03-21 "
section : blog
cover_image : " ./[email protected] "
tags : [ 'design', 'development', 'react', 'github', 'gatsbyjs', 'ssg', 'static site generator' ]
---

Your post here

섹션은 blog 또는 project 일 수 있습니다.
태그는 배열이어야합니다
신체 함량에는 Markdown 또는 HTML이 포함될 수 있습니다.

플러그인

코데 펜

CodePen 모듈을 포함 시키려면 Embed Code를 복사하고 가져 오는 JS 스크립트를 제거하십시오.

지저귀다

임베드 코드의 블록 쿼트 부분을 Markdown 파일에 복사하여 트윗을 게시물에 원활하게 포함시킵니다. 링크 된 JS 파일을 복사하지 마십시오. 플러그인 처리는 자동으로 처리됩니다.

명백한

gatsby-config.js 에서 구성하십시오.

RSS 피드

gatsby-config.js 에서 구성하십시오.

개발

정적 React 앱을 생성하는 SSG 인 Gatsbyjs에서 실행됩니다.

npm install
npm run develop

전개

Github 페이지

파일을 로컬로 빌드 한 다음 gh-pages 라는 특정 git 리포 브랜치를 업데이트하는 NPM 스크립트를 사용하여 배포합니다.

이를 가능하게하려면 프로젝트에서 Git Repo를 초기화하고 변경 사항을 커밋 한 다음 Github Repo를 원격 저장소로 추가하십시오. 리모컨을 origin 으로 표시하십시오. 그렇지 않으면 개츠비 배포는 어떤 repo로 푸시할지 알 수 없습니다.

origin 원격 Repo에 사이트를 배포합니다.

npm run deploy

컨텐츠 작성 또는 편집

최신 게시물을 갖추고 충돌을 병합하기 위해 원격 원점에서 git pull .
src/content/projects 에 새 폴더를 추가하거나 게시물의 이름을 따서 명명 된 src/content/blog . 이것은 기사의 슬러그로 변환됩니다. 제목을 '케밥 케이스'할 필요는 없지만 형식을 명심하십시오.
폴더에서 마크 다운 파일을 만듭니다. 이전 파일을 템플릿으로 사용하여 모든 적절한 필드 (위에 나열)를 포함하십시오.
게시물을 작성하고 표지 이미지를 포함하십시오 (이미지 처리를위한 다음 단계 참조)
모든 이미지의 경우 게시물의 마크 다운과 동일한 폴더에 포함시키고 <img src="./my-image.jpg" /> 사용하여 로컬로 링크하십시오.
프로젝트 루트에 npm run deploy GitHub 페이지에 배포하십시오.

Netlify

이 사이트는 또한 NetLify에 배포 할 수 있습니다. NetLify에 로그인하고 새 앱을 만들고이 저장소를 가리 키십시오. 단계를 따라 NetLify가 gatsby build 실행하고 /public 디렉토리를 가리키고 있는지 확인하십시오. 또한 NetLify CMS를 사용할 수 있습니다. OAUTH2 지원을위한 서버가 필요하고 NetLify에서 호스팅하면 각 편집기에서 다시 구매 할 수 있습니다 (개인 시스템에서 구축하고 배포하는 대신).