tec / blog
1분 읽기 (나에 대하여 191 단어)

[Hexo와 깃허브로 블로그 만들기] 블로그에 layout 만들어 빠른 포스팅 하기

1. /scaffolds 파일 아래 blog.md 파일을 만든다.

원하는 형식으로 Front-Matter부분을 수정한다.

1
2
3
4
5
6
7
8
9
10
11
12

---
title: {{ title }}

categories:
   [tec, blog]
tags:
   [blog, tec, hexo, github]
   
toc: true
date: {{ date }}
---

2. 커멘드 창에서 (프로젝트 위치아래에서) 아래와 같이 명령어를 입력한다.

1
$ hexo new blog -p tec/blog/blog13 "레이아웃 만들기"
  • blog: 아까 scaffolders에서 만든 레이아웃 파일명
  • -p: 경로명
  • “레이아웃만들기”: title안에 들어갈 내용
    명령어 옵션 참고

3. /source/_posts/tec/blog/blog13.md 파일이 생성된 것을 확인 할 수있다.

1
2
3
4
5
6
7
8
9
10

---
title: "레이아웃 만들기"
categories:
   [tec, blog]
tags:
   [blog, tec, hexo, github, google-analytics]
toc: true 
date: 2019/10/18 13:09:23   
---

4. 해당 파일에 원하는 글을 써서 배포한다.

tec / blog
4분 읽기 (나에 대하여 617 단어)

[Markdown] Markdown 문법 정리

1. Header

글머리 1 ~ 6

1
2
3
4
5
6
# This is a H1
## This is a H2
### This is a H3
#### This is a H4
##### This is a H5
###### This is a H6

This is a H1

This is a H2

This is a H3

This is a H4

This is a H5
This is a H6

2. 굵게 기울임꼴 텍스트

2.1 굵게 지정하려면 두개의 별표로 묶습니다.

1
This text is **bold**.

This text is bold.

2.2 기울임꼴로 지정하려면 한개의 별표로 묶습니다.

1
This text is *italic*.

This text is italic.

2.3 굵게 기울임꼴로 지정하려면 세개의 별표로 묶습니다.

1
This text is ***bold and italic***.

This text is bold and italic.

3. BlockQuote

1
> This is a BlockQuote

This is a BlockQuote

This is a BlockQuote

This is a BlockQuote

이 안에서도 마크다운 요소를 사용할 수 있습니다.

> - List
> 
1
2
> BlockQuote
>
  • List
    1
    2
    > BlcokQuote
    >

4. List

4.1 순서 있는 목록

어떤 번호를 넣더라도 내림차순으로 숫자가 지정됩니다.

1
2
3
1. 첫번쨰
3. 두번째
2. 세번째

  1. 첫번째
  2. 두번째
  3. 세번째



다른 목록 안에 목록을 중첩하려면 항목을 들여씁니다.

1
2
3
4
1. 첫번쨰
    1. 두번째
    1. 세번째
1. 네번째
  1. 첫번째
    1. 두번째
    2. 세번째
  2. 네번쨰

4.2 순서 없는 목록

1
2
3
4
5
6
7
8
9
10
11
* 빨강
  * 녹색
    * 파랑

+ 빨강
  + 녹색
    + 파랑

- 빨강
  - 녹색
    - 파랑
  • 빨강
    • 녹색
      • 파랑
  • 빨강
    • 녹색
      • 파랑
  • 빨강
    • 녹색
      • 파랑

5. Table

파이프(|) 및 하이픈(-)을 이용하여 테이블을 만들 수 있습니다.
하이픈으로는 헤더를 만들며 파이프로는 각 열을 만듭니다.
하이픈으로 헤더 구분시 좌측에 콜론(:)을 삽입 할 경우 좌측정렬 우측에 삽입 할 경우 우측정렬이 되며 양쪽에 둘 경우 가운데 정렬이 됩니다.

1
2
3
4
5
6
| Fun                  | With                 | Tables          |
| :------------------- | -------------------: |:---------------:|
| left-aligned column  | right-aligned column | centered column |
| $100                 | $100                 | $100            |
| $10                  | $10                  | $10             |
| $1                   | $1                   | $1              |
Fun With Tables
left-aligned column right-aligned column centered column
$100 $100 $100
$10 $10 $10
$1 $1 $1

6. 링크

6.1. 참조 링크

syntax:

[id]: Link
[title][id]

1
2
3
4
5
6
[hscodev]: hsco.dev
[github]: https://github.com/hscodev

[블로그][hscodev]

[깃허브][github]

블로그

깃허브

6.2. 인라인 링크

syntax:

