Home

vue3-golang-todo-webapp

개발하면서 겪었던 고민 모음집

• 2022-02-02

  • 우선 gin과 mongodb를 처음 같이 사용해봐서 기본적인 사용법과 셋팅에서 혼란이 왔었지만 무사히 해결했고 controller와 service로직을 분리시키는것에서 많이 고민을했다. 지금 우선 내가 할 수 있는선에서 분리는 시켜놓았지만 굉장히 마음에들지 않는다. 좀 더 뭔가 잘 분리할 수 있을것 같은데...흠 그리고 에러처리도 service와 controller에서 각각 어떤식으로 처리해주면 좋을지도 고민이된다. 우선 현재는 최대한 분리하기 위해서 노력했지만 추후에 개선이 필요하다고 생각한다. controller와 service의 관심사를 최대한 분리시키고 service로직이 비즈니스 로직을 처리하도록 최대한... 노력은 했지만 좀 더 repo layer를 만들어 분리시키고 싶다.
  • 결론 : service/controller 분리 고민, error를 어디서 처리하느냐의 고민

• 2022-02-05

  • 오늘 graphql을 도입하는걸 시도했는데 간단한 기초예제 샘플을 셋팅하고 준비하는데도 굉장히 무지막지한 시간이 걸렸다 ㅋㅋ 고민이 되는건 앞으로 어떻게 이제 이걸 잘 사용하느냐인데 이걸 어떻게든 사용하고 적용해보면서 경험해보면 좋을지 그냥 편하게 gin만 사용해서 rest api로 구현하는게 나을지 고민된다. 사실 너무 사용해보고 싶은 마음이 크긴한데... 조금 더 적용해보고 다시 생각해보도록 해보려고 했지만 현재 스스로 판단한 결과는 golang을 rest api로 구현하는것 조차도 완전 익숙한게 아니기 때문에 2보 전진을 위한 1보 후퇴를 선택. 다음에 다른 프로젝트나 해당 프로젝트가 완성되고 추가로 사용해볼 수 있다면 그때 사용해보도록 해야겠다.

• 2022-02-09

  • tailwind와 vueuse의 첫 사용 시작. 일단 tailwind는 지금은 좀 느리지만 문서를 보면서 익숙해져가면 개발속도가 점진적으로 증가할것 같다고 판단된다. 디자인 없이 개인적으로 프로젝트하기에 매우 잘 선택했다고 판단된다. 그리고 vueuse는 이번에 처음 알게된 라이브러리인데 composition api의 helper함수 라이브러리? 같은 느낌이다. 생각보다 기능이 굉장히 많이있고 잘 섞어서 사용한다면 유용하게 쓸 수 있을것같다. 그리고 vueuse의 함수들을 전부 사용하지 않더라도 tree Shaking 기능이 있어서 용량에 관한 문제는 크게 없이 사용할 수 있어서 좋은것같다. *Tree Shaking: 간단하게 vueuse의 관점에서 설명하면 불필요하거나 사용하지 않는 함수들을 빌드과정에서 알아서 삭제시켜주고 빌드한다. 원래 웹팩 공식홈페이지에도 서술되어있는데 사용되지 않는 코드를 제거하기 위해 JavaScript 컨텍스트에서 일반적으로 사용되는 용어다.

• 2022-02-11

  • 잠시 client 개발은 종료하고 현재 server 코드를 대규모 리팩토링중이다. 좀 더 클린 아키텍쳐에 가깝게 개발해보는게 좋다고 생각해서 각 레이어별로 최대한 분리해보면서 개발을 해보려고 노력중이다. 중간중간 미숙한부분이랑 약간 마음에 안드는 부분들이 존재하긴 하는데... 그래도 최대한 깔끔하게 to-do까지만 리팩토링 해보고 추후에는 리팩토링한 구조를 따라가며 개발을 진행해보도록 해야겠다. 그 후에 이제 클라이언트 개발을 진행해야겠다

• 2022-02-16

  • todo관련 server 작업은 우선 거의 끝나서 현재 client쪽 작업을 진행중이다. 현재 서버에서 만든 api들을 연결시켜주고있다. 우선 기본적으로 vue3, pinia 둘 다 처음 사용해보는 과정이라서 로그인 과정없이 개발했는데 이제 필요한 시점이와서 다음 챕터로는 로그인 기능을 붙여야할 것 같다. 어떤식으로 로그인을 진행할지는 고민중이긴한데, 아마도 kakao,github,google 3개를 사용해보면 좋을것같다. 그 후에 로그인 인증 및 유지 과정을 종료하고 다음 작업들로 넘어가면 될 것 같다.

