์๋ฐ์คํฌ๋ฆฝํธ, ๊ธฐ์ด๋ถํฐ ES6๊น์ง! ์ ๋๋ก ๋ฐฐ์ ์๋ฒฝํ๊ฒ ํ์ฉํด๋ณด์ธ์โจ
What is JavaScript?
๊ฐ์ฒด ๊ธฐ๋ฐ ์คํฌ๋ฆฝํธ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด, ์๋ฐ์คํฌ๋ฆฝํธ ๋ก ๋ค์ํ ๋ถ์ผ์ ํ๋ก๊ทธ๋๋ฐ์ ํ ์ ์์ด์.
์๋ฐ์คํฌ๋ฆฝํธ๋ ๊ฐ์ฒด ๊ธฐ๋ฐ์ ์คํฌ๋ฆฝํธ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์์. ๋ชจ๋ ์น ๋ธ๋ผ์ฐ์ ์๋ ์ธํฐํ๋ฆฌํฐ๊ฐ ๋ด์ฅ๋์ด ์์ด์ ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์คํํ ์ ์์ด์. ์ฆ ์น ๋ธ๋ผ์ฐ์ ๊ฐ ํ์ฌ๋ ๋ชจ๋ ๊ธฐ๊ธฐ์์ ์๋ฐ์คํฌ๋ฆฝํธ๋ก ๊ตฌํํ ํ๋ก๊ทธ๋จ์ ์คํ์ํฌ ์ ์๊ฒ ๋๋ ๊ฑฐ์์.
์๋ฐ์คํฌ๋ฆฝํธ, ์ ๋ฐฐ์์ผ ํ ๊น์?
์๋ฐ์คํฌ๋ฆฝํธ๋ก ํ ์ ์๋ ๋ค์ํ ๊ฐ๋ฐ ๋ถ์ผ
Node.js๊ฐ ๋์ค๋ฉด์ ์๋ฐ์คํฌ๋ฆฝํธ๋ ๋์ด์ ์น ๋ธ๋ผ์ฐ์ ์ ์ข
์๋ ์ธ์ด๊ฐ ์๋๋๋ค. ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๋ฌผ๋ก ์ด๊ณ ๋ฐ์คํฌํฑ ์ ํ๋ฆฌ์ผ์ด์
, ๋ชจ๋ฐ์ผ ์ฑ, ํค์ค์คํฌ, ๊ฒ์, ์๋์ด๋
ธ ๊ฐ์ ๋ง์ดํฌ๋ก ์ปจํธ๋กค๋ฌ๊น์ง ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์ฌ์ฉํ ์ ์๋ ๋ถ์ผ๋ ์ ์ ๋ค์ํด์ง๊ณ ์์ด์.
JavaScript is Everywhere .
์๋ฐ์คํฌ๋ฆฝํธ ์ธ์ด ํ๋๋ฅผ ์ ์ตํ๋ ๊ฒ๋ง์ผ๋ก๋ ํ ์ ์๋ ๊ฒ ์ ์ ๋์ด๋๊ณ ์์ด์. ๊ทธ๋ฐ๋ฐ, ์ด ๋ง์ ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์์ ์ ์น ๋ธ๋ผ์ฐ์ ์์ HTML DOM์ ํธ๋ค๋งํ๋ ์ ๋์ ์์ค์ด ์๋ ์ข ๋ ๊ณ ์ฐจ์์ ์ธ ์ฝ๋ฉ์ ํด์ผ ํ๋ค๋ ๋ป์ด๊ธฐ๋ ํด์.
๊ทธ๋์, ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์ ๋๋ก ๋ฐฐ์ฐ๊ณ ์ ๋๋ก ์ฌ์ฉํ ์ ์์ด์ผ ํด์.
๊ธฐ์ด๋ถํฐ ์ ๋๋ก ๋ฐฐ์ฐ๋ ์๋ฐ์คํฌ๋ฆฝํธ.
์ด ๊ฐ์๋ ์๋ฐ์คํฌ๋ฆฝํธ ๊ธฐ์ด๋ฅผ ๋ค๋ฃน๋๋ค. ๊ทธ๋ ๋ค๋ฉด ๊ธฐ์ด ๋ผ๋ ๊ฒ์ ๋ฌด์์ผ๊น์? ํํ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์์ ๊ธฐ์ด๋ ๊ธฐ์ด ๋ฌธ๋ฒ์ ๋ฐฐ์ฐ๋ ๊ฑฐ๋ผ ์ฐฉ๊ฐ ์ ํ๋ ๊ฒฝ์ฐ๊ฐ ๋ง์์.
ํ๊ตญ์์๋ ์์ด๊ฐ ํ์ด๋๋ฉด 1์ด, ๊ทธ๋ฆฌ๊ณ ๊ฑด๋ฌผ ์ฒซ ์ธต์ 1์ธต์ด๋ผ๊ณ ํ์ฃ ? ๊ทธ๋ฐ๋ฐ ์ ๋ฝ์ ๊ฒฝ์ฐ๋ ๋ค๋ฆ
๋๋ค. ๋์ด๋ฅผ 0์ด, ๊ฑด๋ฌผ ์ธต์๋ 0์ธต๋ถํฐ ์ธ์ฃ . ๊ทธ๋ฆฌ๊ณ ์ฌ๋ฌ๋ถ์ด ๋ฐฐ์ฐ๊ณ ์๋ ๋ชจ๋ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์์๋ ๋ง์ฐฌ๊ฐ์ง๋ก ๋ฐฐ์ด(Array)์ ์์ ์ธ๋ฑ์ค(Index)๊ฐ 0๋ถํฐ ์์ํด์. ํ๊ตญ์์ 0์ ์๋ ๊ฒ์ผ๋ก ์ฌ๊ธฐ์ง๋ง, ์ ๋ฝ์์ 0์ ๋ชจ๋ ๊ฒ์ ์์์ ์ด์ ๊ธฐ๋ฐ(Base)์
๋๋ค.
์ฐ๋ฆฌ์๊ฒ๋ ์ด 0์ด ์ ์คํ ํ์ํด์. ์ฌ๋ฌ๋ถ์ด ์ข์ ๊ฐ๋ฐ์ ๊ฐ ๋๊ธฐ๋ฅผ ๋ฐ๋๋ค๋ฉด ์ ๋๋ก ์ด 0์ ๊ฐ๊ณผํด์๋ ์๋ผ์. ์ฌ๋ฌ๋ถ์ ์ด ๊ฐ์๋ฅผ ํตํด์ ์๋ฐ์คํฌ๋ฆฝํธ์ ๊ธฐ์ด๋ฅผ ๋ฐฐ์ฐ๊ฒ ๋ ๊ฑฐ์์.
๊ธฐ์ด๋ 0์ด๊ณ , ์์์ ์ด์ ๊ธฐ๋ฐ(Base) ์ด์์.
์ฌ๋ฌ๋ถ์ ์ด ๊ฐ์๋ฅผ ํตํด ์๋ฐ์คํฌ๋ฆฝํธ๋ผ๋ ์ธ์ด๋ฅผ ์ดํดํ๋ ์์์ ์ ์๊ฒ ๋ฉ๋๋ค. ์ฌ๋ฌ๋ถ์ด ์์ผ๋ก ์๋ฐ์คํฌ๋ฆฝํธ๋ก ๊ตฌํํ๊ฒ ๋ ์๋ง์ ์ ํ๋ฆฌ์ผ์ด์
์์ ๋น๋นํ ๋ง์ฃผํ ์ ์๊ฒ ๋ ๊ฑฐ์์.
์ด ๊ฐ์์ ํน์ง!
์ฝ๊ณ ์์ธํ๊ฒ
์ค๋ฌด ์์ฉ ์ค์ฌ
์์ ์ฝ๋๊น์ง!
์๋ฐ์คํฌ๋ฆฝํธ์ ๊ธฐ๋ณธ ๋ฌธ๋ฒ์ ์ฐจ๊ทผ์ฐจ๊ทผ ์๋ ค๋๋ ค์.
์๋ฐ์คํฌ๋ฆฝํธ ๋ด์ฅ ํจ์์ ๊ธฐ๋ฅ๋ฟ๋ง ์๋๋ผ, ์ค์ ๊ฐ๋ฐ ์ค๋ฌด์์ ์ด๋ป๊ฒ ์ ์ฉ๋๋์ง ์๋ ค๋๋ ค์.
๊ธฐ๋ฅ ์ค์ฌ์ ๊ฐ์๊ฐ ์๋๋ผ, ์ฉ๋ ์ค์ฌ์ผ๋ก ์งํ๋ผ ์ ํํ ์ฌ์ฉ๋ฒ์ ์ตํ ์ ์์ด์.
๋ชจ๋ ์์ ์ฝ๋๋ ๊นํ๋ธ๋ฅผ ํตํด ์ ๊ณต๋ฉ๋๋ค.
์ด๋ฏธ์ง๋ฅผ ํด๋ฆญํ๋ฉด ๊นํ๋ธ ๋ก ์ด๋ํฉ๋๋ค.
๋ฌด์์ ๋ฐฐ์ฐ๋์?
๊ฐ๋ฐ IDE ํด๋ก๋ ๋น์ฃผ์ผ์คํ๋์ค์ฝ๋(Visual Studio Code)๋ฅผ ์ฌ์ฉํฉ๋๋ค. ๋น์ฃผ์ผ์คํ๋์ค์ฝ๋๋ฅผ ์ด์ฉํ ๊ฐ๋ฐ ๋ฐฉ๋ฒ ๋ฐ ์ ์ฉํ ํ์ฅ ํ๋ก๊ทธ๋จ์ ์๊ฒ ๋ฉ๋๋ค.
์๋ฐ์คํฌ๋ฆฝํธ์ ๊ธฐ์ด ๋ฌธ๋ฒ์ ๋ํด ํ์คํ ์ดํดํ๊ฒ ๋ฉ๋๋ค.
์๋ฐ์คํฌ๋ฆฝํธ ๊ฐ๋ฐ์๊ฐ ๊ผญ ์์์ผ ํ ES6 ๋ฌธ๋ฒ๊น์ง ์ตํ ์ ์์ด์.
HTML DOM์ ํธ๋ค๋งํ๊ธฐ ์ํ ์๋ฐ์คํฌ๋ฆฝํธ ์ฌ์ฉ๋ฒ์ ์ ์ ์์ต๋๋ค.
์ ์ ์ง์์ ํ์ธํ์ธ์!
HTML์ ๋ํ ๊ธฐ๋ณธ ์ง์์ด ์์ด์ผ ํด์.
CSS๋ฅผ ์์์ผ ํด์. ์์ฃผ ์กฐ๊ธ.
์ด ๊ฐ์๋ฅผ ๋ง๋ ์ฌ๋์ ๋๊ตฌ์ผ๊น์?
์ํํธ์จ์ด ๊ธฐ์ ์ ํตํด ์ธ์์ ์ ํ ์ํฅ๋ ฅ์ ์ฃผ๊ณ ์ถ์ 22๋
์ฐจ ์ํํธ์จ์ด ๊ฐ๋ฐ์ . ์ง์์ ๋๋๋ ๊ฒ์ ์ข์ํ๊ณ , ํญ์ ์๋ก์ด ๊ธฐ์ ์ ์ตํ๋ ๊ฒ์ ์ฆ๊ฒจ์.
๊ตญ๋ด์ธ 60๊ฐ๊ฐ ๋๋ ๊ธ๋ก๋ฒ ๊ธฐ์
ERP ์์คํ
์ ๊ตฌ์ถํ๋ ์ปจ์คํดํธ ๋ฐ ๊ฐ๋ฐ์๋ก ํ๋ํ์๊ณ , ์ง์ ๊ฐ๋ฐํ ์ํํธ์จ์ด๋ฅผ ๊ตญ๋ด๋ ๋ฌผ๋ก ํด์ธ ์ ์์ ๊ธฐ์
์ ํ๋งค๋ฅผ ํ ๊ฒฝํ ๋ํ ๊ฐ์ง๊ณ ์์ด์. IT ์คํํธ์
๋ํ์ด์ฌ์ด๊ธฐ๋ ํด์.
๊ฐ๋ฐ์๋ฟ๋ง ์๋๋ผ UX ์ปจ์คํดํธ๋ก, ๋๋ก๋ ๋น์ฆ๋์ค ์ปจ์คํดํธ๋ก ์ผํ๋ฉด์ ์ ํ๋ฆฌ์ผ์ด์
๊ณผ ์๋น์ค ๊ฐ๋ฐ ์ ๊ธฐํ์์ ๊ฐ๋ฐ๊น์ง ์ ๊ณผ์ ์ ๋ํ ์๋ง์ ๊ฒฝํ์ ์์์ต๋๋ค. ์ด์ ๋ 20๋
์ด ๋๋ ์ค๋ฌด ๊ฒฝํ์ ๋ฐํ์ผ๋ก ํ๋ฐฐ๋ค์๊ฒ ์ ๋ง ํ์ํ ๊ธฐ์ , ์ ๋ง ์ ๋๋ก ๋ ์ง์์ ์ ๋ฌํ๋ ์ฌ๋ช
๊ฐ์ ๊ฐ๊ณ ์ง์์ ๋๋๋ ์ผ์ ํ๊ณ ์์ด์.
VIDEO
โ๊ฐ๋ฐ์์ํ๊ฒฉโ ์ ํ๋ธ ์ฑ๋์ ๊ณต๊ฐ๋ โํ์๊ฐ๋ง์ ๋๋ด๋ ์๋ฐ์คํฌ๋ฆฝํธ ์
๋ฌธโ ๊ฐ์์
๋๋ค.
์๋ฐ์คํฌ๋ฆฝํธ๋ผ๋ ์ต๊ณ ์ ์ธ์ด๋ฅผ ๋ง๋๋ณด์ธ์.
์ ๋ ์ง๊ธ ์ ๊ฐ ๊ฐ์ฅ ์ฌ๋ํ๋ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์ธ ์๋ฐ์คํฌ๋ฆฝํธ์ ๋ํ ๊ฐ์๋ฅผ ํ ์ ์์ด์ ๊ฐ์ฅ ํ๋ณตํ ์๊ฐ์ ๋ง์ฃผํ๊ณ ์์ด์.
์ด ๊ฐ์๋ฅผ ํตํด์ ์ฌ๋ฌ๋ถ๋ ์๋ฐ์คํฌ๋ฆฝํธ๋ผ๋ ์ต๊ณ ์ ์ธ์ด ๋ฅผ ์ฌ๋ํ๊ฒ ๋ ์ ์๊ธฐ๋ฅผ ๋ฐ๋๋๋ค. ๐
๋ค๋ฅธ ๊ฐ์ ํจ๊ป ๋ณด๊ธฐ