일단 시작, 0. markdown 문법

박상준·2023년 10월 28일
post-thumbnail

"시작에 앞서..."

지금까지 해오던 것들과 전혀 상관 없는 일을 시작하고자 한다.
여러가지 이유가 존재하지만 가장 큰 이유는 이렇게 평생 살순 없다는 생각때문이다. 새로운 것을 배움에 있어서 가장 중요한 문장은 '시작이 반이다' 라는 문장이다. 일단 시작해 보는 것이다! 되든 말든 출발하면 제자리보단 앞에 있을 수 있다.
이미 공부시작한지 몇개월 되긴했지만 지금이라도 기록을 남겨보고자 한다.

1. velog를 선택한 이유

요즘 친구들이 블로그를 많이 쓰는데 굳이 이 플랫폼을 사용하게 된 이유를 간략하게 적어보자면

  1. 내가 읽던 남이 읽던 가독성이 좋다.
  2. 개인적으론 개발 일지를 적기에 최적의 플렛폼이라 생각한다 (naver, tistory)

구글링을 하면서 velog의 포스팅을 참고를 많이 했던것 같다. 물론 영어 원문이나 공식 문서를 보면 더 좋겠지만 코린이에겐 한국어가 편하다. 지금 몇줄 안적었지만 오른쪽의 preview를 보니깐 나도 코딩공부하는 사람처럼 느껴진다.

첫 포스트인만큼 간략하게 Markdown에 대해서 요약할 생각이다.

2. Markdown

text를 HTML로 변환하는 언어이자 도구

HTML같은 다른 마크업 언어를 몰라도 텍스트 서식을 빠르게 지정할 수가 있다. tag를 붙여 서식을 하는 마크업과 달리 특수기호를 사용해 텍스트 형태로 서식을 지정할 수 있다.
반면에 표준이 없어 에디터에 따라 다른 결과물을 보여준다는 단점이 있다.

markup을 쓰는건 이번이 처음이라 아직 어색하지만 좀만 직접해보면 금방 손에 익을 것 같다.
솔직히 어떻게 쓰는지 몰라도 감으로 할 수 있을 정도이다

자주 사용하게 될 Markup 문법을 정리해보겠다.

2.1 Header

큰제목: 문서 제목
문서 제목입니다.
==

  • 문서 제목입니다.

작은 제목: 문서 부제목
문서 부제목입니다.
--

  • 문서 부제목입니다.

글머리: 1~6까지 지원

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

  • h2

  • h3

  • h4

  • h5
  • h6

2.2 줄바꿈

-를 3개 이상 입력하면 아래처럼 실선이 추가된다.
또한 <br>태그를 사용하면 줄바꿈이 된다.

---
123<br>456
---

123
456


2.3 Block quote와 list

텍스트 블럭을 이용해 내용을 구분하거나 눈에 띄게 만드는 용도이다.
>를 이용해 블럭을 생성하며 중첩해서 사용할수 있다.

내용

내용

내용

-,+,*,'number'. 을 이용하여 리스트를 구성할 수 있다.

- 1
- 2
- 3
---
+ 1
+ 2
+ 3
---
1. 1
	2. 2
		3. 3
  • 1
  • 2
  • 3

  • 1
  • 2
  • 3

  1. 1
    1. 2
      1. 3

2.4 글자 모양

글자를 강조할 때 사용하는 문법이다. Italic, Blod, Blod Italic ,Strikethrough를 지원한다. *~~를 붙여 사용한다.

*Italic*
**Bold**
***Bold Italic***
~~Strikethrough~~

Italic
Bold
Bold Italic
Strikethrough

2.5 이미지 및 링크

이미지는 ![image descripion](주소)를 입력하면 되지만 이미지 파일을 드레그하면 자동으로 입력이 된다.
링크는 [description](주소)를 통해 해당 링크로 이동 가능하다.

헤어질 결심

Link 깃허브 링크

![](https://velog.velcdn.com/images/sj0724/post/ec3f1995-66de-4af3-9606-9137af27e02c/image.png)
Link [깃허브 링크](https://github.com/sj0724)

2.6 Table, 표

| , --, : 를 사용하여 표를 작성할 수 있다.
|를 사용하여 첫번째 줄을 작성한 후 두번째 줄에 --를 추가하면 자동으로 표 형식이 작성된다. : 를 사용해 좌,우,중간 정렬 시킬수가 있다.

|1|2|3|
|:--|:--:|--:|
|0|0|0|
|0|0|0
123
000
000

2.7 code삽입

backtick을 사용해 코드를 효과적으로 보여줄 수 있다. backtick을 한개만 사용하면 음영처리가 되면서 코드를 보여줄수 있다.
console.log('hello')
console.log('hello')

여러 줄의 코드를 보여줄때는 backtick 3개를 이용하면 highlight효과를 주어 가독성을 높힐수가 있다.

const arr = [1,2,3,4,5];

if(arr.length === 5){
  console.log('hello')
};
```javascript
const arr = [1,2,3,4,5];
if(arr.length === 5){
console.log('hello')
};
```

3. 글을 마치며,,,

블로그 글도 잘 안쓰는데 처음 markdown을 사용해 글을 쓰는건 너무 어렵다. 물론 처음이니까 당연하다. 왜 이걸 이제야 시작했을까하는 후회가 앞선다. 코딩을 혼자 공부한지 어느덧 3개월이 넘어가는데 그동안 꾸준히 작성했다면 나름 많은 데이터가 싸여있을텐데...
이미 지나간 일에 더이상 여운을 두지 않겠다. 지금이라도 잘하면 되지. 앞으로의 계획은 새로운 것을 배우는 날도 있겠지만 지금까지 했던 프로젝트들을 리뷰하고 돌아보는 방식으로 포스트를 작성해보려 한다. 물론 어떤 글을 참고했고 어떻게 리팩토링을 진행했는지는 상세히 적지는 못하지만 다시한번 복기할수 있는 좋은 기회라고 생각한다.
단점은 극복하고 장점은 더욱 키우는 시간을 만들고자 한다. 부디 이 블로그를 통해 나를 보여주고 싶다.

profile
개인 블로그 플렛폼도 운영중입니다(https://blog-park.vercel.app/)

0개의 댓글