[항해 99 3기]WIL 76일차 일지

문제상황 발생 및 해결

• 프론트에서 스택별로 Filter하는 작업을 하도록 변경 후, 작업 진행중, 스택이 다중 선택 되었을 때 카드 절반만 변경되는 상황 발생.
  • 해결방법: 리액트의 map을 사용하면 반드시 key 값이 필요하다. 리액트는 값이 교체되었을 때 이 key값을 기반으로 식별하여 변경하는데, map 함수에 index로 key 값을 넣어주었기 때문에 제대로 변경되지 않는 현상이 발생하였다. map함수에서 index로 key를 정하는 방식은 매우 나쁜 방식임을 인지하였고, map함수에서 고유 id값으로 변경할 수 있도록 진행하였다.

    ---

• Props로 setState를 넘겨주고 작동하였을 때, 리렌더링이 되지 않음 setState를 직접 넘기지 않고 변경해주는 함수로 만들어서 함수를 내려보낸다.

  ---

• 로그인시 기존의 페이지로 이동
  1. 1차시도.
     • window.history.back(); 을 사용하여 완료되면 이전 페이지로 이동하려 했으나, 깃허브같은경우 인증요청하는 페이지로 무한 되돌아가기가 되어 로그인을 할 수 없었다.
  2. 2차시도.
     • 리덕스에 기존 페이지 값을 넣어서 로그인 시 리덕스에 저장된 페이지로 history.push 하려 했으나 리다이렉션 주소로 나갔다 오기 때문에 리덕스를 사용할 수 없는 상황 발생. 어떻게 값을 기억해야하나?????
  3. 3차시도.
     • 리다이렉션 페이지를 새창으로 띄워서 한다면 페이지 이동이 필요 없고...해당 창에서 코드 값을 불러와서 axios로 서버에 보낸다면? ⇒ 시도해본 결과 현재 구현되어있는 소셜 로그인과 그 후처리 테스트 모달 작업의 구조를 모두 바꿔야 하므로 배포 일정에 맞출 수 없을 것 같다고 판단하였고 따라서, 차후 개선사항으로 남겨두기로 하였다.

     ---

배포전

현재 배포 전단계에 있다. 사용자 측면에서 최대한 페이지 이용 흐름에서 편리함을 주기 위해 여러 작업들을 손보고 있다. 생각보다 신경써야하는것들이 많았고, 여러 방법을 시도 중에 있다. 이번 SCOPE 사이드 프로젝트 모집 페이지 라는 주제의 프로젝트를 현재 5주동안 진행하면서 생각보다 작업해야할 분량이 많았고, 시간을 제대로 맞출 수 있을지에 대한 걱정이 스트레스였다. 그리고 현재 작성된 코드들을 최대한 쪼개어 공동작업시 깃에서 Conflict가 나지 않도록 하는 것에 대한 중요성을 느껴가며 파일을 쪼개는 작업도 같이 진행중에 있다. 파일을 잘게 쪼개면서 리액트에 대한 매력도 느끼는것 같기도 하고... 시간이 좀더 있다면 개선해야할 요소들이 눈에 많이 보인다.
반응형 디자인시안을 늦게 받아 막바지에 부랴부랴 반응형까지 고려해서 작업 하다보니 모두 지쳐보이지만 완성되어가는 프로젝트를 보니 뿌듯하다.