handmade blog
v1.3.1
✍️
수제 블로그
이 문서를 다른 언어로 읽어보세요: ?? ?? ?? ?? ?? ?? ??
Handmade Blog는 블로그를 빨리 시작하고 싶은 사람들을 위한 가벼운 정적 블로그 생성기입니다. 블로그 게시물을 위한 기사 유형 문서, 포트폴리오를 위한 작업 유형 문서, 코드 하이라이트, KaTeX 구문, 각주 등을 지원합니다.
모바일의 Article/0.html
데스크톱의 Article/0.html
새 저장소를 생성하려면 파일 목록 상단의 '이 템플릿 사용' 버튼을 클릭하세요. github.io 도메인을 사용하려면 저장소 이름을 {YOUR_ID}.github.io 로 지정해야 합니다. (예: betty-grof.github.io ) '모든 브랜치 포함' 옵션을 활성화하는 것을 잊지 마세요.
저장소에서 '설정' 탭을 클릭하고 GitHub 페이지의 소스 분기를 gh-pages 분기로 설정하세요. GitHub 페이지는 gh-pages 분기를 기반으로 웹사이트를 호스팅합니다. 몇 분 안에 https://{YOUR_ID}.github.io/ 를 통해 웹사이트에 액세스할 수 있습니다.
저장소를 복제하고 노드 패키지를 설치합니다.
$ git clone https://github.com/{YOUR_ID}/{REPOSITORY_NAME}.git # git clone https://github.com/betty-grof/betty-grof.github.io.git
$ cd {REPOSITORY_NAME} # cd betty-grof.github.io
$ npm install 탐색 제목( app/templates/navigations.ejs )과 같은 일부 텍스트를 사용자 정의하고 npm run build 실행합니다.
< nav >
< a class =" logo-link " href =" / " >
< h1 > CUSTOMIZED BLOG TITLE </ h1 >
< span > customized blog subtitle </ span >
</ a >
< small >
< a id =" about " class =" info-link " href =" /about.html " > ?About </ a > /
< a id =" works " class =" info-link " href =" /works.html " > Works </ a > /
< a id =" articles " class =" info-link " href =" /articles.html " > Articles </ a >
</ small >
</ nav > $ npm run build npm start 스크립트를 실행하여 http://localhost:8080/ 에서 수신 대기하는 로컬 서버를 시작하세요. 로컬 서버는 dist 디렉터리를 기반으로 합니다.
$ npm run build
$ npm start
작업 디렉터리의 변경 사항을 원격 저장소에 커밋하고 푸시합니다.
$ git add ./app/templates/navigations.ejs
$ git commit -m " Customize the blog title and subtitle "
$ git push origin master 웹사이트를 호스팅할 준비가 되면 deploy 스크립트를 실행하세요. 이 스크립트는 dist 디렉터리에 로컬 파일을 빌드하고 dist 디렉터리의 파일만 포함하는 gh-pages 분기에 푸시합니다. GitHub 페이지는 gh-pages 분기를 기반으로 자동으로 https://{YOUR_ID}.github.io/ 에서 웹사이트를 호스팅합니다.
$ npm run deploynpm run watch 실행하세요.npm start 실행하여 로컬 서버를 시작합니다. ( npm run watch 여전히 백그라운드나 다른 탭, 다른 세션에서 실행되고 있어야 합니다.)app/templates , app/styles 및 _articles 디렉터리의 파일을 변경할 때마다 자동으로 빌드됩니다._articles 또는 _works 디렉터리에 문서를 작성합니다.npm run publish article 또는 npm run publish work 스크립트를 실행하여 마크다운 문서를 HTML로 변환하세요.npm start 스크립트를 사용하여 로컬 서버에서 변환된 문서를 미리 봅니다.npm run deploy 실행하여 배포합니다. 기존 페이지의 내용을 변경하려면 ejs 템플릿을 수정하세요. 예를 들어 랜딩 페이지에 이미지를 넣으려면 app/templates/index.ejs 파일을 열고 img 태그를 main-container 요소에 추가합니다.
< main id =" main-container " >
< img src =" ../assets/profile.jpg " alt =" My profile picture " />
< p > Lorem ipsum dolor sit amet, consectetur adipiscing elit. </ p >
</ main > 그런 다음 npm run build 스크립트를 실행하여 수정된 랜딩 페이지를 게시하고 npm start 스크립트를 사용하여 로컬 서버에서 변경 사항을 미리 봅니다.
$ npm run build
$ npm start 배포할 준비가 되면 npm run deploy 스크립트를 실행하세요. 랜딩페이지 뿐만 아니라 어떤 페이지든 이런 식으로 변경할 수 있습니다. (프로젝트 구조를 이해해야 할 수도 있습니다.)
루트 디렉터리에 CNAME 파일을 만듭니다. 빌드 프로세스는 자동으로 CNAME을 선택하고 사용자 정의 도메인에서 블로그를 제공할 수 있습니다.
Github이 CNAME을 관리하는 방법에 대해 자세히 알아보려면 문서를 확인하세요.
_articles - 블로그 게시물의 마크다운 파일입니다._works - 포트폴리오용 마크다운 파일입니다.appassets - 이미지, 글꼴 등과 같은 HTML 파일로 가져올 모든 파일입니다.public - publish 스크립트에 의해 생성된 HTML 파일입니다. server 및 dist 디렉터리는 이 디렉터리를 기반으로 합니다. 이 디렉토리 아래의 파일을 직접 변경하지 마십시오.article - _articles 디렉토리에서 변환된 HTML 파일입니다.work - _works 디렉토리에서 변환된 HTML 파일입니다.styles - HTML 파일로 가져올 CSS 소스 코드입니다.static - robots.txt , sitemap.xml 또는 SEO 파일과 같은 build 스크립트로 컴파일되지 않은 정적 파일입니다. build 스크립트는 이 디렉터리 아래의 모든 파일을 dist 디렉터리에 복사합니다.templates - EJS 템플릿 파일입니다. publish 스크립트는 이 디렉터리 아래의 템플릿을 HTML 파일로 변환합니다.dist - build 스크립트로 컴파일된 파일입니다. start 스크립트는 이 디렉터리를 기반으로 로컬 서버를 열고 deploy 스크립트는 이 디렉터리를 기반으로 GitHub 페이지에 웹 사이트를 배포합니다. 이 디렉토리 아래의 파일을 직접 변경하지 마십시오.services - publish 스크립트를 구현하는 소스 코드입니다.classesmodelstools - 다양한 npm 스크립트를 구현하는 소스 코드입니다. npm starthttp://localhost:8080/에서 수신 대기하는 로컬 개발 서버를 시작합니다.
npm run publish템플릿을 HTML 파일로 변환합니다.
$ npm run publish article모든 기사를 변환합니다.
$ npm run publish works모든 작품을 변환합니다.
$ npm run publish article 5ID가 5인 기사를 변환합니다.
$ npm run publish work 3ID가 3인 작품을 변환합니다.
$ npm run publish page모든 페이지를 변환합니다.
npm run watch 파일이 수정될 때마다 자동으로 templates 디렉터리의 템플릿 파일, styles 디렉터리의 css 파일, _articles 디렉터리의 markdown 파일을 다시 빌드합니다.
npm run build소포 번들러를 사용하여 파일을 빌드합니다.
npm run deploy파일을 빌드하고 배포합니다.
이 프로젝트는 MIT 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 LICENSE 파일을 참조하세요.
