๋ณธ๋ฌธ์œผ๋กœ ์ด๋™

JavaScript/First program

์œ„ํ‚ค์ฑ…, ์œ„ํ‚ค์ฑ…

๋‹ค์Œ์€ "Hello World!"๋ผ๋Š” ํŒ์—… ๋Œ€ํ™” ์ƒ์ž๋ฅผ ๋งŒ๋“œ๋Š” ๋‹จ์ผ ์ž๋ฐ” ์Šคํฌ๋ฆฝํŠธ ๋ฌธ์ด๋‹ค.

alert("Hello World!");

๋ธŒ๋ผ์šฐ์ €๊ฐ€ ๋ช…๋ น๋ฌธ์„ ์‹คํ–‰ํ•˜๋ ค๋ฉด <script> ์š”์†Œ ๋‚ด์— ๋ฐฐ์น˜๋˜์–ด์•ผ ํ•œ๋‹ค. ์ด ์š”์†Œ๋Š” ๋‚˜์ค‘์— ๋” ์ž์„ธํžˆ ์„ค๋ช…ํ•œ๋‹ค.

<script>
  alert("Hello World!");
</script>

๊ทธ๋Ÿฐ ๋‹ค์Œ <script> ์š”์†Œ๋Š” HTML ๋ฌธ์„œ์˜ <head> ์š”์†Œ ๋‚ด์— ์ค‘์ฒฉ๋˜์–ด์•ผ ํ•œ๋‹ค. ์ž๋ฐ” ์Šคํฌ๋ฆฝํŠธ๊ฐ€ ํ™œ์„ฑํ™”๋œ ๋ธŒ๋ผ์šฐ์ €์—์„œ ํŽ˜์ด์ง€๊ฐ€ ํ‘œ์‹œ๋œ๋‹ค๊ณ  ๊ฐ€์ •ํ•˜๋ฉด ๋ธŒ๋ผ์šฐ์ €๋Š” ํŽ˜์ด์ง€๊ฐ€ ๋กœ๋“œ๋  ๋•Œ ๋ช…๋ น๋ฌธ์„ ์‹คํ–‰ํ•ฉ๋‹ˆ๋‹ค.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Some Page</title>
    <script>
      alert("Hello World!");
    </script>
  </head>
  <body>
    <p>The content of the web page.</p>
  </body>
</html>

์ด ๊ธฐ๋ณธ Hello World ํ”„๋กœ๊ทธ๋žจ์€ ์ž‘์„ฑํ•ด์•ผํ•˜๋Š” ์ƒˆ๋กœ์šด ํ”„๋กœ๊ทธ๋žจ์˜ ์‹œ์ž‘์ ์œผ๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.

์˜ˆ์ œ

[+/-]

์˜ˆ์ œ 1-1

[+/-]

ํŒŒ์ผ์— Hello World ํ”„๋กœ๊ทธ๋žจ์„ ๋ณต์‚ฌ ๋ถ™์—ฌ๋„ฃ๊ธฐ ํ•˜์—ฌ "exercise 1-1.html"๋กœ ์ €์žฅํ•œ ํ›„, ๋‘ ๊ฐ€์ง€ ๋ฐฉ๋ฒ•์œผ๋กœ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค.

  1. ํŒŒ์ผ ๊ด€๋ฆฌ์ž๋กœ ํŒŒ์ผ์„ ์ด๋™ํ•˜๊ณ  ์›น ๋ธŒ๋ผ์šฐ์ €๋ฅผ ํ†ตํ•ด ํŒŒ์ผ ์—ด๊ธฐ (Windows ํƒ์ƒ‰๊ธฐ์—์„œ ๋”๋ธ”ํด๋ฆญ)
  2. ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์‹œ์ž‘ํ•œ ๋‹ค์Œ ๋ฉ”๋‰ด์—์„œ ํŒŒ์ผ์„ ์—ฐ๋‹ค. ํŒŒ์ด์–ดํญ์Šค์˜ ๊ฒฝ์šฐ, ๋ฉ”๋‰ด์—์„œ File์„ ์„ ํƒํ•œ ๋‹ค์Œ open File์—์„œ ํŒŒ์ผ์„ ์„ ํƒํ•œ๋‹ค.

์˜ˆ์ œ 1-2

[+/-]

์œ„์˜ ํŒŒ์ผ์„ "์—ฐ์Šต 1-2.html"๋กœ ์ €์žฅํ•œ๋‹ค. alert("Hello World!");์˜ ํฐ ๋”ฐ์˜ดํ‘œ๋ฅผ ์ž‘์€ ๋”ฐ์˜ดํ‘œ๋กœ ๋ฐ”๊พธ๊ณ  ๊ฒฐ๊ณผ๋ฅผ ์ €์žฅํ•œ๋‹ค.

๊ฐ™์€ ๊ฒฐ๊ณผ๊ฐ€ ๋‚˜์˜จ๋‹ค. ํฐ ๋”ฐ์˜ดํ‘œ์™€ ์ž‘์€ ๋”ฐ์˜ดํ‘œ๋Š” ๋™์ผํ•˜๋‹ค.