Velog 사용법

모리스·2022년 5월 10일
11
post-thumbnail

Velog?

벨로그(Velog)는 개발자 velopert가 1인 개발한 개발자를 위한 블로그 서비스 플렛폼이다.

  • 장점
  1. 개발자 생태계 활성
  2. 깔끔한 디자인
  3. markdown을 통한 편집 가능
  • 단점
  1. 구독 기능 없음
  2. 통계 기능 부실
  3. 광고 게제 불가능

*나무위키


Markdown?

마크다운(Markdown)은 일반 텍스트 기반의 경량 마크업 언어이다. 일반 텍스트로 서식이 있는 문서를 작성하는 데 사용되며, 일반 마크업 언어에 비해 문법이 쉽고 간단한 것이 특징이다. HTML과 리치 택스트(RTF) 등 서식 문서로 쉽게 변환되기 때문에 응용 소프트웨어와 함께 배포되는 README 파일이나 온라인 게시물 등에 많이 사용된다.

*위키백과


📖 Velog 문법

📌 제목

벨로그에서는 제목을 통해 목차를 알아서 생성해준다.
h1 부터 h6 로 제목을 작성할 수 있다.
* h1, h6 처럼 회색 박스를 감싼 부분을 인코드라인 이라하는데, 이는 백틱 (`)으로 감싸서 작성한다.

입력

# h1
## h2
### h3
#### h4
##### h5
###### h6

📌 코드블럭

한줄짜리 코드블럭은 Tab을 사용하여 작성한다.
Tab 이후에 입력한 텍스트
여러줄의 코드블럭은 벡틱(`) 3개를 감싸서 작성한다.

여러줄의 코드블럭
여러줄의 코드블럭
여러줄의 코드블럭

코드블럭을 이용해서 특정 언어의 코드를 작성할 수 있다.
3개의 벡틱(`)바로 뒤에 언어 이름을 넣는다.

입력

```javascript
let sumNumbers = (firstNum, lastNum) => {
  return firstNum + lastNum;
};
sumNumbers(100, 200);

🖨 출력

let sumNumbers = (firstNum, lastNum) => {
  return firstNum + lastNum;
};
sumNumbers(100, 200);

📌 인용

>를 이용하여 인용문을 작성할 수 있다. 한번만 사용할 수도 있고, 여러개로 중첩하여 사용할 수도 있다.

입력

> # 1단
인용문 첫 번째 줄
인용문 두 번째 줄
인용문 세 번째 줄
>> ## 2단
중복해서 사용하면
>>> ### 3단
중첩 인용문을 표현할 수 있다
계속 중첩할 수 있다

참고: 인용문 안에서 제목 수준을 표현할 수도 있다.

🖨 출력

1단

인용문 첫 번째 줄
인용문 두 번째 줄
인용문 세 번째 줄

2단

중첩 인용문을 작성할 수 있다.

3단

계속해서 중첩할 수 있다.


📌 리스트

순서가 없는 리스트는 *, +, - 를 사용하여 작성할 수 있다.

입력

* 별
+ 플러스
- 마이너스

🖨 출력

  • 플러스
  • 마이너스

순서가 있는 리스트의 경우 숫자. 로 작성할 수 있다.

입력

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

🖨 출력
1. 첫 번째
2. 두 번째
3. 세 번째


📌 리스트

굵게, 기울이기, 취소선 등 기본적인 스타일을 작성할 수 있다.

입력

__굵게__
**굵게**
_기울이기_
*기울이기*
~취소선~
~~취소선~~

🖨 출력
굵게
굵게
기울이기
기울이기
취소선


📌 수평선

마크다운에서 수평선(구분선) 을 작성할 수 있다.

입력

* * *
***
*****
- - -
---
-----
_ _ _
___
_____

🖨 출력











📌 링크 삽입

3가지 방법으로 링크를 나타낼 수 있다.
1. 인라인 링크
2. URL 링크
3. 참조 링크

입력

인라인 링크
[인라인 링크](https://velog.io/@cm961115)

url 링크
<https://velog.io/@cm961115>

참조 링크
[cm_an/velog]:https://velog.io/@cm961115

[velog]

🖨 출력
인라인 링크

https://velog.io/@cm961115

velog/cm_an


📌 이미지 삽입

링크 삽입 방식과 유사하나, 맨 앞에 !를 붙힌다.
입력

![이미지 설명](이미지 링크)

*이미지에 링크를 추가

[![이미지 설명](이미지 링크)](연결하고자하는 url "마우스 오버 시 나타낼 링크 title")

Velog를 처음 시작하며 참고한 사이트
https://velog.io/@yuuuye/velog-마크다운MarkDown-작성법
https://velog.io/@yeseolee/Velog-사용법-정리

profile
모바일 앱 개발 노트 :)

0개의 댓글