๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
Book TIL

๋…ธ๋งˆ๋“œ์ฝ”๋” ๋ถํด๋Ÿฝ ์žกํ•™์‚ฌ์ „ Day03 - ๊ฐœ๋ฐœ์ž์™€ ์˜ค๋ฅ˜ | ์ฝ”ํ‹€๋ฆฐ์˜ ํŠน์ง•

by vividmin 2023. 1. 16.
320x100

๋…ธ๋งˆ๋“œ์ฝ”๋” ๋ถํด๋Ÿฝ day03

 

 

๐Ÿ“š ๋ฒ”์œ„ :  Ep06. ๋‚˜์—๊ฒŒ๋งŒ ์˜ค๋ฅ˜๊ฐ€ ์ƒ๊ธฐ๋Š” ์ด์œ  - Ep10. ์ฝ”ํ‹€๋ฆฐ๊ณผ ์ž๋ฐ” ํ˜ธํ™˜ 

 

 

 

๐Ÿ““ ์ฑ…์—์„œ ๊ธฐ์–ตํ•˜๊ณ  ์‹ถ์€ ๋‚ด์šฉ์„ ์จ๋ณด์„ธ์š”.


  • ์ฝ”๋”ฉ ์ค‘ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์„ ๋•Œ ๋ฐ”๋กœ ๊ฒ€์ƒ‰ํ•ด ๋ณด๊ธฐ๋ณด๋‹ค๋Š” ๋‚ด๊ฐ€ ์ž‘์„ฑํ•œ ์ฝ”๋“œ๋กœ ์ธํ•ด ์˜ค๋ฅ˜๊ฐ€ ์ƒ๊ฒผ๋‹ค๋Š” ์‚ฌ์‹ค์„ ์ธ์ง€ํ•˜๊ณ , ์ฒœ์ฒœํžˆ ์—๋Ÿฌ ๋ฉ”์‹œ์ง€๋ถ€ํ„ฐ ์ฝ์–ด๋ณด๋Š” ์Šต๊ด€์„ ๊ฐ€์ง€์ž.
  • ์‹ค์ˆ˜๋Š” ๋ˆ„๊ตฌ๋‚˜ ํ•  ์ˆ˜ ์žˆ์ง€๋งŒ ์„ฑ์žฅํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” ์‹ค์ˆ˜๋ฅผ ๊ทธ๋ƒฅ ๋„˜๊ธฐ์ง€ ๋ง๊ณ  ์งš๊ณ  ๋„˜์–ด๊ฐ€์•ผํ•œ๋‹ค.
  • ๊ณต๋ถ€๋งŒ ํ•˜๊ณ  ์•„๋ฌด๊ฒƒ๋„ ๋งŒ๋“ค์–ด๋ณด์ง€ ์•Š๋Š” ๊ฒƒ์€ ์•„์ฃผ ๋‚˜์œ ์Šต๊ด€์ด๋‹ค. ๋ฐฐ์šด ๊ฒƒ์„ ๋‚ด ๊ฒƒ์œผ๋กœ ๋งŒ๋“ค๊ธฐ ์œ„ํ•ด์„œ๋Š” ๊ณ„์‚ฐ๊ธฐ, ๋ฏธ๋‹ˆ๊ฒŒ์ž„ ๋“ฑ ๊ฐ„๋‹จํ•œ ๊ฑฐ๋ผ๋„ ๋ฌด์กฐ๊ฑด ๋งŒ๋“ค์–ด๋ณด์ž! ์ฆ‰ ์ฝ”๋”ฉ์‹ค์Šต์„ ๊ผญ ํ•ด์•ผ ํ•œ๋‹ค.
  • ๋ฌด์—‡์ธ๊ฐ€๋ฅผ ๋งŒ๋“ค ๋•Œ '๋‚˜๋Š” ์•„์ง ๊ทธ๋Ÿฐ ๊ฑธ ๋งŒ๋“ค ์‹ค๋ ฅ์ด ์•ˆ๋ผ' ๊ฐ™์€ ์ƒ๊ฐ์€ ํ•˜์ง€ ๋ง์ž. ๋ญ๋“ ์ง€ ๋งŒ๋“ค์–ด ๋ณด๋ฉด์„œ ์ž์‹ ์˜ ์‹ค๋ ฅ์„ ํŒŒ์•…ํ•ด์•ผ ํ•œ๋‹ค. ๊ฐ•์˜ ์ฝœ๋ ‰ํ„ฐ๊ฐ€ ๋˜์ง€ ๋ง์ž!
  • StackOverFlow์˜ survey๋ฅผ ๋ณด๋ฉด ๊ฐ€์žฅ ์ธ๊ธฐ ์žˆ๋Š” ๊ธฐ์ˆ ์„ ํ™•์ธ ๊ฐ€๋Šฅํ•˜๋‹ค. (2022๋…„์˜ ๊ฐ€์žฅ ์ธ๊ธฐ ์žˆ๋Š” ๊ธฐ์ˆ )
  • ํŒŒ์ด์ฌ์˜ ์ธ๊ธฐ๊ฐ€ ๋†’์•„์ง€๊ณ  ์žˆ๊ณ , ํŒŒ์ด์ฌ์€ ์ปค๋ฎค๋‹ˆํ‹ฐ๊ฐ€ ๋งค์šฐ ํฌ๋ฉฐ ์—…๋ฌด ์ž๋™ํ™”์— ๊ฐ€์žฅ ์ž˜ ๋งž๋Š” ์–ธ์–ด์ด๋‹ค.
  • ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด์˜ ์†๋„๋Š” ๋ชจ๋‘ ๊ฐ™์ง€ ์•Š๋‹ค.
    • ํŒŒ์ด์ฌ < C์–ธ์–ด
    • Interpreted Language : ๋™์‹œํ†ต์—ญ ๋Š๋‚Œ, ์‹ค์‹œ๊ฐ„์œผ๋กœ ์ฝ”๋“œ๋ฅผ ๋ฒˆ์—ญ, ์˜ค๋ฅ˜๋ฅผ ์ œ๋•Œ ์•Œ๊ธฐ ์–ด๋ ต๋‹ค.
    • Compiled Language : ์ฑ…์„ ๋ฒˆ์—ญํ•˜๋Š” ๋Š๋‚Œ, ํ•œ๊บผ๋ฒˆ์— ์ฝ”๋“œ๋ฅผ ๋ฒˆ์—ญ
  • ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ํ•  ์ˆ˜ ์žˆ๋Š” ์ผ์€ ๋ฌด๊ถ๋ฌด์ง„ํ•˜๋‹ค.
    • 3D ๊ฐœ๋ฐœ : three.js
    • ํ•˜์ด๋ธŒ๋ฆฌ๋“œ ์•ฑ, ํฌ๋กœ์Šค ํ”Œ๋žซํผ ์•ฑ : Ionic, Reat Native
  • ์ž๋ฐ”์™€ ์ฝ”ํ‹€๋ฆฐ์€ 100% ํ˜ธํ™˜๊ฐ€๋Šฅํ•˜๋‹ค.
    • ์ฝ”ํ‹€๋ฆฐ์€ ์•ˆ๋“œ๋กœ์ด๋“œ ์•ฑ์„ ๊ฐœ๋ฐœํ•  ์ˆ˜๋„ ์žˆ๊ณ , javaScript๋กœ ์ปดํŒŒ์ผ๋„ ๊ฐ€๋Šฅํ•˜์—ฌ react๋‚˜ node.js์— ํ™œ์šฉ๋„ ๊ฐ€๋Šฅํ•˜๋‹ค. ๊ทธ ๋ฐ–์—๋„ ํ•œ ๋ฒˆ์— ๋งŽ์€ ๊ฒƒ์„ ํ•˜๊ฒŒ ํ•ด์ฃผ๋Š” coroutine๋„ ๊ฐ€๋Šฅํ•˜๋ฏ€๋กœ ์ž๋ฐ”๋ฅผ ์‚ฌ์šฉํ•  ์ค„ ์•„๋Š” ๊ฐœ๋ฐœ์ž์—๊ฒŒ๋Š” ๋ฌด์ฒ™ ๋งค๋ ฅ์ ์ธ ์–ธ์–ด์ผ ๊ฒƒ์ด๋‹ค.

 

 

 

