๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
Udemy

[์Šคํƒ€ํŠธ ์œ„๋“œ ์œ ๋ฐ๋ฏธ] - ์ฑŒ๋ฆฐ์ € ์„ ๋ฐœ & ์ˆ˜๊ฐ•์‹œ์ž‘

by vividmin 2022. 5. 6.
320x100

* ์ด ํฌ์ŠคํŒ…์€ ์Šคํƒ€ํŠธ ์œ„๋“œ ์œ ๋ฐ๋ฏธ(Start with Udemy) ์ฑŒ๋ฆฐ์ €๋กœ์จ ๊ฐ•์˜๋ฅผ ์ˆ˜๊ฐ•ํ•˜๋ฉฐ ์ž‘์„ฑํ•˜๋Š” ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค.๐Ÿ˜Š *

 

 

์Šคํƒ€ํŠธ ์œ„๋“œ ์œ ๋ฐ๋ฏธ ์ฑŒ๋ฆฐ์ง€ โ“

์–‘์งˆ์˜ ๊ฐ•์˜๊ฐ€ ๋งŽ๊ธฐ๋กœ ์œ ๋ช…ํ•œ ์œ ๋ฐ๋ฏธ์—์„œ 5/8์ผ๊นŒ์ง€ ์ง„ํ–‰ํ•˜๋Š” ์ด๋ฒคํŠธ๋กœ ๋ฌด๋ฃŒ๋กœ ๊ฐœ๋ฐœ / ๋ฐ์ดํ„ฐ ๊ฐ•์˜๋ฅผ ๋“ค์œผ๋ฉด์„œ ๋ฏธ์…˜์„ ์ˆ˜ํ–‰ํ•˜๋ฉด ๊ฒฝํ’ˆ๊นŒ์ง€ ์ฃผ๋Š” ํ˜œํƒ์ด ๋„˜์น˜๋Š” ์ด๋ฒคํŠธ์ด๋‹ค.
๊ฐ•์˜ ๋“ฃ๋Š” ๊ฒƒ์„ ์ข‹์•„ํ•˜์ง€๋งŒ, ๋ฏธ์…˜์ด ์—†์œผ๋ฉด ๊พธ์ค€ํžˆ ๋“ฃ๊ธฐ ์–ด๋ ค์šด ๋‚˜ ๊ฐ™์€ ์‚ฌ๋žŒ์—๊ฒŒ ๋งค์šฐ ์ข‹์€ ๊ธฐํšŒ์ธ๋ฐ, ๋…ธ๋งˆ๋“œ์ฝ”๋” ์ฑŒ๋ฆฐ์ง€์— ์ค‘๋…๋œ ๋‚˜๋Š” ๋˜ ํ•˜๋‚˜์˜ ์ฑŒ๋ฆฐ์ง€๋ฅผ ์‹ ์ฒญํ•˜๊ณ  ๋ง์•˜๋‹ค.
์ •๋ง ๋‹น์ฒจ์ด ๋˜๋ ค๋‚˜ ๊ฑฑ์ •ํ–ˆ๋Š”๋ฐ ๋‹คํ–‰ํžˆ๋„ ์˜ค๋Š˜ ์Šคํƒ€ํŠธ ์œ„๋“œ ์œ ๋ฐ๋ฏธ ์„ ์ •๋ฌธ์ž๊ฐ€ ์™€์„œ ๊ธฐ์œ ๋งˆ์Œ์œผ๋กœ ์ฑŒ๋ฆฐ์ง€๋ฅผ ์‹œ์ž‘ํ•˜๋ ค๊ณ  ํ•œ๋‹ค.

5/8์ผ๊นŒ์ง€ ๋ชจ์ง‘์ค‘์ด๋‹ˆ ํ˜น์‹œ ํ•„์š”ํ•œ ์‚ฌ๋žŒ์€ ์—ฌ๊ธฐ ๋งํฌ๋กœ ๋“ค์–ด๊ฐ€ ์กฐ๊ฑด์— ๋งž์ถ”์–ด ์‹ ์ฒญํ•˜๋ฉด ๋œ๋‹ค!

 

 

