codestates / codestates/FormBakery
[KPT] 장세진 First Project 회고
- Dominant language
- TypeScript
- Stars
- 1
- Forks
- 2
- PR merge metrics
- No merged PRs in 30d
Description
### Keep (유지할 항목)
- 문제가 생기거나 버그가 생기면 팀원들과 의사소통을 통해서 문제를 해결해 나가는게 좋았습니다.
- typescript, tailwind을 이용하여 코드의 형식과 타입을 유지시키며 구조설계를 통해서 컴포넌트와 기능을 세분화 하여 사용하는게 좋았습니다.
- 팀의 역할 분배가 명확했고 서로 이해해주며 맡은 역할에 최선을 다한 모습이 좋았습니다.
- api를 툴을 통해서 깔끔하게 문서화 시켜 프론트와 벡엔드와의 소통에 큰 도움을 주었습니다.
- 프론트의 기술스택들이 전반적으로 성공적으로 사용되어 대부분 파이널 프로젝트 때도 유지할 것 같습니다.
- 작업량이 늘어나고 원하지 않는 에러때문에 밤 늦은 시간까지 작업하는 날이 많아 멘탈, 체력을 잘 유지해야 할 것 같습니다.
### Problem (문제라고 생각하는 항목)
- typescript를 처음 사용해봐서 적용하는데 많은 어려움이 있었습니다. 예를들어 redux나 react-hook과 같은경우나 태그를 특정 시켜서 method를 이용하려는 경우 등에 타입을 정확하게 정의하지 못하여 any를 사용한 적이 몇 번 있었습니다.
- NEXTJS를 이용하여 페이지 단위로 CSR과 SSR을 나누어 사용하는데 어려움을 겪었습니다. 또 CSR과 SSR의 목적과 정의는 알지만 NEXTJS를 이용하여 제대로 페이지를 용도에 맞게 사용하고 있는지 확인하는게 어려웠던 것 같습니다. 프로젝트의 규모가 작고 상업화 목적으로 배포를 하지 않았기 때문인지 사용자체에 큰 메리트를 느끼지 못했습니다.
- AXIOS를 사용하여 통신을 하는것이 서툴러서 API를 적용하여 서버와 통신하는데 잦은 어려움을 겪었습니다.
- 프론트 인원이 한명 뿐이여서 계획한 것을 모두 구현하지 못했다고 생각이 들지만 그래도 더 구체적으로 작업들을 나누고 사전에 기술스택들을 조금씩 공부하거나 습득하였다면 더 좋은 프로젝트를 완성할 수 있지 않았을까 하는 생각이 듭니다.
- 프로젝트를 기획하는 부분에서 아이디어는 많았지만 구현하는데 드는 시간과 현재의 능력을 고려하여 기존에 있던 사이트를 모방하는 사이트를 제작하기로 결정하였습니다.
- client에서 통신규약이 HTTP에서 HTTPS로 바뀔 때 server간의 통신에서 통신오류가 생겼지만 명확한 해결책을 내지 못하였습니다.
- 통신이 일어날 때 사용자가 통신을 여러번 하지 못하게 하거나 통신이 일어나는 시간을 알려주는 인디케이터를 모든 페이지에 걸쳐서 전부 설계하지는 못했습니다.
- 사용자가 이메일 인증을 요청하면 해당 메일에 인증문자와 동시에 client에서 인증번호 데이터를 받아 state에 꼽아주는 형식으로 인증메일의 진위여부를 따졌는데 이 방법을 이용하면 중간에 해킹이 되진 않을까 우려가 되는 부분이 있습니다.
- 통신을 통해서 서버로 부터 받은 사용자의 모든 데이터(개인정보, 내 설문지 등)을 어디서 부터 어디까지 redux로 관리하고 활용해야 할지 명확하고 깔끔하게 설계하지 못하였습니다.
- 초기 설계 때 redux의 회원정보에 어떠한 기록도 없는 최초 사용자가 홈페이지 메인페이지 외 로그인이 필요한 서비스페이지로 이동요청을 할 때 사용자를 어떤 방식으로 컨트롤 해야할지 분기 처리가 명확하지 않았던 것 같습니다.
- postman을 이용하여 api통신을 팀원들과 공유하지 못했던 부분이 아쉽습니다. (예시로 만들어 놓은 request가 있다면 받아오는 데이터와 요청을 보내는 body데이터의 property와 type구조를 시간을 낭비하지 않고 정확하게 확인 할 수 있을 것 같습니다.)
### Try (Action Items)
- [ ] 기획단계에서 참신한 아이디어로 우리 프로젝트만의 장점을 살리고 구체적으로 프로젝트의 80%이상 어떻게 만들지 flow를 생각하며 결정한다.
- [ ] 프론트의 기술스택들을 사전에 더욱 더 꼼꼼하게 docs를 보면서 공부하고 프로젝트에 적용시킨다.
- [ ] NEXTJS를 더 공부하여 SSR과 CSR 페이지를 명확하게 설계한다.
- [ ] AXIOS 통신에 어려움을 겪으면 공식문서를 활용하여 더 열심히 찾아본다
- [ ] HTTPS와 HTTP통신간에 생긴 오류를 해결한다
- [ ] 인증메일등 보안에 취약한 부분이 추가적으로 있을 지 고민하며 해결책을 찾아본다.
- [ ] 통신이 일어날 때 사용자에게 통신의 상황에 대해서 인지 시켜줄 인디케이터를 전 페이지에 걸쳐 깔끔하게 설계해본다.
- [ ] redux를 어디서부터 어디까지 어떻게 활용할지 명확하게 생각하고 작업에 들어간다.
- [ ] 로그인 유무, accessToken, refreshToken 등을 가지고 사용자의 경로에 따른 사용자 컨트롤을 어떻게 해 나갈지 정확하게 생각하고 작업을 들어간다.
- [ ] postman의 request를 설계하고 팀원들과 공유하여 api를 활용하는 데 많은 시간을 투자하지 않도록 협력한다.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.