2021년 Hexo, Netlify와 함께 정적 블로그 만들기
선결 조건
시작하기 전에 로컬 컴퓨터에 설치해야 합니다.
로컬에 Hexo 블로그 만들기
터미널을 열고 npm을 통해 전역적으로
hexo-cli을 설치합니다. (npm는 Node.js의 패키지 관리자이며 기본적으로 첨부됩니다.)npm install hexo-cli
hexo init
hexo init <folder_name>을 사용하고 cd <folder_name>을 사용하여 이 폴더를 탐색하여 다음 절차를 알아보십시오.다음에 이 명령을 실행하면 설치 의존항을 완성합니다.
npm install
hexo server
현재, 당신은 당신의 Hexo 블로그 http://localhost:4000을 방문할 수 있습니다.Hexo는 이제 감시 파일의 변경 사항을 감시하고 정적 사이트를 자동으로 다시 렌더링합니다.
Ctrl+C을 눌러 시청을 중지할 수 있습니다.hexo server을 실행할 때 다른 명령을 실행하려면 별도의 터미널 창을 사용해야 합니다.
Hexo 블로그(기본 경관 테마)
너의 첫 번째 Hexo 블로그 글을 써라
우선 Hexo 파일 구조를 살펴봅시다.
Hexo 블로그 폴더 구조
source/_posts 폴더에 추가합니다.기본적으로 Hexo는 hello-world.md 댓글을 만들었습니다._config.yml은 Hexo 블로그의 모든 구성을 담당합니다.그것은 YAML을 사용한다.hexo new [layout] "[post title]"
hexo new post "My First Post"
post은 Hexo의 기본 레이아웃으로 간단한 블로그 게시물을 만들 것입니다. 따라서 상기 명령을 hexo post "My First Post"으로 줄일 수 있습니다)위 명령은
My-First-Post.md 폴더에 source/_posts이라는 파일을 생성합니다.이 파일은 다음과 같습니다.---
title: My First Post
date: 2021-01-01 05:45:03
tags:
---
post.md 폴더의 레이아웃 (이 예는 scaffolds) 을 사용하여 자동으로 파일을 생성합니다.이제 새 파일에 모든 내용을 추가하고 저장할 수 있습니다.
---
title: My First Post
date: 2021-01-01 05:45:03
tags:
---
This is my first Hexo Blog Post!
영구선 변경
_config.yml 파일에는 사이트 전체의 구성이 포함되어 있습니다.대다수의 배치는 모두 자명하지 않다.permalink 형식을 어떻게 바꾸는지 보여 줍니다.기본적으로 블로그 게시물에는
:year/:month/:day/:title/ 형식의 URL이 있습니다.그러나 better on-page SEO의 경우 URL을 짧게 유지하는 것이 좋습니다.다음 구성을 사용하여 URL의 제목만 표시합니다.
permalink: :title/
hexo server에서는 _config.yml의 변경 사항을 모니터링하지 않습니다.따라서 파일을 편집한 후 서버를 중지하고 다시 시작해야 합니다.주제 변경
Hexo 블로그의 주제를 바꾸는 것은 매우 간단하다.우선github 환매 협의나 Hexo themes list에서 주제를 선택하십시오.
여기서 나는 july theme에서 wisp-x을 선택할 것이다.먼저git repo를
themes/[theme_name] 폴더로 복제합니다.git clone https://github.com/wisp-x/hexo-theme-july.git themes/july
_config.yml에서 테마 이름을 변경합니다.theme: july
Hyvor Talk 에 대한 의견 추가
당신은 embedding comments을 통해 정적 사이트를 더욱 매력적으로 만들 수 있습니다.
Hyvor Talk is a privacy-focused commenting platform, which you can use to easily embed comments. We will handle everything from real-time comments to email notifications for your users.
landscape 주제 중 layout/_partial/article.ejs).그리고 코드를 거기에 붙여 넣으세요 (</article> 표시 후).
Hyvor Talk의 반응과 댓글.
(일반적으로 주석은
post 레이아웃에 추가됩니다. 따라서 설치 코드를 배치하기 위해 layout/post.[ext] 파일을 검색합니다.)당신의 브랜드에 맞게 평론 부분의 색을 변경할 수 있습니다.Hyvor Talk에 대한 자세한 내용은 homepage을 참조하십시오.
Netlify에 Hexo 블로그 배포
Jekyll과 비교하면 deploying Hexo to Github Pages은 복잡하다.따라서 Github와 Netlify를 사용할 것입니다.
1단계: Github로 Push
Netlify에 코드를 구축해 달라고 요청하기 전에 Github로 코드를 전송해야 합니다.
git add .
git commit -m "first commit"
git remote add origin https://github.com/[username]/[reponame].git
git push origin master
2단계: Netlify 설정
Netlify가 Github 저장소에 접근할 수 있도록 권한을 부여한 후, 사이트를 구축하기 위해 정확한 저장소를 선택하십시오.그런 다음 기본 설정을 계속합니다.
사이트 배포를 클릭합니다.몇 초 후, 넷lify는 당신의 사이트를 설립하여 공개할 것입니다.
Netlify의 실시간 사이트
결론
만약 당신이 2021년에 블로그를 만들고 싶다면, Hexo는 간단한 선택이 될 것이다.너는 많은 주제를 선택할 수 있다.너는 심지어 을 쉽게 찾을 수 있다.Hexo 그리고 create your own theme, 당신의 생활을 더욱 가볍게 할 수 있습니다.예를 들어, some plugins 플러그인을 현지화할 수 있습니다.본 논문에서, 우리는 Hexo 블로그를 Netlify에 배치할 것이다.Github 페이지, Gitlab 페이지, 또는 서버에 배치할 수도 있습니다.
테마/플러그인을 개발하려면 hexo-i18n을 보십시오.나는 이 안내서가 네가 너의 Hexo 블로그를 시작하는 데 도움을 줄 수 있기를 바란다.질문이 있으시면 언제든지 아래에 의견을 달아 주십시오.
Reference
이 문제에 관하여(2021년 Hexo, Netlify와 함께 정적 블로그 만들기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/hyvortalk/start-a-static-blog-in-2021-with-hexo-and-netlify-207p텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