์ฑŒ๋ฆฐ์ง€ ์‹œ์ž‘!๐Ÿƒโ€โ™€๏ธ

๋‚ด๊ฐ€ ์„ ํƒํ•œ ๊ฐ•์˜๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์•Œ๊ณ ๋ฆฌ์ฆ˜ & ์ž๋ฃŒ๊ตฌ์กฐ ๋งˆ์Šคํ„ฐ ํด๋ž˜์Šค์ด๋‹ค.  
ํ‰์†Œ์— ์•Œ๊ณ ๋ฆฌ์ฆ˜ ๊ณต๋ถ€๋ฅผ ํ•ด๋ณด๊ณ  ์‹ถ๊ธด ํ•œ๋ฐ ๋ญ๋ถ€ํ„ฐ ํ•ด์•ผ ํ• ์ง€ ๋ง‰๋ง‰ํ•œ ์ƒํƒœ์ด๊ธฐ๋„ ํ–ˆ๊ณ , ํ”„๋ก ํŠธ ๊ฐœ๋ฐœ ์ชฝ์€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ํ…Œ์ŠคํŠธ๋ฅผ ๋ณด๋Š” ๊ณณ๋„ ๋งŽ์•„์„œ ๊ณ ๋ฏผํ•˜๋˜ ์ค‘์— ์ € ๊ฐ•์˜๋ฅผ ๋ณด๊ณ  ๋ฐ”๋กœ ์‹ ์ฒญํ–ˆ๋‹ค!

์•Œ๊ณ ๋ฆฌ์ฆ˜๊ณผ ์ž๋ฃŒ๊ตฌ์กฐ์— ๋Œ€ํ•œ ๋‚ด์šฉ๋“ค์„ JavaScript๋กœ ์•Œ๋ ค์ฃผ๋Š” ๊ฐ•์˜์ด๊ณ , ๊ธฐ๋ณธ์  ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋ฌธ๋ฒ• ์ง€์‹๋งŒ ์žˆ์œผ๋ฉด ์ˆ˜๊ฐ•์ด ๊ฐ€๋Šฅํ•˜๋‹ค๊ณ  ํ•œ๋‹ค.

์œ ๋ฐ๋ฏธ๊ฐ€ ์˜์–ด๊ฐ•์˜๋ผ์„œ ๊ฑฑ์ •ํ–ˆ๋Š”๋ฐ, ์ด ๊ฐ•์˜๋Š” ํ•œ๊ตญ์–ด์ž๋ง‰์ด ๊ฐ™์ด ํฌํ•จ๋˜์–ด์žˆ์–ด์„œ ๊ฐ•์˜๋ฅผ ์ˆ˜๊ฐ•ํ•˜๋Š”๋ฐ ํฌ๊ฒŒ ์–ด๋ ค์›€์€ ์—†์„ ๊ฒƒ ๊ฐ™๋‹ค. ์•ฝ๊ฐ„ ๋ฒˆ์—ญ์ฒด ๊ฐ™๊ธด ํ•œ๋ฐ ๋“ค์–ด๋ณด๋‹ˆ ์ดํ•ด๊ฐ€ ์ž˜ ๋œ๋‹ค!

์˜ค๋Š˜์€ ์ฒซ ๋‚ ์ด๋‹ˆ๊นŒ ๊ฐ„๋‹จํ•˜๊ฒŒ ์ปค๋ฆฌํ˜๋Ÿผ๊ณผ ์ฝ”๋“œ ์‹คํ–‰๋ฒ•์— ๋Œ€ํ•œ ์˜ค๋ฆฌ์—”ํ…Œ์ด์…˜ ์ •๋„๋งŒ ์ˆ˜๊ฐ•ํ–ˆ๋‹ค.

 

