ํด๋น ํฌ์คํ
์ "์ํ์ฝ๋ฉ"์ ์ด๊ณ ์ ๋์ ๊ฐ์๋ฅผ ๊ธฐ๋ฐ์ผ๋ก ์ฌ๋ฆฐ ๊ฒ์๊ธ ์
๋๋ค.
์์
์ ์ธ ์ฉ๋๊ฐ ์๋, ๊ฐ์ธ ๊ณต๋ถ ์ ๋ฆฌ ๋ชฉ์ ์ผ๋ก ์ฌ๋ฆฌ๋ ๊ธ์์ ๋ฏธ๋ฆฌ ์๋ฆฝ๋๋ค.
์ค์ต ๋ด์ฉ์ ๊ธฐ๋ณธ์ ์ธ ์น์ ๊ธฐ์ด ์ง์๊ณผ, html, css๋ฅผ ์ดํดํ๊ณ ์๋ค๋ ๊ฐ์ ํ์ ์ค์ตํฉ๋๋ค.
์์
๋ชฉ์
์ด๋ฒ ์์
์์๋ JavaScript ์ธ์ด์ ์คํ๋ฐฉ๋ฒ๊ณผ ์ค์ตํ๊ฒฝ์ ๋ํด์ ์์๋ณธ๋ค.
์คํ
์๋ฐ์คํฌ๋ฆฝํธ๋ ์๋ ์น๋ธ๋ผ์ฐ์ ์์ HTML, CSS๋ฅผ ๋์ ์ผ๋ก ์ ์ดํ๊ธฐ ์ํด์ ๋ง๋ค์ด์ง ์ธ์ด๋ค.
ํ์ง๋ง ์ค๋๋ ์๋ฐ์คํฌ๋ฆฝํธ๊ฐ ์น๋ธ๋ผ์ฐ์ ๋ฅผ ๋ฒ์ด๋์ ๋งค์ฐ ๋ค์ํ ์ฉ๋๋ก ์ฌ์ฉ๋๊ณ ์๋ค.
์ด๋ฐ ์ด์ ๋ก ์๋ฐ์คํฌ๋ฆฝํธ์ ์คํํ๊ฒฝ์ ๋ค์ํ๋ค.
ํ์๋ ์๋ฐ์คํฌ๋ฆฝํธ์ ์๋ ๋ชฉ์ ์ด์๊ณ , ๊ฐ์ฅ ๋ณดํธ์ ์ธ ์คํํ๊ฒฝ์ธ ์น๋ธ๋ผ์ฐ์ ์์ ์ค์ต์ ์งํํ ๊ฒ์ด๋ค.
ํ์ง๋ง ๋ณธ ์์
์ ๋ด์ฉ์ ์น๋ธ๋ผ์ฐ์ ๋ฟ ์๋๋ผ node.js, ๊ตฌ๊ธ ํฌ๋กญ ์น๋ธ๋ผ์ฐ์ ํ๋ฌ๊ทธ์ธ, ๊ตฌ๊ธ ์คํฌ๋ฆฝํธ, PDF
๊ฐ์ข
๋ฐ์คํฌํ ์์ ฏ์์ ์ฌ์ฉ๋๋ ์๋ฐ์คํฌ๋ฆฝํธ์์๋ ์ ์ฉ๋ ์ ์๋ ๋ด์ฉ์ด๋ค.
์์
๋ด์ฉ
์ฌ์ฉ ์น ๋ธ๋ผ์ฐ์ : ํฌ๋กฌ
์ฌ์ฉ ์๋ํฐ : note ++(์ด๋ค ๊ฒ์ด๋ ์๊ด ์๋ค.)
๊ฐ์ธ์ ์ผ๋ก ์๋์ฐ ํ๊ฒฝ์์ note++๋ก ์ฌ์ฉํ๋ ๊ฒ์ ์ถ์ฒ!ํฉ๋๋ค. (์ธ์ด ์ ํ์ด ์ฉ์ดํจ)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<script>
alert('Hello world');
</script>
</body>
</html>
์์ ๊ฐ์ด <script>์์์ ๋์ํ๋ ๊ฒ์ด javascript์ด๊ณ ,
์ ์ฝ๋์์๋ html ์์์ ๋์ํ๋ค.
์ฝ๋๋ฅผ ์ ์ฅํ๊ณ , ์คํ์ํค๋ฉด ์น ๋ธ๋ผ์ฐ์ (ํฌ๋กฌ)์์ script๊ฐ ๋์ํ๋ค.
์ฝ๋ <script>๋ ์น๋ธ๋ผ์ฐ์ ์๊ฒ ์ง๊ธ๋ถํฐ๋ ์๋ฐ์คํฌ๋ฆฝํธ ์ฝ๋์ด๊ธฐ ๋๋ฌธ์ ์ด ์ฝ๋๋ฅผ ํด์ ํ ๋๋ ์๋ฐ์คํฌ๋ฆฝํธ์ ๋ฌธ๋ฒ์ ๋ฐ๋ผ์ ํด์ํด์ ์คํํ๋ผ๊ณ ์๋ ค์ฃผ๋ ๊ตฌ๋ฌธ(ํ๊ทธ)๋ค. alert('Hello world')๋ ๊ฒฝ๊ณ ์ฐฝ์ Hello world๋ผ๋ ๋ฌธ๊ตฌ๋ฅผ ์ถ๋ ฅํ๋ผ๋ ์ผ์ข
์ ๋ช
๋ น์ด๋ค. </script>๋ ์๋ฐ์คํฌ๋ฆฝํธ ๊ตฌ๊ฐ์ด ๋๋ฌ๊ธฐ ๋๋ฌธ์ ์ด ํ๋ถํฐ ๋ํ๋๋ ์ฝ๋๋ HTML์ ๋ฌธ๋ฒ์ผ๋ก ํด์ํ๋ผ๊ณ ๋ธ๋ผ์ฐ์ ์๊ฒ ์๋ ค์ฃผ๋ ๊ฒ์ด๋ค.
ํฌ๋กฌ์ ์ฌ์ฉํ๋ค๋ฉด, ๋ค์๊ณผ ๊ฐ์ ๋ฐฉ๋ฒ์ผ๋ก ์๋ฐ ์คํฌ๋ฆฝํธ๋ฅผ ์ฝ๊ฒ ์คํ ์์ผ ๋ณผ ์ ์๋ค.
๊ฐ๋ฐ์ ๋๊ตฌ [F12]๋ฅผ ์คํ ํ -> console ์์ ๋ฐ๋ก <script>ํ๊ทธ ์์ด ๋ช
๋ น๊ตฌ๋ฌธ์ ์
๋ ฅํ๋ฉด ๋๋ค.