# ํ
ํ๋ฆฟ ๋ฆฌํฐ๋ด(Template Literal)ES6๋ถํฐ ์๋ก ๋์
๋ ๋ฌธ์์ด ํ๊ธฐ๋ฒ๋ฌธ์์ด ์์ฑ์ ๋ฐ์ดํ ๋์ , ๋ฐฑํฑ(`)์ ์ฌ์ฉvar str_01 = `hello world`;//๋ฐฑํฑ ์ฌ์ฉconst x='x';const y='y';const z='z';console.log(`${x}๋ x, ${y}๋ y, ${z}๋ z์ด๋ค. `); //x๋ x, y๋ y, z๋ z์ด๋ค. โถ๏ธ ๋ฐฑํฑ(`)์ ์๋ฐ์คํฌ๋ฆฝํธ JS ES6(ECMAScript 2015)๋ถํฐ ๋์
๋์๋ค.โถ๏ธ ๊ฐํ ๋ฌธ์(\n)๋ฅผ ์ฌ์ฉํ์ง ์์๋ ์๋ ์ค๋ฐ๊ฟ โถ๏ธ ์๊น์๊ฐ ์์๋ฐ์ํ(')์ ๋น์ทํ๋ ํท๊ฐ๋ฆฌ์ง ์๋๋ก ์ฃผ์# ํ
ํ๋ฆฟ ๋ฆฌํฐ๋ด - ๋ฐฑํฑ(`)์ ๊ธฐ๋ฅ ์ค๋ฐ๊ฟ(๊ฐํ: Multi-line strings) โถ๏ธ ๋ฐฑํฑ(`)์ผ๋ก ํ
ํ๋ฆฟ ๋ฆฌํฐ๋ด์ ์ฌ์ฉํ๋ฉด..
์ฌ๋ฌ๋ถ๋ค ์ค๋์ ๋ช ๊ฐ์ง ์ ์ฉํ ํ๋ก๊ทธ๋จ ์๊ฐ ํด ๋๋ฆฌ๋ ค๊ณ ํด์๊ทธ ์ค ์ฝ๋ฉ ์ฐ์ตํ ๋๋ ํฌํธํด๋ฆฌ์ค ๋ง๋ค ๋ ์ฐธ๊ณ ํ๊ธฐ ์ข์ ์ฌ์ดํธ ํ๋ ๊ฐ์ ธ์์ด์. CodePenAn online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications.codepen.io CodePen์ ์น ๊ฐ๋ฐ์์ ๋์์ด๋๋ค์ด HTML, CSS, JavaScript ์ฝ๋๋ฅผ ์ค์๊ฐ์ผ๋ก ์์ฑํ๊ณ ๊ณต์ ํ ์ ์๋์จ๋ผ์ธ ์ฝ๋ ํธ์ง๊ธฐ์
๋๋ค. ๋ฌด๋ฃ ์๊ธ์ ๋ก๋ ๊ธฐ๋ณธ์ ์ธ ์ฝ๋ฉ ์์
์ด ๊ฐ๋ฅํ์ง๋ง, ํ์
๊ณผ ๊ณ ๊ธ ๊ธฐ๋ฅ์ ์ํ ๊ฒฝ์ฐ..
1. ์์
์๋ ํ๊ฐ ์๊ณ ๋
ธ์
์๋ ๋ฐ์ดํฐ๋ฒ ์ด์ค๊ฐ ์๋ค. ์ผ์ ๊ด๋ฆฌ, ๊ธฐ์ต์ ๋จ๋ ์ํ๋ ์ฑ
์ ๊ดํ ๊ธฐ๋ก, ํ๋ก์ ํธ ๊ด๋ฆฌ์ ๊ผญ ํ์ํ ๊ธฐ๋ฅ์ด ๋ฐ์ดํฐ๋ฒ ์ด์ค์
๋๋ค. ์์
์์ ํ๋ฅผ ๋ง๋๋ ๊ฒ๊ณผ ๋น์ทํ ๊ธฐ๋ฅ์
๋๋ค. ๋น ํ์ด์ง์์ ๋ธ๋ก ์ถ๊ฐ ๋จ์ถํค / ๋ฅผ ๋๋ฅด๊ณ ์๋๋ก ๋ด๋ ค๋ณด๋ฉด [๋ฐ์ดํฐ๋ฒ ์ด์ค] ํญ๋ชฉ์ด ์์ด์. /data ๋ฅผ ์
๋ ฅํด๋ ๊ฐ์ ๊ธฐ๋ฅ์ ์ด์ฉ ํ ์ ์์ด์. ๋
ธ์
์์ ์ง์ํ๋ ๋ฐ์ดํฐ๋ฒ ์ด์ค์ ์ข
๋ฅ๋ 6๊ฐ์ง์์. 1-1. [ํ ๋ณด๊ธฐ]๊ฐ์ฅ ๊ธฐ๋ณธ์ ์ธ ํ ํํ์
๋๋ค. 1. [ + ์ ๋ฐ์ดํฐ๋ฒ ์ด์ค ์์ฑ] 2. ํ๊ทธ ์ + ์์ด์ฝ ๋๋ฌ์ ์ด ์ถ๊ฐ ํ [+ ์๋ก ๋ง๋ค๊ธฐ] ๋๋ฌ์ ํ ์ถ๊ฐ 3. ์ ๋ชฉ ์
๋ ฅ (์์ - ์ด๋ฒ ๋ฌ ์ผ์ ) 4. ํ ํญ๋ชฉ์๋ ํ ์ผ, ๋ถ๋ฅ,๋ง๊ฐ์ผ ๋ฑ ์ถ๊ฐ ๊ฐ๋ฅ 5. ํ ํญ๋ชฉ ..
'ํ
ํ๋ฆฟ' ํ๊ทธ์ ๊ธ ๋ชฉ๋ก
๋จ์ถํค
๋ด ๋ธ๋ก๊ทธ
๋ด ๋ธ๋ก๊ทธ - ๊ด๋ฆฌ์ ํ ์ ํ |
Q
Q
|
์ ๊ธ ์ฐ๊ธฐ |
W
W
|
๋ธ๋ก๊ทธ ๊ฒ์๊ธ
๊ธ ์์ (๊ถํ ์๋ ๊ฒฝ์ฐ) |
E
E
|
๋๊ธ ์์ญ์ผ๋ก ์ด๋ |
C
C
|
๋ชจ๋ ์์ญ
์ด ํ์ด์ง์ URL ๋ณต์ฌ |
S
S
|
๋งจ ์๋ก ์ด๋ |
T
T
|
ํฐ์คํ ๋ฆฌ ํ ์ด๋ |
H
H
|
๋จ์ถํค ์๋ด |
Shift + /
โง + /
|
* ๋จ์ถํค๋ ํ๊ธ/์๋ฌธ ๋์๋ฌธ์๋ก ์ด์ฉ ๊ฐ๋ฅํ๋ฉฐ, ํฐ์คํ ๋ฆฌ ๊ธฐ๋ณธ ๋๋ฉ์ธ์์๋ง ๋์ํฉ๋๋ค.