โœ๐Ÿป ๋ฐฐ์šด ๋‚ด์šฉ

์˜ค๋Š˜์€ ์•ž์œผ๋กœ ์–ด๋–ค ๋‚ด์šฉ์„ ๋ฐฐ์šธ์ง€์— ๋Œ€ํ•œ ๋‚ด์šฉ๊ณผ, ๊ฐ•์˜ ์ˆ˜๊ฐ• ๋ฐฉ๋ฒ•, ๊ฐ•์˜ ๋“ค์„ ๋•Œ ์ฝ”๋“œ ์ž‘์„ฑ๋ฐฉ๋ฒ•์— ๋Œ€ํ•œ ๋‚ด์šฉ๋ฟ์ด๋ผ์„œ ๊ฐœ๋…์ ์œผ๋กœ ๋ฐฐ์šด ๊ฒƒ์€ ์—†์ง€๋งŒ ์‹œ์ž‘์ด ๋ฐ˜์ด๋ผ๋Š” ๋ง์ด ์žˆ๋“ฏ์ด ์˜ค๋Š˜ ์ƒˆ๋กญ๊ฒŒ ์•Œ๊ฒŒ ๋œ ๋‚ด์šฉ์— ๋Œ€ํ•ด ์ •๋ฆฌํ•ด ๋ณด๋ ค๊ณ  ํ•œ๋‹ค.

1. ์ „์ฒด์ ์ธ ์ปค๋ฆฌํ˜๋Ÿผ

์ฒ˜์Œ ์ˆ˜๊ฐ•ํ•˜๊ฒŒ ๋  ๋ถ€๋ถ„์€ ๋น… Oํ‘œ๊ธฐ๋ฒ•์ธ๋ฐ, ๊ธฐ์ดˆ๊ฐ€ ๋˜๋Š” ๋‚ด์šฉ์ธ ๋™์‹œ์— ๊ฐ•์˜ ๋๊นŒ์ง€ ๊ณ„์† ์“ฐ์ด๋Š” ์ค‘์š”ํ•œ ๊ฐœ๋…์ด๋ผ๊ณ  ํ•œ๋‹ค. ๋น… O๋Š” ์ฝ”๋“œ์˜ ์„ฑ๋Šฅ๊ณผ ์ฝ”๋“œ์˜ ํšจ์œจ์„ฑ์„ ์„ค๋ช…ํ•ด์ฃผ๋Š” ๋ฐฉ๋ฒ•์ด๋‹ค.
๊ทธ๋‹ค์Œ์€ ๋น… O ํ‘œ๊ธฐ๋ฒ•์—์„œ ๋ฐฐ์šด ๋‚ด์šฉ์„ ๋ฐ”ํƒ•์œผ๋กœ array์™€ object์˜ ์„ฑ๋Šฅ์„ ํ‰๊ฐ€ํ•ด๋ณด๋Š” ์‹œ๊ฐ„์„ ๊ฐ€์ง„ ๋’ค, ์•Œ๊ณ ๋ฆฌ์ฆ˜ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๋Š” ๊ณผ์ œ์— ๋„์ „ํ•˜๊ฒŒ ๋œ๋‹ค.

๊ทธ ํ›„ '์žฌ๊ท€'ํŒŒํŠธ์— ๋“ค์–ด๊ฐ€๊ฒŒ ๋˜๋Š”๋ฐ, ์ด ํŒŒํŠธ๊ฐ€ ์ „์ฒด ๊ฐ•์˜์—์„œ ๊ฐ€์žฅ ์ค‘์š”ํ•œ ๋ถ€๋ถ„์ด๋ผ๊ณ  ํ•œ๋‹ค.

