์ฑ„๋„ํ†ก ์•„์ด์ฝ˜

์‰ฝ๊ณ  ์ž์—ฐ์Šค๋Ÿฝ๊ฒŒ ๋ฐฐ์›Œ๋ณด๋Š” Javascript ์ž…๋ฌธ - ์ฝ”๋“œ์Šค์ฟผ๋“œ ๋งˆ์Šคํ„ฐ์ฆˆ ์ฝ”์Šค ๋ ˆ๋ฒจ1

๊ฐœ๋ฐœ์ž ์ถœ์‹ ์˜ ๊ต์œก ์ „๋ฌธ๊ฐ€๋“ค์ด ๋งŒ๋“  ์ตœ๊ณ ํ’ˆ์งˆ์˜ ์†Œํ”„ํŠธ์›จ์–ด ๊ต์œก๊ธฐ๊ด€ ์ฝ”๋“œ์Šค์ฟผ๋“œ์—์„œ ์ง„ํ–‰ํ•˜๋Š” ์ฝ”๋“œ์Šค์ฟผ๋“œ ๋งˆ์Šคํ„ฐ์ฆˆ ์ฝ”์Šค ๋ ˆ๋ฒจ1 ์ž…๋‹ˆ๋‹ค. Javascript ์ž…๋ฌธ ๊ณผ์ •์œผ๋กœ์„œ ์ง์ ‘ ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ๊ตฌํ˜„์„ ํ†ตํ•ด์„œ ์ฝ”๋”ฉ์˜ ๊ธฐ์ดˆ ๊ฐœ๋…์„ ๋ฐฐ์šฐ๋Š”๊ฒƒ์„ ๋ชฉํ‘œ๋กœ ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

Thumbnail

์ž…๋ฌธ์ž๋ฅผ ์œ„ํ•ด ์ค€๋น„ํ•œ
[ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด] ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๊ฑธ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์–ด์š”

  • JavaScript์˜ ๊ธฐ๋ณธ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๊ฐœ๋…

  • ๋ฐฐ์—ด, ํ•จ์ˆ˜, ๊ฐ์ฒด์˜ ์‚ฌ์šฉ๋ฒ•

  • HTML๊ณผ JavaScript๋ฅผ ์ด์šฉํ•œ ์ธํ„ฐ๋ž™ํ‹ฐ๋ธŒ ์›น ํŽ˜์ด์ง€ ์ œ์ž‘

  • ์กฐ๊ฑด๋ฌธ๊ณผ ๋ฐ˜๋ณต๋ฌธ์„ ํ™œ์šฉํ•œ ๋ฌธ์ œ ํ•ด๊ฒฐ

  • Git์„ ์ด์šฉํ•œ ๋ฒ„์ „ ๊ด€๋ฆฌ

  • ์žฌ๊ท€์™€ ์„ฑ๋Šฅ ์ธก์ •

  • ์‹ค์ œ ํ”„๋กœ์ ํŠธ๋ฅผ ํ†ตํ•œ ์‹ค์Šต ๊ฒฝํ—˜

์ฝ”๋“œ์Šค์ฟผ๋“œ ๋งˆ์Šคํ„ฐ์ฆˆ ์ฝ”์Šค ๋ ˆ๋ฒจ1 ๊ฐ•์ขŒ ์†Œ๊ฐœ