[Label](Link)

1
[블로그](https://hsco.dev)

블로그

6.3. 자동연결

syntax:

\

1
<https://hsco.dev>

https://hsco.dev

7. 코드

개발 코드를 코드블록으로 배치 할 수 있습니다.
alias 별칭을 이용하여 구문 강조가 가능합니다.

이름 Alias
java java
json json
javascript javascript
html html
markdown md
SQL sql
등 
1
your code goes in here

8. 이미지

1
2
![Alt text](/assets/images/duck.jpg)
![Alt text](/assets/images/duck.jpg "별그림")

Alt text
Alt text

tec / blog
1분 읽기 (나에 대하여 152 단어)

[Hexo와 깃허브로 블로그 만들기] 블로그에 Google Analytics 설치하기

1. 구글 애널리틱스 사이트에 계정만들기

google analytics 회원가입 하러가기

2. GA홈에서 관리할 사이트 계정을 추가한다.

  1. 관리 클릭

  2. 계정만들기 클릭

  3. 정보 넣고 추적ID가져오기 클릭

  1. 추적 아이디 값 복사하기

3. /blog/themes/icarus/_config.yml 파일 수정

1
2
3
plugins:
    google-analytics:
        tracking_id: XXXXXX (required)

4. 사용자 분석

구글 애널리틱스 사용자 분석하러 가기

tec / blog
몇 초 읽기 (나에 대하여 90 단어)

[Hexo와 깃허브로 블로그 만들기] disque로 댓글 기능 활성화 하기

1. disque 회원가입

disque 회원가입 하러가기

2. UserName변경

Account에서 Username을 변경한다.(disque에서 유일해야함.)

3. /blog/themes/icarus/_config.yml 파일 수정

1
2
3
comment:
    type: disqus
    shortname: xxxxxxxx

4. post.md 파일 Front-Matter부분 수정

1
2
3
4
# (optional) a unique id to identify the post in Disqus system
disqusId: xxxxxxxx
---
Post content...
tec / blog
1분 읽기 (나에 대하여 203 단어)

[Hexo와 깃허브로 블로그 만들기] Hexo 블로그 포스트 쓰기

1. ~/blog/source/_posts/ 아래에 postname.md 파일 만들기.

파일을 만든 후 아래 내용을 입력한다. 

1
2
3
4
5
6
7
8
9
10
11

---
title: "[Hexo와 깃허브로 블로그 만들기] Hexo 블로그 포스트 쓰기"
categories:
   [test]
tags:
   [test]

---

## Hello World!

2. jekyll 포스트 hexo로 옮기기

jekyll migratorn 참고 링크

  1. 지킬 프로젝트에서 _posts/하위 폴더 다 복사 후 hexo 프로젝트 /source/_posts/에다 붙여넣기.
  2. 포스트 제목을 2019-01-01-name.md의 형식을 name.md로 변경.
  3. 포스트 내용의 Front-matter 부분을 알맞게 수정
  4. 포스트안에 이미지나 다른 첨부 내용이 있다면 같이 옮겨줌.
    • 지킬의 /assests/images/ 폴더를 hexo의 blog/source/assets/images 로복사해줌
  5. 이미지 첨부가 맞지 않을 경우 hexo 서버가 에러가 남.
tec / blog
1분 읽기 (나에 대하여 126 단어)

[Hexo와 깃허브로 블로그 만들기] Hexo 테마 적용

1. Hexo 테마 고르기

Hexo 이쁜 테마 고르러 가기

2. icarus 테마 적용하기

블로그 프로젝트 경로($ cd ~/blog/) 아래 blog/themes/icarus 폴더를 만들어 git 테마를 clone한다. 

1
$ git clone https://github.com/ppoffice/hexo-theme-icarus.git themes/icarus

3. ~/blog/themes/icarus/_config.yml 파일에서 theme 설정을 icarus로 변경한다.

1
theme: icarus

4. hexo 서버 재시작 한다.

1
$ hexo s

localhost:4000에서 적용된 테마를 확인한다.

5. github에 배포한다.

1
2
$ hexo clean
$ hexo d -g
tec / blog
2분 읽기 (나에 대하여 237 단어)

[Hexo와 깃허브로 블로그 만들기] jykell에서 hexo로 블로그 이전하기

hexo테마가 이쁜게 많아서 바꾸기로 함.

1. Node.js설치

nodejs 설치하러 가기

2. Git 설치

git 설치하러 가기

3. Hexo 설치

hexo 설치하러 가기

1
$ npm install -g hexo-cli

4. 블로그 시작하기

git bash쉘에서 블로그 프로젝트를 구성할 디렉터리 위치에 가서 아래와 같이 실행한다.

1
2
3
$ hexo init blog
$ cd blog
$ hexo server

hexo server가 http://localhost:4000 으로 실행됨.

5. blog/_config.yml 파일 수정하기

1
2
3
4
5
6
7

url: http://yoursite.com 

deploy: 
  type: git
  repo: https://github.com/crlo2/crlo2.github.io.git
  branch: master

deploy 항목을 저렇게 수정하면 hexo가 명령어로 자동 배포 및 생성을 해준다.

6. hexo deployer 설치

1
$ npm install hexo-deployer-git --save

7. hexo 생성 및 git 레포지토리에 배포

1
2
$ hexo clean
$ hexo d -g

이렇게 배포를 해줘야만 https://clro2.github.io 주소로 접속하면 블로그 화면이 보인다.

tec / blog
몇 초 읽기 (나에 대하여 24 단어)

[JEKYLL과 깃허브로 블로그 만들기] 검색 메뉴(Search)만들기

1. /_config.yml 파일 수정하기

1
search: true

위의 내용 추가

2. 완성

캡쳐

tec / blog
몇 초 읽기 (나에 대하여 36 단어)

[JEKYLL과 깃허브로 블로그 만들기] 네비게이션 메뉴 (Navigation)만들기

1. /_data/navigation.yml 파일 만들기

1
2
3
4
5
6
7
main:
  - title: "TECHNOLOGY"
    url: /tec/
  - title: "WORLD-TRIP"
    url: /trip/
  - title: "OTHERS"
    url: /posts/

위의 내용 추가

2. 완성

캡쳐

tec / blog
2분 읽기 (나에 대하여 259 단어)

[JEKYLL과 깃허브로 블로그 만들기] 콜렉션(Collection)만들기

1. /_config.yml파일 수정하기

1
2
3
4
collections:
  trip:
    output: true
    permalink: /:collection/:path/

위의 내용 추가

1
2
3
4
5
6
7
8
9
10
11

defaults:
  # _trip
  - scope:
      path: ""
      type: trip
    values:
      layout: single
      author_profile: false
      share: true
      related: true

위의 내용 추가

2. _pages/trip-archive.md 파일 만들기

1
2
3
4
5
6
7
8
9
10

---
title: 여행
layout: collection
permalink: /trip/
collection: trip
entries_layout: grid
classes: wide

---

3._/trip/post1.md 파일 만들기

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

itle: "Trip1"
excerpt: "첫번째 여행글 입니다.."
header:
  image: /assets/images/별그림.png
  #teaser: assets/images/unsplash-gallery-image-1-th.jpg
sidebar:
  - title: "Role"
    image: /assets/images/별그림.png
    image_alt: "logo"
    text: "Designer, Front-End Developer"
  - title: "Responsibilities"
    text: "Reuters try PR stupid commenters should isn't a business model"
gallery:
  - url: /assets/images/별그림.png
    image_path: /assets/images/별그림.png
    alt: "placeholder image 1"
  - url: /assets/images/unsplash-gallery-image-2.jpg
    image_path: /assets/images/별그림.png
    alt: "placeholder image 2"
  - url: /assets/images/unsplash-gallery-image-3.jpg
    image_path: /assets/images/별그림.png
    alt: "placeholder image 3"
categories: [아시아, 한국, korea]
tags: [hot, summer]

---

이사진은 별그림 입니다
{% include gallery caption="This is a sample gallery to go along with this case study." %}

이건 마지막 글입니다.
ude gallery caption="This is a sample gallery to go along with this case study." %}

4. 완성

참고:https://jekyllrb-ko.github.io/docs/collections/

팔로우

카테고리

아카이브

태그 클라우드

Markdown alogrithm blog disque framework github google-analytics hexo java java의 정석 jekyll network noip react spirng boot spring sql tec websocket 골든서클 공유기 눈 도메인 리엑트 마크다운 무지개 미국 빙하 소켓통신 숙소 시간복잡도 아이슬란드 알고리즘 여행 옐로우스톤 오로라 유럽 자료구조 재귀함수 정렬 폭포 프레임워크 해변

카테고리

아카이브

태그 클라우드

Markdown alogrithm blog disque framework github google-analytics hexo java java의 정석 jekyll network noip react spirng boot spring sql tec websocket 골든서클 공유기 눈 도메인 리엑트 마크다운 무지개 미국 빙하 소켓통신 숙소 시간복잡도 아이슬란드 알고리즘 여행 옐로우스톤 오로라 유럽 자료구조 재귀함수 정렬 폭포 프레임워크 해변
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×