์žฌ๊ท€, ์žฌ๊ท€ ํƒ์ƒ‰์— ๋Œ€ํ•œ ๋‚ด์šฉ์„ ๋ฐฐ์šฐ๊ณ  ์ด๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ ๋‹ค์‹œ ์•Œ๊ณ ๋ฆฌ์ฆ˜ ๊ณผ์ œ๋ฅผ ์ˆ˜ํ–‰ํ•˜๊ฒŒ ๋œ๋‹ค.
๋‹ค์Œ ์ฑ•ํ„ฐ๋Š” ์—ฌ๋Ÿฌ ๊ฐ€์ง€ ์ •๋ ฌ(๋ฒ„๋ธ”, ์„ ํƒ, ์‚ฝ์ž… ๋“ฑ๋“ฑ)์— ๋Œ€ํ•œ ๋‚ด์šฉ์„ ๋ฐฐ์šฐ๊ณ , Stack, Que, Graph ๋“ฑ์˜ ๋‚ด์šฉ๊นŒ์ง€ ๋ฐฐ์šฐ๊ฒŒ ๋˜๋ฉด ๋ชจ๋“  ๊ฐ•์˜๊ฐ€ ๋๋‚˜๊ฒŒ ๋œ๋‹ค.

2. ๊ฐ•์˜ ์ˆ˜๊ฐ• ์ˆœ์„œ์™€ ์ฃผ์˜ํ•  ์ 

์•Œ๊ณ ๋ฆฌ์ฆ˜์„ ์•Œ๊ณ  ์žˆ๋‹ค๋ฉด ์›ํ•˜๋Š” ๋ถ€๋ถ„๋งŒ ๋“ค์–ด๋„ ์ข‹์ง€๋งŒ, ์ž˜ ๋ชจ๋ฅด๋Š” ์‚ฌ๋žŒ์ด๋ผ๋ฉด ๊ฐ•์˜์— ๋‚˜์™€์žˆ๋Š” ์ˆœ์„œ๋Œ€๋กœ ๋“ฃ๋Š” ๊ฒƒ์ด ์ข‹๋‹ค๊ณ  ํ•œ๋‹ค. ๊ทธ๋ฆฌ๊ณ  ๋งค์šฐ ๋งŽ์€ ๋‚ด์šฉ์„ ๋‹ด๊ณ  ์žˆ์–ด์„œ 3์ฃผ ์ •๋„๋ฅผ ์™„๊ฐ• ๋ชฉํ‘œ๋กœ ํ•˜์ง€๋งŒ ์ฒœ์ฒœํžˆ ์ดํ•ดํ•˜๋ฉด์„œ ๋“ฃ๋Š” ๊ฒƒ์ด ์ค‘์š”ํ•˜๋‹ค๊ณ  ํ•ด์„œ ๋‚˜๋„ ๊ทธ๋ ‡๊ฒŒ ํ•ด ๋ณผ ์ƒ๊ฐ์ด๋‹ค.

3. ์ˆ˜๊ฐ• ์‹œ ์ฝ”๋“œ ์ž‘์„ฑ๋ฐฉ๋ฒ•

Chrome์— ์ด๋ฏธ JavaScript๊ฐ€ ํฌํ•จ๋˜์–ด ์žˆ์œผ๋ฏ€๋กœ ๊ฐœ๋ฐœ์ž ๋„๊ตฌ๋ฅผ ์‚ฌ์šฉํ•ด์„œ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•œ๋‹ค๊ณ  ํ–ˆ์„ ๋•Œ๊นŒ์ง€๋งŒ ํ•ด๋„ ๋‹น์—ฐํžˆ Console ์ฐฝ์—์„œ ํ•˜๋Š” ๊ฒƒ์ธ ์ค„๋กœ๋งŒ ์•Œ์•˜๋‹ค.
๊ทธ๋Ÿฐ๋ฐ ํŠน์ดํ•˜๊ฒŒ Source ํƒญ์— Snippet์„ ์ด์šฉํ•˜์—ฌ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ–ˆ๋‹ค.๐Ÿ˜ฑ

