[JS] ์๋ฐ์คํฌ๋ฆฝํธ๋ก ์๋ฒ๋ฅผ ๋ง๋ค์ด...? (Node.js)
๐ ๋ด๊ฐ ๋ค์ ๊ฐ์
์ต๊ทผ ์ค์๊ฐ ๋ฌธ์ ํ์ ํด ํ๋ก์ ํธ๋ฅผ ๊ตฌํํด๋ณด๋ ค๊ณ ํ ์ ์ด ์์๋ค. ์ฌ๋ฌ ๊ธฐ์ ๋ค์ ์ฒ์ ์ ํด๋ณผ ์ ์์๋๋ฐ, Websocket ์ด๋ WebRTC, CRDT ์๊ณ ๋ฆฌ์ฆ ๋ฑ์ด๋ค. ๊ทธ์ค ์ ํ๋ฒ ๋ ธ๋ง๋์ฝ๋์ ๋ฌด๋ฃ ๊ฐ์ ์ค Websocket๊ณผ WebRTC๋ฅผ ํด๋ก ์ฝ๋ฉ ํด๋ณผ ์ ์๋ ์ปค๋ฆฌํ๋ผ์ด ์์ด์ ๋ค์ด๋ณด๋ ์ค์ด๋ค.
๐ ์ฒ์ ์ ํ Node.js
์์ฝ๊ฒ๋ ๋ด๊ฐ ์ฃผ๋ก ์ฌ์ฉํ๋ ์ธ์ด์ธ Java๋ Python์ด ์๋ JS๋ก ๋ด์ฉ์ด ์ด๋ฃจ์ด์ ธ ์์๋ค. ํนํ, JS๋ก ๋ฐฑ์๋๋ฅผ ๊ตฌํํ ์ ์๋ Node.js๋ฅผ ์ด์ฉํ๋๋ฐ, ํ๋ก ํธ์๋์์ ์ฐ๊ณ ์ฑ๋ฅ์ด ์ข์์ ์ค์๊ฐ ๊ธฐ๋ฅ์ ๊ตฌํํ๋๋ฐ ํฐ ์ฅ์ ์ด ์๋ค๊ณ ํ๋ค. node.js์ ์์ธํ ํน์ง์ https://hanamon.kr/nodejs-%EA%B0%9C%EB%85%90-%EC%9D%B4%ED%95%B4%ED%95%98%EA%B8%B0/ ํด๋น ์ฌ์ดํธ๋ฅผ ์ฐธ๊ณ ํ๋ฉด ์ข์ ๊ฒ ๊ฐ๋ค.
์ฌํํผ ๋ด๊ฐ ๋ณธ node.js๋ Spring์ ๋นํ๋ฉด ์ฌ์ฉ๋ฒ์ด ํฌ๊ฒ ์ด๋ ต์ง๋ ์์๋ค. ์ฝ๊ฐ Python์ Flask ๊ฐ์ ๋๋์ด๋๊น..? ํจํค์ง๋ฅผ ํตํด์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ๊ฐ์ ๊ธฐ๋ฅ์ ์์กด์ฑ์ ๊ด๋ฆฌํ๊ณ , nodemon์ ํตํด์ ํ๋ก์ธ์ค๋ฅผ ๊ด๋ฆฌํ๋ค. ๋, babel์ ํตํด์ es6 ์ดํ์ ๋ฌธ๋ฒ์ ์ง์ํ ์ ์๋๋ก ๊ด๋ฆฌํ๋ค. ๊ทธ ์ธ์๋ ํ์ผ ๊ตฌ์กฐ๋ ๋๋ถ๋ถ ๋น์ทํ๋ฌ๊น ํฐ ์ฐจ์ด๋ ์๋ค.
ํ๋ก ํธ์๋์ ๋ฐฑ์๋์ ์ธ์ด๊ฐ ๊ฐ์ ๋ ์ฅ์ ์ ํ๋์ ์ธ์ด๋ก ํ์คํ ๊ฐ๋ฐ์ ํ ์ ์๋ค๋ ๊ฒ์ด๋ค. ๋จ์ ์... ๊ฐ๋ ๋ด๊ฐ ๋ฐฑ์๋์์ ์์
ํ๋์ง, ํ๋ก ํธ์๋์์ ์์
ํ๋์ง ํท๊ฐ๋ฆด ์ ์๋๋ผ.. ใ
ใ
์๋ฐ ๋ถ๋ถ๋ค์ ์ ํ์ธํด์ผ ํ๋ค. ๋, JS์ ํน์ฑ์ ์ฝ๊ฐ์ ๊ตฌ๋ฌธ ์ค๋ฅ๊ฐ ์์ด๋ ๊ทธ๋๋ก ์คํ์์ผ ๋ฒ๋ฆฌ๋๋ฐ, ์ด๋ฒ์ ์์
ํ๋ฉด์ ์ด ๋ฐ์ ๋ถ๋ถ ์ค ํ๋๋ค.
JS๋ preventDefault()๋ผ๋ ๋ด์ฅ ํจ์๊ฐ ์๋ค. ๊ทผ๋ฐ ๋ด๊ฐ ์ค์๋ก preventDefalut()๋ผ๊ณ ์คํ๋ฅผ ๋ธ ๊ฒ์ด๋ค. ๊ทผ๋ฐ ์ปดํ์ผ ์๋ฌ๋ ์ปค๋
, ์๋ ํจ์์ ๋ํ ์๋ฆผ๋ ์๋ค. ๊ทผ๋ฐ ์๋น์ค๊ฐ ์๋์ ์ ํ๋ค.. ์ ์๊ฐ์ ๊ณ ๋ฏผํ๊ณ ๊ณ์ ์ฐพ์๋ณด๋ค๊ฐ ์ป์ ๊ฒฐ๊ณผ๊ฐ ์คํ ๋จ 2๊ฐ๋ผ๋ฉด.. ์์ฒญ๋ ํํ๊ฐ ์จ๋ค. ์ง์ง JS ๊ทธ๋ง ์ฌ์ฉํ๊ณ ์ถ์๋ค.. ์ด๋ฌํ ๋ถ๋ถ๋ค์ ๊ฐ์ ์ด ๋ ์ ์๋ค๋ฉด ์ฐธ ์ข๊ฒ ๋ค.
๐ Websocket
websocket ์์ฒด๋ Spring์ผ๋ก๋ ๊ฐ๋จํ๊ฒ ์ฐ๊ฒฐ์์ผ๋ณธ ๊ฒฝํ์ ์๋ค. ์ด๋ฒ ๊ฐ์์์๋ Websocket์ ํตํ ์ฑํ ๊ธฐ๋ฅ์ ๊ตฌํํ๋๋ฐ, ํ์คํ Spring ๋ณด๋ค ์ง๊ด์ ์ด๋ผ์ ๊ตฌํ์ด ์ด๋ ต์ง ์์๋ค. ๋ฌผ๋ก , ํต์ฌ ๊ธฐ๋ฅ๋ง ๊ตฌํํ์ ๋์ ์๊ธฐ๋ค. ์ดํ ๋๋ค์์ ์ถ๊ฐํ๊ณ ์๋ก ์ฑํ ํ๋ ๊ฒ์ฒ๋ผ ๋ง๋ค๊ธฐ๊น์ง๋ socket.io ๋ผ๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ๋์์ ๋ฐ์๋ค. socket.io๊ฐ ์์ฒญ ํธํ ๊ธฐ๋ฅ์ ๋ง์ด ์ ๊ณตํ๊ธฐ๋ ํ๋๋ผ.. JS ๊ธฐ๋ฐ์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ง๋ง, ์คํ ์์ค๋ก ์ฌ๋ฌ ํ๋ก๊ทธ๋๋ฐ ์ธ์ด๋ฅผ ์ง์ํ๊ณ ์์ผ๋, ๊ฐ๋ฐ์ ํ์ฉํ๋ฉด ํฐ ๋์์ด ๋ ์ ์์ ๊ฒ ๊ฐ๋ค.
Spring๋ ๋ ๊ณต๋ถํด์ผํ๊ณ , Python์ ํตํ ๊ฐ๋ฐ ๊ฒฝํ๋ ๋ ํ์ํ์ง๋ง, ํ๋ก ํธ์ ๋ฐฑ์ ๋ชจ๋ ๊ด๋ฆฌํ ์ ์๋ค๋ ์ฅ์ ์ด ์๋ ์๋ฐ์คํฌ๋ฆฝํธ์ ๋ํ ๊ณต๋ถ๋ ๋ง์ด ํ์ํ ๊ฒ ๊ฐ๋ค๋ ์๊ฐ์ด ๋ ๋ค. ๊ทธ๋ฆฌ๊ณ WebRTC ๋ถ๋ถ์ ์์ง ์๋ค์ด๋ด์ ๋ ๋ฃ๊ณ ์์ฑํด์ผ๊ฒ ๋ค.