๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
728x90
๋ฐ˜์‘ํ˜•

socket.io4

[React Native] ChatApp Socket.io Room ์ ์šฉํ•˜๊ธฐ (feat. TypeScript) ์•ˆ๋…•ํ•˜์„ธ์š” Foma ์ž…๋‹ˆ๋‹ค. ์ €๋ฒˆ ๊ธ€์—์„œ Node.js์—์„œ Socket.io๋ฅผ ์ด์šฉํ•˜์—ฌ Room์„ ๋งŒ๋“ค์–ด ๋ณด์•˜๋Š”๋ฐ์š”. (ํ˜น์‹œ ์•ˆ๋ณด์‹  ๋ถ„๋“ค์€ ์—ฌ๊ธฐ ์—์„œ ํ™•์ธํ•ด ์ฃผ์„ธ์š”!) ์˜ค๋Š˜์€ ๋ฐฑ์—”๋“œ ์„œ๋ฒ„์—์„œ ์˜จ ๋ฐ์ดํ„ฐ๋ฅผ ํ”„๋ก ํŠธ์— ์ ์šฉํ•ด ๋ณด๋Š” ๊ณผ์ •์„ ์ •๋ฆฌํ•ด ๋ณด๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ๋ฐ”๋กœ ์‹œ์ž‘ํ• ๊ฒŒ์š”~ Preview Install npm install @react-navigation/native npm install @react-navigation/native-stack npm install react-native-screens npm install react-native-safe-area-context npm install socket.io-client ScreenEnums ์Šคํฌ๋ฆฐ ์ข…๋ฅ˜๋ฅผ Enum์œผ๋กœ ๋งŒ๋“ค์–ด ๋†“์Šต๋‹ˆ๋‹ค. export .. 2022. 8. 10.
[Node.js] Socket.io๋กœ Room ๊ตฌํ˜„ํ•˜๊ธฐ (feat. TypeScript) ์•ˆ๋…•ํ•˜์„ธ์š” Foma ์ž…๋‹ˆ๋‹ค. ์˜ค๋Š˜์€ Socket.io๋ฅผ ์ด์šฉํ•˜์—ฌ Room์„ ๊ตฌํ˜„ํ•ด ํŠน์ • Room์— ์žˆ๋Š” ์œ ์ €๋“ค์—๊ฒŒ๋งŒ ๋ฉ”์„ธ์ง€๋ฅผ ๋ณด๋‚ผ ์ˆ˜ ์žˆ๋„๋ก ๊ตฌํ˜„ํ•ด ๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. ๋ฐ”๋กœ ์‹œ์ž‘ํ• ๊ฒŒ์š”~ Preview Install typescript, ts-node, express, socket.io ๋ฅผ ์„ค์น˜ํ•ด ์ค๋‹ˆ๋‹ค. npm install typescript npm install ts-node npm install express npm install socket.io npm install @types/express npm install @types/socket.io Model ๋ฉ”์„ธ์ง€ ๋ชจ๋ธ์„ ๋งŒ๋“ค์–ด ์ค๋‹ˆ๋‹ค. export interface Message { type: string; user: string; message: str.. 2022. 8. 10.
[React Native] ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ…์•ฑ ๋งŒ๋“ค์–ด๋ณด๊ธฐ 2 - Websocket ์ด์šฉํ•˜์—ฌ ํ”„๋ก ํŠธ ๊ตฌํ˜„ํ•˜๊ธฐ (Build a real-time chatapp 1 - Implement frontend with websocket) ์•ˆ๋…•ํ•˜์„ธ์š” Foma ์ž…๋‹ˆ๋‹ค. ์ง€๋‚œ ๊ธ€์— Node.js๋กœ ์›น์†Œ์ผ“ ์„œ๋ฒ„๋ฅผ ๊ตฌํ˜„ํ–ˆ๋Š”๋ฐ์š”. ์˜ค๋Š˜์€ React Native์—์„œ ํ•ด๋‹น ์„œ๋ฒ„๋ฅผ ์ด์šฉํ•˜์—ฌ ์‹ค์‹œ๊ฐ„์œผ๋กœ ์ฑ„ํŒ…์„ ์ฃผ๊ณ ๋ฐ›๋Š” ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•ด ๋ณด๋„๋ก ํ•˜๊ฒ ์Šต๋‹ˆ๋‹ค. ๋ฐ”๋กœ ์‹œ์ž‘ํ• ๊ฒŒ์š”~ (ํ™˜๊ฒฝ์€ React Native CLI + Typescript ์ž…๋‹ˆ๋‹ค.) Tutorial ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ…์•ฑ ๋งŒ๋“ค์–ด๋ณด๊ธฐ 1 - Websocket ์ด์šฉํ•˜์—ฌ ๋ฐฑ์—”๋“œ ๊ตฌํ˜„ํ•˜๊ธฐ (feat. Websocket) (Build a real-time chatapp 1 - Implement backend with websocket) ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ…์•ฑ ๋งŒ๋“ค์–ด๋ณด๊ธฐ 2 - Websocket ์ด์šฉํ•˜์—ฌ ํ”„๋ก ํŠธ ๊ตฌํ˜„ํ•˜๊ธฐ (Build a real-time chatapp 1 - Implement frontend with webs.. 2022. 7. 28.
[Node.js] ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ…์•ฑ ๋งŒ๋“ค์–ด๋ณด๊ธฐ 1 - Websocket ์ด์šฉํ•˜์—ฌ ๋ฐฑ์—”๋“œ ๊ตฌํ˜„ํ•˜๊ธฐ (feat. Websocket) (Build a real-time chatapp 1 - Implement backend with websocket) ์•ˆ๋…•ํ•˜์„ธ์š” Foma ์ž…๋‹ˆ๋‹ค. ์˜ค๋Š˜์€ Node.js์—์„œ Websocket์„ ์ด์šฉํ•˜์—ฌ ์‹ค์‹œ๊ฐ„ ์„œ๋ฒ„๋ฅผ ๊ตฌํ˜„ํ•ด ๋ณด๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ๋ฐ”๋กœ ์‹œ์ž‘ํ• ๊ฒŒ์š”~ (๋ฐฑ์—”๋“œ ์„œ๋ฒ„๋ฅผ ์ดˆ๊ธฐํ™” ํ•˜๋Š” ๋ฐฉ๋ฒ•์€ ์ƒ๋žตํ•˜๊ณ  ์ง„ํ–‰ํ•ฉ๋‹ˆ๋‹ค. ํ˜น์‹œ ๋ชจ๋ฅด์‹œ๋Š” ๋ถ„๋“ค์€ ์—ฌ๊ธฐ ์—์„œ ํ™•์ธํ•ด ์ฃผ์„ธ์š”!) Tutorial ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ…์•ฑ ๋งŒ๋“ค์–ด๋ณด๊ธฐ 1 - Websocket ์ด์šฉํ•˜์—ฌ ๋ฐฑ์—”๋“œ ๊ตฌํ˜„ํ•˜๊ธฐ (feat. Websocket) (Build a real-time chatapp 1 - Implement backend with websocket) ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ…์•ฑ ๋งŒ๋“ค์–ด๋ณด๊ธฐ 2 - Websocket ์ด์šฉํ•˜์—ฌ ํ”„๋ก ํŠธ ๊ตฌํ˜„ํ•˜๊ธฐ (Build a real-time chatapp 1 - Implement frontend with websocket) Install express ๊ฐ„๋‹จํ•˜.. 2022. 7. 28.
728x90
๋ฐ˜์‘ํ˜•

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”