일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- S3
- 접근 제한 라우팅
- FileReader
- 후기
- qwe
- 항해99
- Preview
- 7기
- Redux
- CI/CD
- route
- 채팅방
- 동기
- 브라우저 렌더링
- socket.io
- setstate
- routing
- Github Actions
- rendering
- 배포
- 라우팅
- previousState
- updater
- imagePreview
- 스파르타코딩클럽
- 비동기
- 개발
- react
- useEffect
- 미리보기
- Today
- Total
목록전체 글 (105)
삐옹
상황 로그인을 하고나서 workspace 배열 내에 데이터 유무에 따라 처음 로그인한 사람(뉴비)과 기존 유저에게 다른 화면을 보여주어야 한다. 생각 할 것 앱의 상태에 따른 state 관리가 핵심이다. workspace 배열 내에 데이터 유무에 따라 유저의 상태를 어떻게 표현 할 것인지 명시한다. (앱의 상태를 나타내는 state를 만든다.) 로그인 일 때와 아닐 때를 구분한다 뉴비인지 아닌지 판단하는 상태를 만들기 로딩 중 일 떄와 아닐 때 를 구분하는 상태만들기.(스피너를 위함! 난 꼭 스피너를 넣어야겠음!) +) 로그인 상태 유지하기 순서대로 코드로 살펴보기 상황 별 유저의 상태 // App.js // 정리해보면 유저의 상태는 3가지로 나뉜다 // 워크스페이가 있는지 없는지 판단 중일 떄 -> "..
상황 채팅 목록에서 팀원의 프로필을 클릭 시 채팅 방으로의 join과 leave 이벤트가 모두 이루어져야했다. 문제 클릭했을 때 join과 leave가 하나의 함수 안에서 함께 쓸 수 있는가? (어떻게 떠남과 들어옴을 같이하지..?) 함께 쓰일 수 있다면 어떤 제한을 걸어주어야 하는걸까? 해결 역시 스택오버플로우 너무너무 좋은 인사이트를 얻었다.! moveRoom 이라는 함수를 만들어서 이동 전의 방이름 from과 이동 후의 방이름 to을 인자로 받아서 leave이벤트와 join이벤트에 담아 보내주면 되는 것 이었다. 그런데! 맨 처음 입장을 하게되면 oldRoom 이라는건 당연히 없다 그 상태에서 분명 에러가 날 것이라며 혼자 쉐도우 복싱을 해댔는데, 결론은 없어도 아무 문제없었다. // 입장 + 퇴장..
무엇이 문제인가? 서버로부터 데이터 리스트를 받아와 성공 처리로 3가지 카테고리로 나누어 각각의 state에 갱신했다. 그러면 각각의 저장된 state값을 화면에 map을 돌려 뿌려주면 되는 상황. 문제가 발생한 이유는 무엇인가? useEffect에 의해 첫 마운트 후 데이터 리스트를 받아와 map안에 switch문을 돌려 미리 만들어놓은 각 카테고리 state 별로 갱신해주었다. 데이터 리스트에는 내가 생성한 23개의 데이터가 분명 쌓여있는데.. 새로 고침을 눌러도 분명 잘 남아있는데.. 각 카테고리 state에는 가장 최근에 추가한 데이터 단 한개만 들어온다. 그래서 화면에는 초라하게도 1개의 데이터만이 보인다. 시도해 본 것 데이터 생성 후 새로고침하면 데이터 갯수가 1개 추가되어 있는가? ✅ 데이..