1. Git 홈페이지 접속

https://git-scm.com/ 링크를 클릭하여 Git 홈페이지에 접속 한다다.

2. Download for Mac 클릭

페이지 접속 오른쪽 컴퓨터 화면에 보이는 Download for Mac 을 클릭 한다.

3. homebrew 클릭

파란색 글씨로 된 homebrew 를 클릭하면 페이지가 이동 된다.

4. 설치 명령어 복사

빨간색 화살표를 따라 📋 아이콘 을 클릭하면 설치 명령어가 복사 된다.

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

5. 터미널 열기

6. 터미널에 명령어 붙여넣기

git 홈페이지에서 복사해두었던 homebrew 설치 명령어를 붙여 넣는다. Password: 문구가 출력되면 맥 로그인 비밀번호를 입력한다. 설치가 시작 된다.

설치 완료 후 M1 코어를 사용자는 다음 명령어를 붙여넣는다.

eval $(/opt/homebrew/bin/brew shellenv)

Git 설치

1. 터미널에 명령어 입력하기

아래와 같은 명령어를 입력하여 git을 설치한다.

brew install git

설치가 완료되었다.

2. 설치 버전 확인하기

설치가 잘 됐는지 확인하기 위해서 아래와 같은 명령어를 입력 합니다.

git --version

앱 설명 : 선택 시작 누를 시 아래 선택박스가 뜸, 선택 후 선택완료 버튼 클릭시 애완동물 이미지 출력

코드

우선 사진 파일을 drawable 폴더에 붙여넣기 해놓는다. 확장자는 .png / .jpg 로 한다.

🐰 activity_main.xml 구성

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="20dp"
    tools:context=".MainActivity" >


    <TextView
        android:id="@+id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="선택을 시작하시겠습니까?"
        android:textSize="20sp"/>

    <CheckBox
        android:id="@+id/chkAgree"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="시작함"/>

    <TextView
        android:id="@+id/text2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="좋아하는 애완동물은?"
        android:textSize="20sp"
        android:visibility="invisible"/>

    <RadioGroup
        android:id="@+id/Rgroup1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="invisible">

        <RadioButton
            android:id="@+id/RdoDog"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="강아지" />

        <RadioButton
            android:id="@+id/RdoCat"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="고양이" />

        <RadioButton
            android:id="@+id/RdoRabbit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="토끼" />
    </RadioGroup>

    <Button
        android:id="@+id/BtnOK"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="선택완료"
        android:visibility="invisible"/>

    <ImageView
        android:id="@+id/ImgPet"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="invisible" />



</LinearLayout>

🐰 Mainctivity.kt 코틀린 코드

package com.example.petimageapp

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.*

class MainActivity : AppCompatActivity() {

    lateinit var text1 : TextView
    lateinit var text2 : TextView
    lateinit var chkAgree : CheckBox
    lateinit var rGroup1 : RadioGroup
    lateinit var rdoDog : RadioButton
    lateinit var rdoCat : RadioButton
    lateinit var rdoRabbit : RadioButton
    lateinit var btnOK : Button
    lateinit var imgPet : ImageView


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "애완동물 사진 보기"

        text1 = findViewById(R.id.text1)
        chkAgree = findViewById(R.id.chkAgree)

        text2 = findViewById(R.id.text2)
        rGroup1 = findViewById(R.id.Rgroup1)
        rdoDog = findViewById(R.id.RdoDog)
        rdoCat = findViewById(R.id.RdoCat)
        rdoRabbit = findViewById(R.id.RdoRabbit)

        btnOK = findViewById(R.id.BtnOK)
        imgPet = findViewById(R.id.ImgPet)

        // 위젯에 대응할 변수와 위젯 대응 완료
        // 시작함이 체크가 되었을 때 체크가 되면 보이고 안되면 보이지 않는 코드 작성

        // 체크박스가 선택의 변화가 있는지 확인
        chkAgree.setOnCheckedChangeListener { compoundButton, isChecked ->
            if (chkAgree.isChecked == true) {
                text2.visibility = android.view.View.VISIBLE
                rGroup1.visibility = android.view.View.VISIBLE
                btnOK.visibility = android.view.View.VISIBLE
                imgPet.visibility = android.view.View.VISIBLE

            }else{
                text2.visibility = android.view.View.INVISIBLE
                rGroup1.visibility = android.view.View.INVISIBLE
                btnOK.visibility = android.view.View.INVISIBLE
                imgPet.visibility = android.view.View.INVISIBLE
            }
        }

