내 블로그는 완벽히 틀려먹었다.
이노베이션 캠프 워밍업을 시작하며 난생 처음으로 블로그를 썼다. 그리고 오늘 TIL특강을 통해 깨달았다. 내 블로그는 문제가 있다는 것을.😱
📌 TIL이란?
블로그의 용도는 바로 TIL(Today I Learned), 즉 내가 오늘 배운 것을 기록하는 스터디 일지이다. 잘 쓴 TIL은 개발자에게 스펙이 될 정도로, 불특정 다수에게 성실함, 지식, 성장과정을 어필할 수 있는 좋은 기록이 된다.
📌 올바른 TIL 작성하기
블로그의 용도는 바로 TIL(Today I Learned), 즉 내가 오늘 배운 것을 기록하는 스터디 일지이다. 잘못된 TIL의 특징은 다음과 같다.
- 반짝 예쁘게 꾸미기(frontend 개발자는 OK👍)
- 통째로 붙여놓은 코드 =>내가 한 방식!
- 감성적인 글 넣기
- 강의 노트 복붙 & 요약 (특색X)
그렇다면 올바른 TIL 작성법은 무엇일까?
- 어떤 문제를 겪었는지
- 어떤 시도를 했는지✔
- 어떻게 해결했는지
- 이런 과정에서 느낀점은 무엇인지 ✔
명확하게 표현해야 한다! 특히 내가 겪은 시행착오와 느낀점을 잘 표현하는게 내가 학습한 지식과 성장과정을 보여주기 좋다고 한다. 그런 의미에서 오늘은 벨로그를 잘 쓰기 위해 마크다운 기능들을 정리하고자 한다.
📌 velog 마크다운 기능
1. 제목(Header)
크기가 큰 순서대로 h1 부터 h6까지 글자크기 지정가능.
✍ 마크다운 작성
# h1
## h2
### h3
#### h4
##### h5
###### h6🖥️출력
h1
h2
h3
h4
h5
h6
2.문단 간격
문단간격은 줄 바꿈 으로 나타내며 빈 줄 한 칸을 만들거나, 엔터를 2번 누르거나, 여러 번 줄 바꿈 시 <br/>를 사용한다.
✍ 마크다운 작성
첫번째 문단<br/><br/>
두번째 문단
🖥️출력
첫번째 문단
두번째 문단
3. 인용문
- 인용문을 작성할 때는
>키를 이용한다. - 인용문은
>의 개수에 따라 중첩문으로 만들 수 있다.
✍ 마크다운 작성
> 인용문 작성하는 법
>인용문 작성하는법
>인용문은
>> `>`의 개수에 따라
>>> 중첩문으로 이용할 수 있음. 🖥️ 출력
인용문 작성하는법
인용문은
>의 개수에 따라중첩문으로 이용할 수 있음.
4.인라인 코드
- 단락 내에서 짧은 코드 조각(예: 함수 정의 또는 변수 이름)을 강조할 때 유용하게 사용
- 백틱(backtick)(`)을 사용하여 사용가능. 원하는 글자를 백틱 사이에 가두면 됨
- 인라인 코드가 된 코드는
회색상자에 갇힘.
5.코드 블록
- 코드 블록은 코드 예시를 보여주거나, 다른 개발자들과 코드를 공유하거나, 코드 스니펫 라이브러리를 유지관리하는 데 유용함. 다른 곳에서 사용하기 위한 코드를 모아두는 클립보드처럼 활용할 수도 있음.
- (```)혹은 (~~~)를 첫 줄과 마지막 줄에 삽입하고 그 사이에 글 작성.
6.목차
6.1 순서있는 목차
순서가 있는 목차는 숫자와 .을 사용함
✍ 마크다운 작성
1. 목차1
2. 목차2
3. 목차3🖥️ 출력
1.목차1
2.목차2
3.목차3
6.2 순서없는 목차
- 순서가 없는 목차는
-,+,*을 사용하여 글머리 표시 가능(종류와 상관없이 사용가능함)
-글머리 표시 원하면 위에서 언급한-등의 키를 누른 다음 엔터로 줄 바꾼 후 내용 입력하기 Tab이나스페이스바를 이용해 들여쓰기가 가능
✍ 마크다운 작성
-
순서없는 목록1:기호 상관없이
+
순서없는 목록2: 입력하면 사용 가능한데
*
세부목록: 들여쓰기를 이용해서 세부목록을 쓰기 원하면
-
세부목록2: `-` 입력 후 엔터 치고 내용 입력하고 `-` 앞에서 `스페이스바`로 띄워주면 입력가능
*
순서없는 목록3: 누르는 키 종류는 상관없이 `Tab`과 `스페이스바`가 중요함.🖥️ 출력
- 순서없는 목록1:기호 상관없이
- 순서없는 목록2: 입력하면 사용 가능한데
- 세부목록: 들여쓰기를 이용해서 세부목록을 쓰기 원하면
- 세부목록2:
-입력 후 엔터 치고 내용 입력하고-앞에서스페이스바로 띄워주면 입력가능
- 순서없는 목록3: 누르는 키 종류는 상관없이
Tab과스페이스바가 중요함.
7.폰트 스타일& 색깔
7.1 폰트 스타일 설정하기
✍ 마크다운 작성
__굵게__
**굵게**
_기울여 쓰기_
*기울여 쓰기*
~취소선~
~~취소선~~🖥️ 출력
굵게
기울여 쓰기
기울여 쓰기
~취소선~
취소선
7.2 폰트 색깔 설정하기
html 태그 이용하여 작성가능
✍ 마크다운 작성
-
<span style="color:red">red</span>
-
<span style="color:#d3d3d3">#d3d3d3</span>
-
<span style="color:rgb(245, 235, 13)">rgb(245, 235, 13)</span>
-
바꾸고 싶은 색깔이 있다면, <span style="color:red">원하는 글자</span>를 넣으면 됨.🖥️ 출력
- red
- #d3d3d3
- rgb(245, 235, 13)
- 바꾸고 싶은 색깔이 있다면, 원하는 글자를 넣으면 됨.
❓색깔과 글꼴을 같이 바꾸고 싶다면?
- 글꼴 마크다운 사이에 색깔 마크다운을 넣어 바꾸면 됨.
✍ 마크다운 작성
글자를 굵고 빨갛게 바꾸려면, **<span style="color:red">원하는 글자</span>**를 넣으면 됨.🖥️ 출력
글자를 굵고 빨갛게 바꾸려면, 원하는 글자를 넣으면 됨.
8. 이모티콘 넣기
<단축키>
window10: 윈도우 키 + 마침표(.)
mac: Command + Control + 스페이스 바
9. 링크
인라인 링크와 url 링크로 나타낼 수 있습니다.
인라인 링크는 아래처럼
✍ 마크다운 작성
[인라인 링크](https://velog.io/)
url 링크는 아래처럼
<https://velog.io/>🖥️ 출력
url 링크는 아래처럼
https://velog.io/
📌 velog 기능을 알아가며 느낀 점
네이버 블로그조차 제대로 다뤄보지 않았던 나에게는 velog는 매우 새로운 세계였다. 처음에 그저 개발자들이 자주 쓰는 블로그가 깃헙과 velog라는 말을 듣고 나는 호기롭게 깃헙을 먼저 도전해보았고 블로그 개설부터 막혀 velog를 만들었다. 사실 velog의 장점이라는 마크다운을 사용하는 플랫폼이라는 것이 나한테는 진입장벽 그 자체였다.
하지만 velog를 활용하려고 애쓴 시간자체는 나름대로 보람있었다고 생각한다. 이런 마크다운 기능들이 개발자에게 가장 친숙한 글쓰기 문법이라는데, 그렇다면 난 개발자들의 언어에 좀 더 익숙해진게 아닐까? 사실 이 글을 쓰다가 한 번 날려먹었을 때는 네이버블로그로 갈아탈까 싶었다. 하지만 이왕 시작했고 velog로 젊은 개발자가 많은 플랫폼이니 TIL을 잘 작성하면서 나도 다른 포스트를 보고 많이 배워가고 싶다.
📌 참고한 사이트
https://velog.io/@ybkim3603/
https://velog.io/@yuuuye/velog-마크다운MarkDown-작성법
https://velog.io/@jinuku/Velog-간단-사용법
https://velog.io/@yeseolee/Velog-사용법-정리
