본문 바로가기

리액트5

[항해99 63일차] (22.05.08) WIL_실전 프로젝트 2주차 종료. 매일 작업 기록 5/2(월) 마이페이지 분기 마이페이지 : 게시물 삭제하기 버튼 API 연동 chatList : 채팅리스트 불러오기 API 연동 chatDetail: socket 연결, 구독, 채팅 보내기 연결 성공 5/3(화) 프로젝트 노션 정리 소셜로그인 API 확인 및 response 값 처리 요청 (Login) 닉네임 설정 여부에 따라 페이지 이동 다르게 처리 완료 (signup 또는 select로) (signup) 닉네임 필수값으로 설정. 중복닉네임 아닐 시에만 닉네임 저장 버튼 활성화 처리 (Mypage / ChatList ) isLoading 세팅(useEffect 관련) (ChatList) 뷰 보완 : 채팅방 나가기 버튼 추가, (ChatDetail) 데이터 처리 방법 결정: state 에.. 2022. 5. 8.
[항해99 58일차] (22.05.03) TIL_실전 프로젝트 2주차. 요즘 매일매일 프로젝트 진행사항을 팀 내 공유 노션에 정리하고 있는데, 이것을 블로그에도 정리해두면 좋겠다는 생각이 들어 남겨둔다. 5/3(화) 목표 1. ChatDetail.js 이전 메시지 불러오는 API는 있음. 서로가 입력한 새로운 메시지를 어떻게 처리할 것인가? 이 부분에 대한 고민 필요. (리덕스 툴킷? 다른 방법?) (과제) 데이터 처리 방법 결정! 2. Mypage / MyTempPage / ChatList / ChatDetail 페이지 첫 렌더링 시 useEffect 가 렌더링 이후에 실행되면서, list 를 렌더링 이후에 가져오게 됨. → 그로 인해 렌더링되는 return 안에 있는 map 함수가 제대로 실행되지 않는 오류 발생.이것이 최선의 방법은 아닐 것으로 보이는데, 어떻게 처리해.. 2022. 5. 3.
[항해99 50일차] (22.04.25) 클론 프로젝트 종료, 실전 프로젝트 시작 클론 프로젝트 회고 ○ 스코프 대부분 구현 완료 기능 구현 완료 : 회원가입, 로그인, 로그아웃, 게시글 CRUD, 좋아요 및 관심상품 담기, 검색어 및 카테고리 검색 기능 구현 미완료 : 무한 스크롤 , 소셜 로그인 ○ Trouble Shooting 1. useEffect 실행 컨트롤이 너무 어렵다. 메인 페이지에서 axios, getpost 를 실행하여 포스트리스트를 받아오는 상황이 있었다. useEffect 는 컴포넌트가 렌더된 이후 실행되는 hook 이기 때문에, useEffect 에 getpost를 넣어두면, getpost가 실행되기 전에 state 값이 불러와지고, render 가 진행되어 state 값이 undefined 가 출력되고. 페이지에 오류가 발생하게 된다. 웹 애플리케이션에서 서버.. 2022. 4. 25.
[항해99 27일차] (22.04.02) 자바스크립트/리액트 파고들기 어제 밤까지 자바스크립트 비동기 처리를 파고들다가, 체력의 한계가 와서 잠들었다. 오전 중에 promise, async/await 의 개념을 이해하고 오후에는 본격 리액트 파고들기를 해보려고 한다. 오늘 배운 것 1. 자바스크립트 비동기 처리 1) Callback 콜백 지옥 콜백함수는 특정 함수에 매개변수로 전달된 함수를 의미한다. 그 콜백함수는 함수를 전달받은 함수 안에서 호출된다. 콜백지옥은 JavaScript를 이용한 비동기 프로그래밍시 발생하는 문제로서, 함수의 매개변수로 넘겨지는 콜백함수가 반복되어 코드의 들여쓰기 수준이 감당하기 힘들 정도로 깊어지는 현상을 말한다. 예제 step1(function (value1) { step2(function (value2) { step3(function (v.. 2022. 4. 3.
[항해99 26일차] (22.04.01) 주특기 심화 첫째 날 Chapter 3-3. 주특기 심화 (W5) 첫째 날. 항해는 매주 금요일을 일주일의 첫 날로 정해 일정을 운영한다. 오늘은 오전 9시에 OT 가 진행되었다. OT 에서는 이번주 해야할 것으로 개인과제, 팀과제가 있음을 안내받았다. 더불어 과제수행에 도움이 되는 강의를 지급받았다. 내 주특기는 React. React와 함께한지 3주차로 접어들고 있다. 오늘 학습한 것 자바스크립트 기초 1. 변수와 상수 : 변수 생성의 3단계(선언->초기화->할당) 선언: 스코프가 참조하는 대상이 되도록 실행 컨텍스트에 변수 객체를 등록 초기화: 변수 객체에 등록된 변수를 위해 메모리에 공간을 확보 (여기서 변수는 보통 undefined로 초기화) 할당: undefined로 초기화된 변수에 실제 값을 할당 변수 선언 키워.. 2022. 4. 1.