์ด ๊ฐ•์ขŒ๋Š” Javascript ๋ฅผ ํ†ตํ•ด ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ๋ฐฐ์›Œ๋ณด๋Š” ๊ฒƒ์„ ๋ชฉํ‘œ๋กœ ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. ์ง์ ‘ ๊ตฌ๊ตฌ๋‹จ๋“ฑ ์—ฌ๋Ÿฌ๊ฐ€์ง€ ํ”„๋กœ๊ทธ๋žจ ๊ตฌํ˜„์„ ํ†ตํ•ด ์ฝ”๋”ฉ์„ ๋ฐฐ์›Œ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ์ฝ”์Šค๋Š” ๊ณ ํ’ˆ์งˆ ์†Œํ”„ํŠธ์›จ์–ด ๊ต์œก๊ณผ์ •์ธ ๋งˆ์Šคํ„ฐ์ฆˆ ์ฝ”์Šค ๋ฉค๋ฒ„์Šค ๋ ˆ๋ฒจ 2๋ฅผ ์œ„ํ•œ ์„ ์ˆ˜๊ณผ์ •์ž…๋‹ˆ๋‹ค. ์ž์„ธํ•œ ๋‚ด์šฉ์€ ํ™ˆํŽ˜์ด์ง€(http://codesquad.kr/page/masters.html) ๋ฅผ ์ฐธ๊ณ ํ•ด ์ฃผ์„ธ์š”.

๋ฐฐ์šฐ๋Š” ๊ฒƒ๋“ค

  • ๊ตฌ๊ตฌ๋‹จ ํ”„๋กœ๊ทธ๋žจ์„ ๊ตฌํ˜„ํ•˜๊ณ  ์‹คํ–‰ํ•˜๋Š” ๋ฐฉ๋ฒ•
  • ์‚ฌ์šฉ์ž ๊ฐ’์„ ์ž…๋ ฅํ•˜๋Š” ๋ฐฉ๋ฒ•๊ณผ ์ฝ˜์†”์— ๊ฐ’์„ ์ถœ๋ ฅํ•˜๋Š” ๋ฐฉ๋ฒ•
  • ๋ณ€์ˆ˜, ๋ฐ์ดํ„ฐ ํƒ€์ž…, ๋ฐ˜๋ณต๋ฌธ, ์กฐ๊ฑด๋ฌธ์„ ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•
  • ๋ฆฌ์ŠคํŠธ์™€ ๊ฐ์ฒด๋ฅผ ํ™œ์šฉํ•ด์„œ ํ”„๋กœ๊ทธ๋ž˜๋ฐํ•˜๋Š” ๋ฐฉ๋ฒ•
  • git์„ ์‚ฌ์šฉํ•ด์„œ github๋ฅผ ์ด์šฉํ•œ ํ”„๋กœ์ ํŠธ ๊ด€๋ฆฌ

๊ตฌํ˜„ ํ›„ ํ•ด์•ผ ํ•  ๊ฒƒ๋“ค

  • ์•„๋ฌด๊ฒƒ๋„ ์—†๋Š” ์Šคํฌ๋ž˜์น˜ ์ƒํƒœ์—์„œ ๊ฒ€์ƒ‰์„ ํ•˜์ง€ ์•Š๊ณ  ์ฝ”๋“œ๋ฅผ ๋‹ค์‹œ ์งœ ๋ณธ๋‹ค.
  • ๋‚ด๊ฐ€ ๋งŒ๋“ค๊ณ  ์‹ถ์€ ํ”„๋กœ๊ทธ๋žจ์„ ์ƒ๊ฐํ•ด ๋ณด๊ณ , ๋งŒ๋“ค ์ˆ˜ ์žˆ๋Š” ๋ถ€๋ถ„๊นŒ์ง€ ๋งŒ๋“ค์–ด ๋ณธ๋‹ค.

์˜ˆ์ œ ์ฝ”๋“œ ์ €์žฅ์†Œ

์•„๋ž˜ ๋งํฌ์—๋Š” ๋ฐ๋ชจ์— ์‚ฌ์šฉํ•œ ์˜ˆ์ œ ์ฝ”๋“œ๋“ค์ด ์ €์žฅ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฐ€๋Šฅํ•˜๋ฉด ์˜ˆ์ œ ์ฝ”๋“œ๋ฅผ ๋ณด์ง€ ๋ง๊ณ  ์ง์ ‘ ๊ตฌํ˜„ํ•˜์‹œ๊ธฐ ๋ฐ”๋ž๋‹ˆ๋‹ค. https://github.com/honux77/js-playground

๊ฐ™์ด ๊ณต๋ถ€ํ•˜๋ฉด ์ข‹์€ ๊ฐ•์ขŒ

์ƒํ™œ์ฝ”๋”ฉ WEB2 - JavaScript ๊ฐ•์ขŒ

์ง€์‹๊ณต์œ ์ž ์†Œ๊ฐœ

์ฝ”๋“œ์Šค์ฟผ๋“œ
์ฝ”๋“œ์Šค์ฟผ๋“œ
๊ฐœ๋ฐœ์ž ์ถœ์‹ ์˜ ๊ต์œก ์ „๋ฌธ๊ฐ€๋“ค์ด ๋งŒ๋“  ์ตœ๊ณ ํ’ˆ์งˆ์˜ ์†Œํ”„ํŠธ์›จ์–ด ๊ต์œก๊ธฐ๊ด€
http://codesquad.kr  

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜
์ถ”์ฒœ๋“œ๋ ค์š”!

ํ•™์Šต ๋Œ€์ƒ์€
๋ˆ„๊ตฌ์ผ๊นŒ์š”?

  • ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์ดˆ๋ณด์ž

  • JavaScript๋ฅผ ์ฒ˜์Œ ๋ฐฐ์šฐ๋Š” ์‚ฌ๋žŒ

  • ์›น ๊ฐœ๋ฐœ์— ๊ด€์‹ฌ ์žˆ๋Š” ์‚ฌ๋žŒ

  • ์‹ค์Šต์„ ํ†ตํ•ด ๋ฐฐ์šฐ๊ณ  ์‹ถ์€ ์‚ฌ๋žŒ

  • ๊ธฐ๋ณธ์ ์ธ HTML ์ง€์‹์ด ์žˆ๋Š” ์‚ฌ๋žŒ

  • ์ฝ”๋“œ์˜ ์œ ์ง€๋ณด์ˆ˜์„ฑ์„ ๋†’์ด๊ณ  ์‹ถ์€ ์‚ฌ๋žŒ

์•ˆ๋…•ํ•˜์„ธ์š”
ํ˜ธ๋ˆ…์Šค์ž…๋‹ˆ๋‹ค.

27,450

๋ช…

์ˆ˜๊ฐ•์ƒ

821

๊ฐœ

์ˆ˜๊ฐ•ํ‰

145

๊ฐœ

๋‹ต๋ณ€

4.7

์ 

๊ฐ•์˜ ํ‰์ 

5

๊ฐœ

๊ฐ•์˜

๊ณ ํ’ˆ์งˆ ์†Œํ”„ํŠธ์›จ์–ด ๊ต์œก ๊ธฐ์—… ์ฝ”๋“œ์Šค์ฟผ๋“œ ๋ฐฑ์—”๋“œ ๋งˆ์Šคํ„ฐ์ž…๋‹ˆ๋‹ค.

์ฝ”๋“œ์Šค์ฟผ๋“œ์—์„œ ๋ฐฑ์—”๋“œ ๊ฐœ๋ฐœ์ž ์ง€๋ง์ƒ์„ ์œก์„ฑํ•˜๊ณ  ์žˆ์œผ๋ฉฐ ์šฐ์•„ํ•œ ํ˜•์ œ๋“ค, ์นด์นด์˜ค, ๋„ค์ด๋ฒ„, ๋ผ์ธ, ์ฟ ํŒก, ์‚ผ์„ฑ์ „์ž, ํ˜„๋Œ€์นด๋“œ ๋“ฑ์—์„œ ๋ฐฑ์—”๋“œ, ํด๋ผ์šฐ๋“œ, ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค ๊ด€๋ จ ๋‹ค์ˆ˜์˜ ๊ธฐ์—… ๊ฐ•์˜๋ฅผ ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. 

์ตœ๊ทผ์—๋Š” ํด๋ผ์šฐ๋“œ, ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค, ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ, ์–ด์…ˆ๋ธ”๋ฆฌ, ๋ ˆํŠธ๋กœ๊ฒŒ์ž„ ๋“ฑ์— ๊ด€์‹ฌ์„ ๊ฐ€์ง€๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

(ํ˜„) ์ฝ”๋“œ์Šค์ฟผ๋“œ ๋ฐฑ์—”๋“œ ๋งˆ์Šคํ„ฐ
Amazon Web Services Senior Tech. Trainer 
NHN NEXT ๊ต์ˆ˜
LG์ „์ž ์†Œํ”„ํŠธ์›จ์–ด ํ”Œ๋žซํผ ์—ฐ๊ตฌ์‹ค ์„ ์ž„์—ฐ๊ตฌ์›
ํ•œ์–‘๋Œ€ํ•™๊ต ์ปดํ“จํ„ฐ๊ณตํ•™๊ณผ ๋ฐ•์‚ฌ

๋”๋ณด๊ธฐ

๊ณต๋™ ์ง€์‹๊ณต์œ ์ž

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

68๊ฐœ โˆ™ (10์‹œ๊ฐ„ 39๋ถ„)

๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์ „์ฒด

53๊ฐœ

4.6

53๊ฐœ์˜ ์ˆ˜๊ฐ•ํ‰

  • HWAN

    โˆ™

    ์ˆ˜๊ฐ•ํ‰ 11

    โˆ™

    ํ‰๊ท  ํ‰์  5.0

    5

    100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

    ํ‘ธ์‹œ ํŒ ํ‘ธ์‹œ ํŒ ์›ƒ๊ฒจ์„œ ๋‚จ๊ฒจ์š”~!ใ…‹ใ…‹ ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌ ๋“œ๋ฆฝ๋‹ˆ๋‹ค^^

    • ์‹ ์Šนํ™”

      โˆ™

      ์ˆ˜๊ฐ•ํ‰ 7

      โˆ™

      ํ‰๊ท  ํ‰์  4.7

      5

      100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

      ๊ฐ•์‚ฌ๋‹˜ ๋„ˆ๋ฌด ์œ ์พŒํ•˜์„ธ์š” ๋’ท๋ถ€๋ถ„ ๊ณผ์ œ ๊ฐ™์€ ๊ฒฝ์šฐ ์š”๊ตฌ์‚ฌํ•ญ์„ ๋จผ์ € ์•Œ๋ ค์ฃผ์…”์„œ ํ˜ผ์ž์„œ ํ•ด๋ณธ ๋‹ค์Œ์— ๊ฐ•์‚ฌ๋‹˜์€ ์–ด๋–ป๊ฒŒ ์ฝ”๋”ฉํ•˜์‹œ๋Š”์ง€ ๋ณผ ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜์–ด์š”. ๊ทธ๋ฆฌ๊ณ  ์ค‘๊ฐ„์— ์—๋Ÿฌ๋‚˜๋Š” ๊ฒฝ์šฐ ๊ทธ๋Œ€๋กœ ๋ณด์—ฌ์ฃผ๋Š” ๊ฒƒ๋„ ์ข‹์•˜์Šต๋‹ˆ๋‹ค. (์–ด๋–ป๊ฒŒ ํ•ด๊ฒฐํ•ด๋‚˜๊ฐ€๋Š”์ง€ ๋ณผ ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์—)

      • sonypark

        โˆ™

        ์ˆ˜๊ฐ•ํ‰ 5

        โˆ™

        ํ‰๊ท  ํ‰์  5.0

        5

        100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

        ๊ฐ•์‚ฌ๋‹˜์˜ ์นœ์ ˆํ•œ ์„ค๋ช…๊ณผ ์žฌ์น˜์žˆ๋Š” ์ž…๋‹ด ๋•๋ถ„์— ์ฆ๊ฒ๊ฒŒ ๊ณต๋ถ€ํ–ˆ์Šต๋‹ˆ๋‹ค :) ๊ฐ•์‚ฌ๋‹˜๊ป˜์„œ ์˜ˆ์‹œ๋ฅผ ๋“ค์–ด๊ฐ€๋ฉฐ ์นœ์ ˆํ•˜๊ฒŒ ํ•ด์ฃผ์‹ญ๋‹ˆ๋‹ค. ์ค‘๊ฐ„์ค‘๊ฐ„ ์œ ๋จธ๋ฅผ ๋‚ ๋ฆฌ์‹œ๋Š”๋ฐ ๊ฐœ๊ทธ ์ฝ”๋“œ๊ฐ€ ์ž˜ ๋งž์•„์„œ ์žฌ๋ฏธ์žˆ๊ฒŒ ๋“ค์—ˆ์–ด์š” ใ…Žใ…Žใ…Žใ…Ž ๊ฐ•์˜๋ฅผ ๋“ค์œผ์‹ค ๋•Œ ํŒ์„ ๋“œ๋ฆฌ์ž๋ฉด ๊ฐ•์˜์— ๋‚˜์˜จ ๊ณผ์ œ๋ฅผ ๊ผญ ์ฒ˜์Œ๋ถ€ํ„ฐ ๋‹ค์‹œ ์งœ๋ณด๋ผ๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค. ๊ตฌ๊ตฌ๋‹จ, ๊ณ„์‚ฐ๊ธฐ, ์ˆซ์ž ํผ์ฆ์„ ๊ฐ•์‚ฌ๋‹˜๊ณผ ๊ฐ™์ด ์งœ๋ฉด ๋‹ค ์•„๋Š” ๊ฒƒ ๊ฐ™์•„๋„ ๋ฐฑ์ง€ ์ƒํƒœ๋กœ ํ˜ผ์ž ๊ตฌํ˜„ํ•˜๋ ค๊ณ  ํ•˜๋ฉด ์ž˜ ์•ˆ๋˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ๋งŽ์•˜์Šต๋‹ˆ๋‹ค. ๊ฐ•์‚ฌ๋‹˜๋„ ๊ฐ•์กฐํ•˜๋Š” ๊ฒƒ์ด ์ฝ”๋“œ๋ฅผ ํ˜ผ์ž์„œ ๋‹ค์‹œ ์งœ๋ณด๋ผ๋Š” ๊ฒƒ์ธ๋ฐ์š” ์ง์ ‘ ํ•ด๋ณด๋ฉด์„œ ์™œ ๊ทธ๋Ÿฐ ๋ง์„ ํ•˜์…จ๋Š”์ง€ ์•Œ ๊ฒƒ ๊ฐ™์•˜์Šต๋‹ˆ๋‹ค. ์ €๋Š” ํ•œ ๋ฒˆ์œผ๋กœ๋Š” ๋ถ€์กฑํ•ด์„œ ๊ฐ ๊ณผ์ œ๋งˆ๋‹ค ์„ธ ๋ฒˆ์”ฉ ๋‹ค์‹œ ๊ตฌํ˜„ํ–ˆ์Šต๋‹ˆ๋‹ค. JS์ž…๋ฌธ์„ ์ด ๊ฐ•์˜๋กœ ํ–ˆ๋Š”๋ฐ ํฐ ๋„์›€์ด ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ์ข‹์€ ๊ฐ•์˜ ๋งŒ๋“ค์–ด ์ฃผ์…”์„œ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

        • ํ˜ธ๋ˆ…์Šค
          ์ง€์‹๊ณต์œ ์ž

          ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ๊ณต์†๋‹˜. ํ›Œ๋ฅญํ•œ ๊ฐœ๋ฐœ์ž ๋˜์„ธ์š”!

      • Josh

        โˆ™

        ์ˆ˜๊ฐ•ํ‰ 3

        โˆ™

        ํ‰๊ท  ํ‰์  5.0

        5

        69% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

        ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ๊ธฐ๋ณธ๊ธฐ๋ฅผ ๋‹ค์งˆ ์ˆ˜ ์žˆ๋Š” ์ข‹์€ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค. ๊ฐ€๋” ๊ฐ•์‚ฌ๋‹˜์ด ์‹ค์ˆ˜ํ•˜์‹œ๋Š” ๊ฒŒ ์ธ๊ฐ„๋ฏธ๊ฐ€ ๋А๊ปด์ง‘๋‹ˆ๋‹ค.

        • 7d9fbah1mz

          โˆ™

          ์ˆ˜๊ฐ•ํ‰ 12

          โˆ™

          ํ‰๊ท  ํ‰์  4.8

          5

          100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

          ์‰ฝ๊ฒŒ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ๋ฐฐ์šธ ์ˆ˜์žˆ๋Š” ์ข‹์€ ์„ ํƒ์ด์—ˆ์Šต๋‹ˆ๋‹ค.

          ํ˜ธ๋ˆ…์Šค๋‹˜์˜ ๋‹ค๋ฅธ ๊ฐ•์˜

          ์ง€์‹๊ณต์œ ์ž๋‹˜์˜ ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

          ๋น„์Šทํ•œ ๊ฐ•์˜

          ๊ฐ™์€ ๋ถ„์•ผ์˜ ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

          ๋ฌด๋ฃŒ