• 2022-02-19

  • 로그인 구현은 우선 google oauth로만 하기로 결정했다. 기존에 localStorage에 access-token을 넣고 클라이언트에서 먼저 google oauth에 인증요청을 보내려고 했지만 이걸 client에서 처리하는게 맞나?라는 생각이 들었고 server에서 모두 처리하기로 변경했다. 우선 login에 처음 성공하면 localStorage에 내가 만든 가짜 token을 넣어주고 이걸 user의 access_token,refresh_token과 기타 유저정보들과 함께 바로 서버로 보내주고 이걸 db에 저장한다. 로그인 과정은 이렇게 끝내고 매번 새로 로그인하지 않게 가능하도록 인증하는 과정은 client에서 localStorage에 담은 가짜 token을 server에 보내고 서버에서 db에서 가짜 토큰을 조회해 해당 유저를 찾아낸다. 그 후에 그 db에 담긴 access_token으로 google oauth에 인증 요청을한 후에 인증이되면 ture를 보내주고 만약 실패라면 refresh_token으로 재요청후 성공하면 기존 refresh_token을 access_token과 교체시켜주고 새로 발급받은 refresh_token을 기존의 refresh_token에 넣어준다. 그리고 true를 client로 보내준다. 우선은 이런 방식으로 구현하도록 계획했고 크게 문제가 없다면 이렇게 구현할 생각이다.

• 2022-02-20

  • google oauth 지옥 트러블슈팅...완료 이건 별도로 작성하도록 해야겠다. 우선 결론적으로는 로그인 구현과 유효성 검증과 로그인 상태 유지가 가능하도록 개발은 완료하였는데 마음에 안드는 부분이 몇군데 존재한다. 마음에 안든다기보다... 이게 이렇게 해도 괜찮을까? 싶은 고민이 많이들었던 포인트들이 몇가지있는데 내가 맞는건지 틀린건지는 잘 모르겠다. 높은확률로 틀릴지도 ㅋㅋ 이건 우선 개발을하면서도 쭉 지켜보도록 해야겠다. 좋은 설계가 떠오른다면 다시 리팩토링 도전해봐야지 !

• 2022-02-23

  • 로그인 상태유지 및 google oauth 토큰 검증과정에서 고민이 많은 상태이다. 전부 정상 작동하도록 구현은 되어있지만 우선 토큰 검증과정은 매번 페이지 이동시마다 서버에 google oauth로 토큰 검증 요청을 보내는 형태이고 로그인 상태유지는 마찬가지로 토큰 검증이 완료되면 상태를 유지시켜주도록 구현되어있다. 여기서 검증을 위한 유저를 식별하는 방법은 현재 localStorage에 user email과 name을 넣어놨고 이중에서 토큰검증은 user의 email로 하도록 구현해놨다. ( 닉네임은 언제든 변경될수 있지만 이메일은 바뀔가능성이 없다고 생각함 ) 조금 걸리는 부분은 이걸 localStorage에 저장한다는것인데, 약간 근거 없는 불신이라고 해야할까? 여기에 넣는게 정말 최선인가? 이게 맞나? 라는 생각이 자꾸든다. 그래서 시간을내서 다른방법을 찾아보기전에 localStorage에 넣어도 보안적으로 어느 수준까지 괜찮은건지를 찾아보도록하고 다른것들과 비교해보고 판단해야겠다. 물론 완벽한 보안유지는 없다고 생각한다. 그래도 더 나은방법이 있을수있기 때문에 혹시몰라 찾아보기는 해야겠다. 이대로는 너무 찝찝하다 ㅎㅎ

• 2022-02-24

  • 인증관련 문제는 토큰을 localStroage에 담아서 사용하는걸로 종결하기로 결정했다. 지금 이메일을 사용해서 서버에 요청을 통하고있는데 생각해보니까 만약 로컬스토리지에서 이메일 주소를바꾼다면? 이라는 문제점이 생겼고 없으면 요청을 주지않으면 그만이지만 있는 이메일로 바꿔서 다른 유저의 정보를 받아온다면? 이런 문제가 발생한다. 고로 토큰을 localStorage에 담아서 사용하는 방식으로 핸들링하기로 결정 탕탕. 그리고 이제 로그인 관련 작업은 오늘 마무리하는걸로 정리하고 이제 블로그쪽 작업을 시작해보면 될 것 같다. 가계부는...흠 아직은 고민이 되고있다. 가계부만 따로 React로 개발해보고싶은 마음이 큰데 이부분은 우선 블로그를 마무리하고 고민해보도록 해야겠다.

• 2022-02-25

  • 블로그를 역시 기존에 엄청 사용해보고 싶었던 Next.js로 구현해보기로 계획을 변경했다. 조금 아쉽긴하지만 이번 프로젝트는 여기까지 마무리를 하도록하고 블로그 및 가계부들은 기존에 더 사용하고 싶었던 Next.js를 사용해서 개발을 진행해보도록 해야겠다 ! 이번 개인 프로젝트를 진행하면서 배운것도 굉장히 많았고 좋은 경험치가 되었던것같다. 재미있기도 하였고 우선 todo와 login과 관련된 기능은 모두 종료하였기 때문에 정상적으로 여기서 종료해도 될 것 같다 !