GitHub+Hexo+NexT 블로그 구축

4713 단어
앞에서 말한 바와 같이 본고는GitHub을 바탕으로 Hexo의 개인 블로그를 구축하는데 Next 주제를 사용했다. 제가 블로그를 구축하는 과정에서 많은 어려움을 겪었기 때문에 이틀이 걸려서 해결했기 때문에 저는 기존의 강좌와 제 경험과 교훈을 통합하여 블로그가 구축한 과정을 최대한 상세하게 공유하겠습니다.
1. 환경 구성
환경 설정은 주로 GitHub 창고 만들기,git 설치,node 설치를 포함한다.js
GitHub 웨어하우스 만들기, GitHub Pages 만들기
Github에 대해: GitHub는 원격 창고이고 협업 지역사회입니다. 더 중요한 것은 무료입니다!
  • 은 우선GitHub 계정을 만들어야 합니다. 계정 이름이 david라고 가정하면 다음 설명에 쉽습니다.GitHub 메일박스도 검증을 거쳐야 합니다.
  • 을 누르고 GitHub 창고를 만듭니다. GitHub 인터페이스 오른쪽 상단에 있는 +를 누르고 New repository을 누르면 창고를 만듭니다. ***Repository name은 반드시'GitHub 계정.github.io'의 형식이어야 합니다. 여기는 david.github.io입니다. GitHub가 이렇게 명명해야 인터넷 사이트의 위탁 창고가 될 수 있다고 규정했기 때문입니다.
  • 에 도착하면 블로그 사이트는 자신만의 따뜻한 항구를 가지게 됩니다.

    • 설치 Git
    Git: Git는 소스 기반의 분포식 버전 제어 시스템으로 각종 유형의 프로젝트 버전 관리를 효과적이고 신속하게 처리할 수 있다.다중 분포식 개발에 적합한 오프라인 작업도 지원한다.
  • 에서 Git를 어떻게 다운로드, 설치, 사용하는지에 대해 류설봉 선생님은 그의 Git 강좌에서 상세하게 말씀하셨습니다. 저도 여기서 배웠고 Pro Git의 전자판도 추천합니다.
  • 여기까지만 Git가 설치되어 있음 기본 설정 ~
    • Node를 설치합니다.js
    Node에 관하여.js: Node.js는 Chrome JavaScript가 실행될 때 만들어진 플랫폼으로 응답 속도가 빠르고 확장이 쉬운 네트워크 응용을 편리하게 구축하는 데 사용된다.
  • Node로 가세요.js 홈페이지
  • 설치는 기본값을 유지하고 1방향next로
    • 여기까지, 환경 배치 과정이 이미 완성되었다.
    2. Hexo 설치 및 웹 사이트 배포
    Hexo에 대해서:
  • A fast, simple & powerful blog framework, powered by Node.js
  • Blazing fast generating
  • Support for GitHub Flavored Markdown and most Octopress plugins
  • One-command deploy to GitHub Pages, Heroku, etc.
  • Powerful plugin system


    • Hexo 블로그 프레임워크 초기화
  • Hexo를 설치한 것은 우리가 이전에 준비한 작업,Git와 Node 덕분이다.js는 모두 설정되어 있으며 Hexo를 직접 다운로드할 수 있습니다.Git Bash에 다음 코드 입력 $npm install -g hexo-cli
  • 초기화 디스크 (예: C:) 를 선택하여 블로그 본체 저장 폴더 (예: 블로그:) 를 만듭니다. 이 폴더 공백에서 Git Bash Here (또는 $ cd C:\blog) 를 우클릭하고 블로그 폴더에 들어가서 git 작업을 하십시오. 다음: $hexo init $npm install
  • 설정 사이트는 로컬 파일과GitHub의 Repository 간의 연결을 구축하고Notepad++를 사용하여 C:\blog\_config.yml 파일을 열고 파일의 맨 밑에 있는 deploy로 끌어당겨 다음과 같이 설정합니다. deploy: type: git repository:https://github.com/david/david.github.io.gitbranch:master 중 두 가지를 주의해야 한다. 첫째, repository:과 branch:은 모두 스스로 추가해야 한다.둘째, Hexo의 모든 프로필 중 : 뒤에 빈칸을 추가해야만 글을 쓸 수 있습니다. 그렇지 않으면 ERROR Deployer not found : git 오류가 발생합니다!
  • 은 첫 번째 블로그 제목을'My First Blog'로 썼습니다. 코드: $hexo new'My First Blog'에서 C:\blog\source\_post에 My First Blog.md 파일이 나타났습니다. 이 _post이 바로 블로그를 저장하는 폴더입니다.
  • 여기 글쓰기 블로그는 Markdown을 사용하는 것을 권장합니다. 글쓰기 도구는 (강렬한 권장: 온라인 미리보기 모드 지원) 또는 Sublime Text 2를 사용할 수 있습니다. Markdown은 경량급 표기 언어로 문법이 매우 간단합니다. Markdown-입문 안내서를 참고하여 학습할 수 있습니다. 5분만 있으면 됩니다.
  • 정적 페이지 생성 $hexo generate (또는 $hexo g) 이때 My First Blog.md 은 C:\blog\source\public 폴더에 블로그 사이트의 정적 파일을 생성했습니다.
  • 로컬 서버 시작 $hexo 서버 (또는 $hexos로 약칭) 브라우저로 접근http://localhost:4000/, 이때, 당신은 랜드스케이트의 블로그를 보게 될 것이다. (정말 직시할 수 없다.)다음에는 NexT
    • 의 세련된 주제를 소개합니다.
    GitHub에 로컬 웹 사이트 배포
      $ hexo deploy  (     $ hexo d)

    이때 두 개의 인터페이스가 선후로 나타나 가입 GitHub 계정과 비밀번호를 입력한다.
  • 이 사이트 위의 모든 절차를 방문한 후에 블로그는 이미 구축되어 GitHub에 발표되었다. 브라우저에 david.github.io을 입력하고 방문하면 당신의 블로그를 볼 수 있다.

    • 요약:
    환경이 설정된 후에 우리는 매번 블로그를 발표하는 과정은 다음과 같다.
  • Markdown 블로그를 편집해서 C:\blog\source\_post 폴더
  • $ hexo g 정적 페이지 생성
  • $ hexo s에서 로컬 서버를http://localhost:4000/미리보기
  • $ hexo d 배포 웹 사이트 - Github
  • 웹 사이트 방문
    • 3. NexT 주제 변경
    넥스트:넥스트는 유행하는 Hexo 주제로 개발자가 부여한 취지는 간결하고 우아하며 사용하기 쉽다는 것이기 때문에 우선넥스트의 간결하고 사용하기 쉽다는 것을 확보해야 한다.
    주의해야 할 것은 프로필 _config.yml은 사실 C:\blog과 C:\blog\source\themes 디렉터리에 두 개가 있는데 전자는 이고 후자는 이다.
  • 다운로드NexT Hexo의 기본 테마는landscape입니다.사실 Hexo는 우리가 다운로드해서 사용할 수 있도록 풍부한 색채의 주제를 제공했다.여기서 나는 NexT를 사용하는데 안정적인 버전을 다운로드하면 다음과 같이 조작할 수 있다.
  • Hexo 버전 발표 페이지
    • 으로 이동
  • 필요한 버전을 선택하고 Download 영역의 Source Code(zip)를 로컬로 다운로드하십시오.예를 들어, v0을 다운로드합니다.4.0 버전
  • 그리고 코피는 C:\blog\source\themes으로 압축을 풀었다.폴더를 next으로 변경하여 조작을 편리하게 하는 것을 권장합니다.
  • NexT를 사용하여 을 열고 theme 필드를 찾으면 기본 landscape에서 next으로 변경됩니다. ":"이후 공백에 주의하세요!
  • NexT $hexos 확인 후 브라우저에서 액세스http://localhost:4000, 사이트가 올바르게 작동하는지 확인합니다.
  • 개성화된 NexT의 주제에 대한 개성화된 설정은 편집 을 통해 완성되었다.구체적인 구성 방법은 NexT 홈페이지에서 이미 상세히 설명되어 군말하지 않는다.

    • OK~ 이로써 우리의 블로그는 기본적인 구축이 완성된 셈이다. 앞으로 사용하면서 공부할 수 있고 일부 고급 개성화와 제3자 서비스는 이 과정에서 서서히 최적화될 수 있다.
    FastJson 사용 중 발생한 문제 및 해결 방법
    중국 도시 코드 json, 성, 시 2급 연동 json

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage