| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | ||||
| 4 | 5 | 6 | 7 | 8 | 9 | 10 |
| 11 | 12 | 13 | 14 | 15 | 16 | 17 |
| 18 | 19 | 20 | 21 | 22 | 23 | 24 |
| 25 | 26 | 27 | 28 | 29 | 30 | 31 |
- 프로젝트
- 공식문서
- React
- @stomp/stompjs
- 프론트엔드
- React Query
- 프로젝트캠프
- 배열메서드
- 자바스크립트
- Server State
- 코딩테스트
- frontend
- 컴포넌트설계
- npm
- MDN
- 스나이퍼팩토리
- sucoding
- TypeScript
- radixui
- 수코딩
- shadcn
- 배열
- JavaScript
- 실시간통신
- 라이브러리
- stompjs
- pnpm
- tanstack query
- 상태 관리 라이브러리
- 리액트프로젝트
- Today
- Total
목록프론트엔드 (2)
yunicornlab
채팅 구현에 @stomp/stompjs 라이브러리를 사용한 이유
부트캠프에서 출퇴근 관리 웹을 개발하는 Riset이라는 창작 프로젝트를 진행했었다.Riset은 Sun Rise + SunSet의 줄임말로, 해가 뜰 때 출근하고 해가 질 때 퇴근하는 직장인을 의미한다.여기서 나는 프론트엔드로 참여했고, 채팅과 일정 관리, 다크모드와 반응형 등을 구현했다.이 중 채팅 구현 과정을 돌아보려고 한다.구현한 채팅 기능 소개아래 사진처럼 직원들 목록 화면에서 이름을 검색할 수 있고 1명 또는 다수를 선택해서 채팅방을 만들 수 있다.채팅은 실시간 통신으로 구현했고 1:1 채팅뿐 아니라 그룹 채팅이 가능하다.검색은 직원 이름 검색, 채팅방 목록 검색, 채팅 내용 검색 모두 구현했고, 텍스트 메시지와 파일도 전송할 수 있다.이미지는 기본 화면과 다크모드, 그리고 반응형을 골고루 가져왔..
[React Query] Tanstack Query 공식문서 - 개요
https://tanstack.com/query/latest/docs/framework/react/overview Overview | TanStack Query React DocsTanStack Query (FKA React Query) is often described as the missing data-fetching library for web applications, but in more technical terms, it makes fetching, caching, synchronizing and updating serve...tanstack.com It makes fetching, caching, synchronizing and updating server state in your web ap..