        // 선택 완료 버튼이 클릭되면 클릭된 버튼에 따라서 이미지가 보여진다.
        btnOK.setOnClickListener {
            // 라디오그룹에 체크되어있는 버튼의 아이디를 가져온다.
            when(rGroup1.checkedRadioButtonId) {
                // 아이디에 맞는 이미지를 이미지뷰에 셋
                R.id.RdoDog -> imgPet.setImageResource(R.drawable.dog)
                R.id.RdoCat -> imgPet.setImageResource(R.drawable.cat)
                R.id.RdoRabbit -> imgPet.setImageResource(R.drawable.rabbit)
                else -> Toast.makeText(applicationContext, "동물 먼저 선택하시오", Toast.LENGTH_SHORT)

            }
        }

    }
}

체크박스 세개 생성

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <CheckBox
            android:id="@+id/checkApple"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="사과" />

        <CheckBox
            android:id="@+id/checkOrange"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="오렌지" />

        <CheckBox
            android:id="@+id/checkBanana"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="바나나" />
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

🐰 MainActivity.kt 코드 ver.1

class MainActivity : AppCompatActivity() {

    lateinit var checkApple : CheckBox
    lateinit var checkOrange : CheckBox
    lateinit var checkBanana : CheckBox



    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        checkApple = findViewById(R.id.checkApple)
        checkOrange = findViewById(R.id.checkOrange)
        checkBanana = findViewById(R.id.checkBanana)


        checkApple.setOnCheckedChangeListener { buttonView, isChecked ->
            if (isChecked) { // 체크가 되었는지 확인
                // 되었으면 토스트 메시지 전송
                Toast.makeText(applicationContext, "사과", Toast.LENGTH_SHORT).show()
            }
        }

        checkOrange.setOnCheckedChangeListener { buttonView, isChecked ->
            if (isChecked) {
                Toast.makeText(applicationContext, "오렌지", Toast.LENGTH_SHORT).show()
            }
        }

        checkBanana.setOnCheckedChangeListener { buttonView, isChecked ->
            if (isChecked) {
                Toast.makeText(applicationContext, "바나나", Toast.LENGTH_SHORT).show()
            }
        }
    }
}

🐰 MainActivity.kt 코드 ver.2 (listner 통합)

class MainActivity : AppCompatActivity() {

    lateinit var checkApple : CheckBox
    lateinit var checkOrange : CheckBox
    lateinit var checkBanana : CheckBox

    // 리스너를 생성해서 통합
    // 변수 선언
    var listner = CompoundButton.OnCheckedChangeListener { buttonView, isChecked ->
        if (isChecked){
            // 어떤 아이디인지 확인
            when(buttonView.id){
                R.id.checkApple -> Toast.makeText(applicationContext, "사과", Toast.LENGTH_SHORT).show()
                R.id.checkOrange -> Toast.makeText(applicationContext, "오랜지", Toast.LENGTH_SHORT).show()
                R.id.checkBanana -> Toast.makeText(applicationContext, "바나나", Toast.LENGTH_SHORT).show()

            }
        }
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        checkApple = findViewById(R.id.checkApple)
        checkOrange = findViewById(R.id.checkOrange)
        checkBanana = findViewById(R.id.checkBanana)


        checkApple.setOnCheckedChangeListener (listner)

        checkOrange.setOnCheckedChangeListener (listner)

        checkBanana.setOnCheckedChangeListener (listner)
    }
}

🐰 결과

다음과 같이 토스트메시지가 뜬다

🐰 우선 체크박스의 Kotlin 처리 절차를 알아보자

• 체크박스 변수 선언

  var mycheck : CheckBox

• 변수에 체크박스 위젯 대입

  mycheck = findViewById<CheckBox>(R.id.android)

• 체크박스가 변경될 때 동작하는 람다식 정의

  mycheck.setOnCheckedChangeListner {compoundButton, b ->
    // 동작 내용 코딩
  }

체크박스는 독립적으로 사용되기 때문에 한개의 위젯에 한개의 리스너를 추가해야 한다.

🐰 토스트 메시지 코드도 알아보자

