728x90
반응형

Markdown (MD) 문서란? 

 

마크다운 (Markdown)은 마크업 언어의 일종으로 확장자는 .MD 를 사용 한다.

GitHub나 GitLab 에서 README.md 파일 로 문서나 소스를 설명 하는 자료를 작성할때 주로 사용 한다. 

해당 글에서는 gitlab 에서 주로 사용 하는 Markdown 문법에 대해 소개 한다. 

 

Gitlab Markdown (MD) 생성 

테스트 용도로 gitlab 에서  Readme.md 파일을 생성 한다. 

Readme.md 파일명으로 작성을 하면 해당 디렉텍토리에서 자동으로 문서를 로딩 해서 화면에 출력한다. 

test.md, readme.md 파일이 동일 경로에 있더라고 readme.md 파일을 화면에 보여준다. 

 

  • 출력 확인 

  • 문서편집

gitlab 에서는 작성한 MD 문서는 Open in Web IDE 매뉴를 통해 문서를 웹상에서 편집을 할수 있습니다. 

Open in Web IDE -> Readme.md 파일 클릭 

우측 화면에서 Edit 탭 매뉴에서 문서를 작성 할수 있으며 Preview Markdown 탭 매뉴에서는 중간중간 수정한 내용을 미리 보기 기능통해 변경된 사항을 확인 해볼 수 있습니다. 

 

Gitlab Markdown 문법

Markdown 문법을 테스트 하고 확인 할 readme.md 파일로 내용을 작성 하겠습니다. 

 

List Item(리스트)

숫자와 문자를 통해 아이템을 리스트화 할수 있습니다. 

순서가가 필요한 리스트는 숫자로 표현하고 , 순서 지정이 필요없다면 (*,+,-) 기로호 아이템 리스트를 정의 할수 있습니다. 

1. First ordered list item
1. Second List
2. Another item
   - Unordered sub-list.
3. Actual numbers don't matter, just that it's a number
   1. Ordered sub-list
   1. Next ordered sub-list item
- And another item.
  * Unordered sub-list.
    - Unordered sub-list.
     + Unordered sub-list.

 

XML텍스트 삽입

```xml   

~~~~ -> xml 코드 작성 

```

XML 코드 삽입 예제 입니다. 
```xml

<?xml version="1.0" encoding="UTF-8"?>
<InvitationList>
<family>
       <aunt>
       <name>Christine</name>
        <name>Stephanie</name>
       </aunt>
</family>
</InvitationList>
<InvitationList>
</targetset>
```

표(table) 작성 예제

| (파이프) 기호를 통해 컬럼을 구분 하고 header 와 본문은 |---| 로 구분 합니다. 

열 정렬은 : 기로호 구분합니다. 

  • 왼쪽 정렬 :---
  • 가운데 정렬 :---:
  • 오른쪽 정렬 ---:
| 컬럼1 | 컬럼2 | 컬럼3 |
|---|:---:|:---|
|내용 1|내용 2|내용 3|
|내용 4|내용 5|내용 6|

글자 크기 

# 기호를 통해 글자 크기를 조정 할수 있습니다. 

# 기호가 많을 수록 글자 크기는 작아 집니다. 

H2 크기 까지는 밑줄이 표시 되네요 

# 글자크기 H1
## 글자크기 H2
### 글자크기 H3
#### 글자크기 H4
##### 글자크기 H5
###### 글자크기 H6

글자강조

>  글자 강조

***글자 강조***

~취소선 글자 강조~

이미지 삽입

![image](이미지경로) 태그를 사용해 이미지를 삽입할수 있습니다. 
 
![image](./images/dog.png)

코드블럭

위 xml 코드 삽입 방법도 있지만 <pre><code> ~~~ </code> </pre> 문법을 사용해 코드 블럭을 삽입할수 있습니다. 

  • <pre><code> ~~~ </code> </pre> 
  • ```  ~~~  ```
  • ``` [program language] ```  -> 프로그램 문법 강조 

두가지 사용법은 동일합니다. 

 

<pre>
<code>
public class JavaSampleCode {
public static void main(String[] args) {
System.out.println("hello Java word");
}

</code>
</pre>

```
public class JavaSampleCode {
public static void main(String[] args) {
System.out.println("hello Java word");
}
}
```

```java
public class JavaSampleCode {
public static void main(String[] args) {
System.out.println("hello Java word");
}
}
```
 

Details and summary

  • 접기 /펼치기 기능을 이용한 내용 요약 및 해당 내용에대한 상세 설명을 작성할때 사용합니다. 
<p>
<details>
<summary> 요약 내용 입니다.  </summary>

디테일 본문에 대한 본문에 <strong>간략한 설명</strong> 을 작성합니다.

<pre><code> 해당 부분에 상세 내용을 작성하세요 </code></pre>

</details>
</p>
728x90
반응형

+ Recent posts