Source ํƒญ์€ ์ด๋ฏธ ์ž‘์„ฑ๋œ ์ฝ”๋“œ๋ฅผ ํ™•์ธํ•  ๋•Œ๋งŒ ์‚ฌ์šฉํ–ˆ๋Š”๋ฐ, ์ƒˆ๋กœ์šด ๊ฒฝํ—˜์ด ๋  ๊ฒƒ ๊ฐ™๋‹ค.

 

Source ํƒญ์—์„œ >> ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๊ณ  Snippets์„ ํด๋ฆญํ•˜๋ฉด ์•„๋ž˜์™€ ๊ฐ™์€ ์ฐฝ์— ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋‹ค.
๊ทธ ํ›„ New snippet์„ ๋ˆ„๋ฅด๊ณ  ์ƒˆ ํŒŒ์ผ์„ ๋งŒ๋“ค์–ด ์ค€๋‹ค.

 

ํŒŒ์ผ์„ ๋งŒ๋“ค๊ณ  ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•œ ๋’ค window๊ธฐ์ค€์œผ๋กœ ctrl + enter๋ฅผ ํด๋ฆญํ•˜๋ฉด ์•„๋ž˜์˜ ์ฝ˜์†” ์ฐฝ์— ๊ฒฐ๊ณผ๊ฐ€ ๋‚˜ํƒ€๋‚œ๋‹ค.
๊ผญ ์ด ๋ฐฉ์‹์ด ์•„๋‹ˆ๋ผ ๋‹ค๋ฅธ ๋ฐฉ๋ฒ•์œผ๋กœ ํ•ด๋„ ๋œ๋‹ค๊ณ  ๊ฐ•์˜์— ๋‚˜์˜ค์ง€๋งŒ, ์–ด๋””์—์„œ๋‚˜ ํฌ๋กฌ๋งŒ ์žˆ์œผ๋ฉด ๋ณ„๋„์˜ ํ”„๋กœ๊ทธ๋žจ ์—†์ด ์ž‘๋™ ๊ฐ€๋Šฅํ•˜๊ณ , ๊ฐœ๋ฐœ์ž ๋„๊ตฌ๋ฅผ ๊ป๋‹ค๊ฐ€ ์ผœ๋„ ํŒŒ์ผ์ด ๊ทธ๋Œ€๋กœ ์œ ์ง€๋ผ์„œ ์•ž์œผ๋กœ ํฌ๊ฒŒ ๋ถˆํŽธํ•˜์ง€ ์•Š๋‹ค๋ฉด ์ด ๋ฐฉ๋ฒ•์œผ๋กœ ์ˆ˜๊ฐ•ํ•ด ๋ณด๋ ค๊ณ  ํ•œ๋‹ค.

์ฑŒ๋ฆฐ์ง€๋Š” 2์ฃผ์ง€๋งŒ, ์ฑŒ๋ฆฐ์ง€๊ฐ€ ๋๋‚˜๋”๋ผ๋„ ์ด ๊ฐ•์˜๋ฅผ ์™„๊ฐ•ํ•ด์„œ ์•Œ๊ณ ๋ฆฌ์ฆ˜๊ณผ ์ž๋ฃŒ๊ตฌ์กฐ๋ฅผ ๋งˆ์Šคํ„ฐํ•ด์•ผ๊ฒ ๋‹ค.
๋‹ค์‹œ ํ•œ๋ฒˆ ์ด๋Ÿฐ ๊ธฐํšŒ๋ฅผ ๊ฐ–๊ฒŒ ํ•ด ์ค€ Udemy์—๊ฒŒ ๊ฐ์‚ฌํ•˜๋ฉด์„œ ์˜ค๋Š˜ ํฌ์ŠคํŒ…์„ ๋งˆ์นœ๋‹ค.

 

๋ฐ˜์‘ํ˜•

๋Œ“๊ธ€