• toast : 화면 하단부에 메시지를 잠시동안 보여주는 방식

  Toast.makeText(Context context, String message, int duration).show()

  makeText 라는 메소드를 사용하고 메시지가 뿌려질 context, 메시지 내용인 message, 기간 duration , show()로 보여주며 구성된다.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="97dp"
        android:layout_marginBottom="65dp"
        android:text="TextView"
        app:layout_constraintBottom_toTopOf="@+id/textView2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="72dp"
        android:text="TextView"
        app:layout_constraintBottom_toTopOf="@+id/textView3"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="440dp"
        android:text="TextView"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

디자인 창에서는 다음과 같이 나타난다.

🐰 MainActivity.kt에서 코틀린 코드를 이용해 XML 속성을 변경해 줄 수 있다.

package com.example.textviewapp

import android.graphics.Color
import android.graphics.Typeface
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.TextView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        var tv1 : TextView //변수 생성
        var tv2 : TextView
        var tv3 : TextView

        tv1 = findViewById(R.id.textView1) // 변수 지정
        tv2 = findViewById(R.id.textView2)
        tv3 = findViewById(R.id.textView3)

        tv1.setText("안녕하세요") // 텍스트 변경
        tv1.setTextColor(Color.RED) // 색 변경
        tv2.setTextSize(30.0f) // 크기 지정
        tv2.setTypeface(Typeface.SERIF, Typeface.BOLD_ITALIC) // 글꼴 지정
        tv3.text = "가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하" //setText 사용 없이 원하는 값 전달
        tv3.setSingleLine() 


    }
}

AVD를 실행하면 다음과 같이 textView가 변경된 화면이 나타난다.

먼저, 구글에서 개발 중인 M1 칩 용 안드로이드 에뮬레이터 프리뷰 버전은 위의 깃헙을 통해 공개되고 있다. 위의 링크에 들어가서 release에 Assets 를 클릭하고 android-emulator-m1-preview.dmg 를 다운로드한다.

애뮬레이터 실행이 안되는 경우

맥 시스템 환경설정 - 보안 및 개인 정보보호 에서 허용을 눌러준다

밑으로 전부 헤제

🐰 SDK Tools 설정

🐰 build.gradle 설정

plugins {
    id 'com.android.application'
    id 'kotlin-android'
}