โœ๐Ÿป ์˜ค๋Š˜ ์ฝ์€ ์†Œ๊ฐ์€? ๋– ์˜ค๋ฅด๋Š” ์ƒ๊ฐ์„ ๊ฐ€๋ณ๊ฒŒ ์ ์–ด๋ณด์„ธ์š”.


์ฝ”๋“œ์— ์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ•œ๋‹ค๋ฉด ๋ฌด์ž‘์ • ์—๋Ÿฌ ๋ฉ”์‹œ์ง€๋ฅผ ๋ณต์‚ฌํ•ด์„œ ๊ตฌ๊ธ€์— ๊ฒ€์ƒ‰ํ•˜๊ณค ํ–ˆ๋Š”๋ฐ, ์•ž์œผ๋กœ๋Š” ์—๋Ÿฌ๋ฉ”์‹œ์ง€๋ฅผ ๊ผผ๊ผผํžˆ ์ฝ๊ณ  ์ž‘์„ฑํ•œ ์ฝ”๋“œ ์ค‘ ์–ด๋””๊ฐ€ ํ‹€๋ ธ๋Š”์ง€๋ฅผ ๋จผ์ €ํ™•์ธํ•œ ํ›„, ๊ทธ๋ž˜๋„ ํ•ด๊ฒฐ์ด ์•ˆ ๋  ๋•Œ ๊ฒ€์ƒ‰ํ•ด ๋ด์•ผ๊ฒ ๋‹ค.

