팀

어제 한 것을 공유하며 시작했다. Cloud Front가 프론트 서버의 역할을 하게 했는데 빌드파일 위치 문제로 url을 직접 입력해서 들어가는 것이 제한되기도 하고, 성능도 안 좋다고 해서 개선할 수 있는 방법을 찾아보고 안 되면 파이어베이스로 옮기기로 했다.

프론트엔드

어제 코드 합치고 오늘 뭘 할지 이야기하고 끝났다.

내 작업

일단은 마크다운으로 작성하는 부분을 해결했다. typoscript 플러그인을 설치해서 css옵션을 주니까 해결이 됐다. 그걸 그대로 문제 페이지로 옮겼고, content 넘어가는 것봐서 손을 봐야할 수도 있을 것 같다.

Express 서버를 하나 만들어서 api를 주고 받을 수 있도록 했다. Express가 익숙하지 않아서 그냥 JS파일 하나에 api 다 집어넣고 node로 돌리는 방식이지만 어느 정도 역할은 해주는 것 같다. 알고리즘 문제를 API로 받아오게 되면서 store에서 관리할 필요가 없다고 판단했다. 어차피 내가 맡은 기능 한정으로 필요한 데이터들이라 그냥 Props로 넘기는 방식으로 바꿨는데 리팩토링이 생각보다 힘들었다. 검색 기능을 구현할 때 기존에는 filter와 검색이 유동적으로 필터된 상태에서 검색을 하면 둘 다 적용된 데이터를 보여주고 그랬는데 props로 바꾸면서 state로 관리하다 보니까 이전 검색기록이 자꾸 덮어써지는 문제가 있었다. useeffect를 통해서 매번 새로운 검색이나 필터가 있을 때마다 문제 전체에서 다시 filter하는 방식으로 바꿨는데 이렇게 하니까 둘이 동시에 작동을 하는게 안 된다. 조건문 하나 더 줘서 필터도 있고, 검색도 있을 때는 어떻게 결과를 보여줘라로 바꿔야겠다. 근데 이렇게 해도 검색하는 API가 나오면 코드를 바꿔야할 것 같다.

채팅을 위해서 STOMP SockJS를 공부했다. 블로그 자료를 찾아서 코드를 써보고 했는데 내가 원하는 만큼 하나도 작동이 안 됐다. 그나마
https://www.youtube.com/watch?v=8iwNDEXldAk&pp=ygUMc3RvbXAgc29ja2pz
여기 강의에서 스프링부트로 서버만들고 클라이언트 사용하는 방법을 잘 설명해줘서 어느 정도 감을 잡을 수 있었다. 내일 스프링부트 서버를 돌린 상태로, VS code에서 클라이언트를 따로 만들어서 연결해보는 실험을 한 후에 본격적으로 프로젝트에 붙일 예정이다.

어제 멘토링 때 멘토님이 말씀해주신 use context, cotext compound, 등의 용어가 생소해서 정리를 해야하는데 언제 할 지 모르겠다. 아직 use navigate도 정리 덜 했는데......