android {
    compileSdkVersion 29
    buildToolsVersion "29.0.2"

    defaultConfig {
        applicationId "com.example.myapplication"
        minSdkVersion 24
        targetSdkVersion 29
        versionCode 1
        versionName "1.0"

        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
    kotlinOptions {
        jvmTarget = '1.8'
    }
}

dependencies {

    implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
    implementation 'androidx.core:core-ktx:1.2.0'
    implementation 'androidx.appcompat:appcompat:1.3.0'
    implementation 'com.google.android.material:material:1.1.0'
    implementation 'androidx.constraintlayout:constraintlayout:1.1.3'
    testImplementation 'junit:junit:4.+'
    androidTestImplementation 'androidx.test.ext:junit:1.1.1'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.2.0'
}

🐰 오류 내용

ERROR: Unexpected console statement. [no-console]    console.log('안녕하세요');
ERROR: 'console' is not defined. [no-undef]    console.log('안녕하세요');

🐰 해결 방법

다음과 같은 내용을 추가한다

/*jslint devel: true */
/* eslint-disable no-console */
/*eslint no-undef: "error"*/
/*eslint-env node*/

• var (name) : (DataType) : 변수 선언

✒️ Kotlin의 변수 선언 방식

💻 실습

fun main() {
var var1 : Int = 10
var var2 : Float = 10.1f
var var3 : Double = 10.2
var var4 : Char = '안'
var var5 : String = "안드로이드"
}

• 코틀린은 암시적 선언이 가능하다. 암시적 선언이란 변수의 데이터 형식을 지정하지 않고, 대입되는 값에 따라 자동으로 변수의 데이터 형식이 지정되는 것. 단, 초기화하지 않는 경우에는 데이터 형식을 반드시 명시해야 한다.

💻 실습

var var1 : 10
var var2 : 10.1f
var var3 : 10.2
var var4 : '안'
var var5 : "안드로이드"

• var(variable)
  • 일반 변수를 선언할 때 사용
  • 필요할 때마다 계속 다른 값을 대입 가능
• val(value)
  • 변수 선언과 동시에 값을 대입하거나, 초기화 없이 선언한 후에 한번만 값을 대입 가능
  • 한 번 값을 대입하고 나면 값을 변경할 수 없음

✒️ 데이터 형식 변환

• 캐스팅 연산자 사용
• Kotlin에서 제공하는 toInt()나 toDouble() 등의 정적 메소드 사용

💻 실습

var a : Int = "100".toInt()
var b : Double = "100.1".toDouble()

✒️ null 사용

• Kotlin 은 기본적으로 변수에 null 값을 넣지 못함
  • 변수를 선언할 때 데이터 형식 뒤에 ?를 붙여야 null 대입 가능

var notNull : Int = null // 오류
var okNull : Int? = null // 정상

• 변수가 null 값이 아니라고 표시해야하는 경우
  • !!로 나타냄

var ary = ArrayList<Int>(1) // 1개짜리 배열 리스트
ary!!.add(100)

• Java와 100% 상호 호환되므로 Java 코드와 완전히 대체 가능
• Java보다 문법이 간결
• 프로그램의 안정성을 높여줌
• var 또는 val 예약어를 통해 데이터 형식을 선언하지 않고 변수를 선언할 수 있음
• IntelliJ IDEA 환경에서 개발
• Kotlin 사이트 (https://play.kotlinlang.org/)에 접속하여 별도의 설치 없이 개발
• 다운로드 : (https://www.jetbrains.com/ko-kr/idea/)

2. M1 에서 intelliJ 다운로드

위 링크를 클릭하거나 intelliJ를 검색하면 다음과 같은 화면이 뜬다. 다운로드를 클릭해준다.

무료 버전으로 다운로드 해본다. Community 밑에 다운로드가 보인다. 다운로드 오른쪽에 있는 버튼을 누르면 사진처럼 Apple Silicon 을 선택할 수 있다. 바로 다운로드를 받아주고 실행하면 된다.

3. IntelliJ 실행

응용 프로그램이 생성되었다. 아이콘을 클릭하면 다음과 같은 화면이 나온다. 왼쪽에 메뉴가 보인다

Customize 창에서 테마 변경도 가능하다.

4. 프로젝트 만들기

new project 버튼을 눌러줍니다

Language를 Kotlin 으로 바꿔줬습니다.

JDK 가 없다고 뜨는 분들은 따로 다운로드 받아줍니다.

이름과 저장 파일을 지정한 후에 Create 버튼을 클릭하면 로딩이 잠시 된 후에 실행이 됩니다. 실행된 UI를 보면 안드로이드 스튜디오와 유사한 모습을 볼 수 있다.

실행을 하려 하는데 다음과 같은 오류가 뜬다.

installed build tools revision 32.0.0 is corrupted. remove and install again using the sdk manager.

구글에 검색해보니 안드로이드 스튜디오를 지웠다가 다른 버전으로 다운로드 하면서 생긴 SDK에 버전차이 때문인것 같다.

** 📖 1. Settings >> Appearance & Behavior 카테고리 내 System Settings 클릭 >> Android SDK 클릭 >> SDK Platforms 를 확인해본다 **

초기 설정에는 제일 윗쪽 체크박스인 Android API 32가 체크되어 있다. 해당 체크박스를 취소하고 사진에 나온것과 같이 설정해주면 되는데, 오른쪽 아래 Show Package Details를 눌러줘야 상세 설정이 보인다.

** 📖 2. Settings >> Appearance & Behavior 카테고리 내 System Settings 클릭 >> Updates 클릭 >> Automatically check updates~ 라고 써있는 자동 업데이트 체크박스를 헤제 **

** 📖 3. 안드로이드에서 Gradle Scripts 클릭 >> 두번째 build.gradle (Module:~.app)클릭 후 다음과 같이 설정 변경**

** 📖 4. 아직도 오류가 나는 경우 : build.gradle (:app)에서 buildToolsVersion 을 29.0.2나 29.0.3 으로 변경**

하지만 나는 SDK와 build.gradle 설정을 마쳤음에도 다음과 같은 오류가 났다.. 산넘어 산이다

Invalid keystore format

** 📖 4. compileSdkVersion 과 targetSdkVersion 이 32로 되어 있는 부분을 27로 고쳐준다. **

** 📖 5. build.gradle 변경 이후엔 상단에 파란색으로 떠있는 Sync Now(싱크) 를 눌러주어야 동기화가 완료된다.**

🦊 코드블럭 (Code Block), 백틱 (backtick)

• 한 줄의 코드블럭은 이전 문장으로부터 엔터를 두 번 입력한 후 Tab을 이용해서 작성할 수 있다.

• 회색 박스로 감싸진 부분은 백틱(backtick)(`)으로 감싸서 작성하면 된다.

• 백틱 하나 입력시 ` 한 줄씩 블럭 처리, 백틱 세개 입력시 ``` 여러 줄 한번에 블럭 처리

• 맥OS를 사용하는 사람이라면 자판에서 백틱을 찾을 수가 없다. 바로 (~)(₩)키와 혼용되어 사용되기 때문이다. `(백틱)과 '(홑따옴표)와 다르다. 이것은 바로 한/영 구분으로 인한 것이다. 한글인 상태에서는 (₩) 원화가 입력되고, 영어인 상태에서는 (`) 백틱이 입력되는 것이다.

🦊 제목 (headers)

h1부터 h6을 이용해서 제목을 표현할 수 있다

\# 첫 번째 수준 제목 (h1)
\## 두 번째 수준 제목 (h2)
\### 세 번째 수준 제목 (h3)
\#### 네 번째 수준 제목 (h4)
\##### 다섯 번째 수준 제목 (h5)
\###### 여섯 번째 수준 제목 (h6)

🦊 인용 (Blockquotes)

• 이메일에서 사용하는 >블록 인용문자를 사용한다.
• 인용문 안에서 Tap키를 이용하면 코드블록을 쉽게 작성할 수 있다.
• 계속 중첩이 가능하다.

>    This is a first blockquotes.
>>         This is a second blockquotes.
>>>         This is a third blockquotes.

This is a first blockquotes.

    This is a second blockquotes.

    This is a third blockquotes.

🦊 코드 입력 (Syntax Highlighting)

• 코드블럭 시작점에 사용하는 언어를 선언한다.
• 입력

  ```java
  public class helloWorld{ ...

• 출력

  public class helloWorld{
    public void main(String[] args) {
        System.out.println("Hello World");
    }
  }

🦊 가로선 넣기

• 아래 입력 모두 동일한 가로선이 나타난다.

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

🦊 글자 색상 (Font color)

• 색상이 하나인줄 알았겠지만 글자색, 글자배경색 두가지 변경이 가능하다.

• 글자색 color는 Html색상표를 이용하면 쉽게 작성할 수 있다.

• 위 방법 말고도 색상을 직접 넣고 싶다면 이곳 rgba를 보고 원하는 값을 넣어도 된다.

• 입력 ``` Red Text background

• background color | rgba(색상값, 투명도)이며 투명도는 0~1 사이의 값이 들어간다.* ```

• 출력 Red Text background

🦊 링크 (Links)

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

• url 링크 <https://velog.io/> https://velog.io/

• 참조 링크

velog

[velog]:https://velog.io/

[velog]




### 🦊 강조 (Emphasis)
- 입력

이탤릭 이탤릭 볼드 볼드 취소선

- 출력

*이탤릭*
_이탤릭_
**볼드**
__볼드__
~~취소선~~

### 🦊 기호 표시 (Backslash Escapes)
- 마크다운 문법에 있는 기호를 그대로 출력하고 싶다면, 역방향 슬래시 `\`를 앞에 붙여주면 된다.




### 테이블(Table)
- 수직선 기호(|)로 열을 구분할 수 있다
- 하이픈 기호(-)를 여러 개 붙여서 th와 tr을 구분할 수 있다.
- 콜론 기호(:)로 정렬을 표현할 수 있다.
- 입력

🦊 이모지 단축키(Emoji)

• 링크에서 복사+붙여넣기: https://kr.piliapp.com/twitter-symbols/

• MacOS ctrl + cmd + space bar

• Windows window key + semi colon || window key + . (period)

• Linux (right click) select insert emoji

🦊 체크박스 (Check Box)

• *, +, - 기호 뒤에 띄어쓰기 이후 대괄호[]를 넣어 작성한다.
• 띄어쓰기를 하면 체크되지 않은 상태이고,
• x를 입력해주면 체크된 상태가 된다.
• 입력 ```
• 체크되지 않은 박스
• 체크된 박스 ```
• 출력
• 체크되지 않은 박스
• 체크된 박스