๊ทธ๋ฆฌ๊ณ  ๊ฐ•์˜ ์ฝœ๋ ‰ํ„ฐ๊ฐ€ ๋˜์ง€ ๋ง์•„์•ผ ํ•˜๋ฉฐ, ๋ฐฐ์šฐ๊ธฐ๋งŒ ํ•˜๊ณ  ์‹ค์Šตํ•˜์ง€ ์•Š๋Š” ๊ฑด ์•„์ฃผ ๋‚˜์œ ์Šต๊ด€์ด๋ผ๋Š” ๋Œ€๋ชฉ์— ์ •๊ณก์„ ์ฐ”๋ ธ๋‹ค. ๋ญ”๊ฐ€ ๋ถ€์กฑํ•จ์„ ๋Š๋‚„ ๋•Œ๋งˆ๋‹ค ๋ฌด์Šจ ๊ฐ•์˜๋ฅผ ๋” ๋“ค์–ด์•ผ ํ•˜์ง€?๋ผ๊ณ  ๋จผ์ € ์ƒ๊ฐํ•˜๋ฉฐ ๋น„์Šทํ•œ ๊ฐ•์˜๋“ค์„ ๊ฒฐ์ œํ•˜๊ณค ํ–ˆ๋‹ค. ์•ž์œผ๋กœ๋Š” ์ผ๋‹จ ๋ญ๋ผ๋„ ๋งŒ๋“ค์–ด๋ณด๋ฉด์„œ ๋‚ด ๊ฒƒ์œผ๋กœ ๋งŒ๋“œ๋Š” ์—ฐ์Šต์„ ์šฐ์„ ์ ์œผ๋กœ ํ•ด์•ผ๊ฒ ๋‹ค.

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

๊ทธ๋ฆฌ๊ณ  ๊ฐœ์ธ์ ์œผ๋กœ three.js์— ๋Œ€ํ•ด์„œ ๊ถ๊ธˆ์ฆ์ด ๋งŽ์•˜๋Š”๋ฐ ์ด๋ฒˆ ํŒŒํŠธ๋ฅผ ์ฝ์œผ๋ฉด์„œ ๋Œ€๋žต์ ์œผ๋กœ ์–ด๋–ค ๊ฒƒ์ธ์ง€ ๊ฐ์„ ์žก๊ฒŒ ๋˜์—ˆ๋‹ค. three.js๋กœ ๋งŒ๋“ค์–ด์ง„ ์‚ฌ์ดํŠธ๋ฅผ ๊ตฌ๊ฒฝํ–ˆ๋Š”๋ฐ ์ •๋ง ๋ฉ‹์กŒ๊ณ , ๋‚˜์ค‘์— ๋‚ด ํ”„๋กœ์ ํŠธ์—๋„ ์ ์šฉ์‹œ์ผœ๋ณด๊ณ  ์‹ถ๋‹ค.

 

three.js๋กœ ๋งŒ๋“ค์–ด์ง„ ์‚ฌ์ดํŠธ

 

 

 

๐Ÿ‘€ ๊ถ๊ธˆํ•œ ๋‚ด์šฉ์ด ์žˆ๊ฑฐ๋‚˜, ์ž˜ ์ดํ•ด๋˜์ง€ ์•Š๋Š” ๋‚ด์šฉ์ด ์žˆ๋‹ค๋ฉด ์ ์–ด๋ณด์„ธ์š”.


์ธํ„ฐํ”„๋ฆฌํ„ฐ ์–ธ์–ด์™€ ์ปดํŒŒ์ผ ์–ธ์–ด์˜ ์ฐจ์ด์ ์ด ์•„์ง ์ž˜ ์™€๋‹ฟ์ง€ ์•Š๋Š”๋‹ค. ๐Ÿ˜…

๊ทธ๋ฆฌ๊ณ  three.js๋กœ ๋œ ์‚ฌ์ดํŠธ๋ฅผ ์‹คํ–‰ํ•˜๋‹ˆ ๋‚ด ๋…ธํŠธ๋ถ์˜ ํŒฌ ๋Œ์•„๊ฐ€๋Š” ์†Œ๋ฆฌ๊ฐ€ ์—„์ฒญ ํฌ๊ฒŒ ๋‚˜๋Š” ๊ฑธ๋กœ ๋ณด์•„ ์ปดํ“จํ„ฐ์˜ ์„ฑ๋Šฅ์— ๋”ฐ๋ผ์„œ๋Š” 3Dํ”„๋กœ๊ทธ๋žจ์„ ๊ตฌ๋™ํ•˜๋Š” ๊ฒƒ์ด ๋ฒ„๊ฑฐ์šธ ์ˆ˜๋„ ์žˆ์„ ๊ฒƒ ๊ฐ™๋‹ค. ์ด๋Ÿฐ ์ ์„ ๊ณ ๋ คํ•˜์—ฌ ๊ฐ€๋ณ๊ฒŒ ๋งŒ๋“ค ์ˆ˜๋„ ์žˆ๋Š”์ง€ ๊ถ๊ธˆํ•˜๋‹ค.

๋ฐ˜์‘ํ˜•

๋Œ“๊ธ€