[리팩토링] LinkHere : 링크 저장 서비스

linkbrary 프로젝트를 리팩토링했다.

서비스 이름 및 색상 테마 변경

Linkbrary → Link Here

LinkHere

* og image가 티스토리에서 잘 안나오는 문제가 있었는데 권장 사이즈인 1200x630px 로 하니 잘 나온다. 💢

 

랜딩페이지, 로그인 페이지를 제거하고 메인 페이지와 사이드바로 변경

주요 기능인 링크를 추가하고, 조회하는 것에 집중하고자 페이지를 개편했다.

또한 게스트 계정을 추가하여 회원가입 없이 프로젝트를 경험해볼 수 있도록 했다.

 

 

내부적으로는, 주요 기능인 링크와 폴더 불러오는 로직을 SSR 에서 CSR 로 수정했다.

getServerSideProps → React query (tanstack query)

개인화된 정보를 보여주는 거니까 SEO에 비교적 덜 민감한 서비스이기에 SSR 을 적용하지 않아도 된다고 생각했다.

그런데 초기 로딩 시 폴더랑 링크가 잘 안불러와지는 문제가 발생했다 ㅜ 

그래도 캐싱이 되고, 쿼리 무효화를 적용해서 데이터를 신선하게 유지할 수 있다는 점과

폴더를 오갈때 새로고침이 발생하지않는점, 코드가 굉장히 깔끔해진 것에는 만족한다

 

문제되는 부분은 너무 크리티컬해서 다시 고려해봐야겠다.

 → 초기 로딩 시 user 데이터가 달라지면 쿼리 무효화 하는것으로 해결하였다!

(이전에는 user 가 불러와지기 전에 API 요청을해서 forder, link 데이터를 가져올수 없었음)

 

 

그리고 이 서비스의 모든 API 요청은 모달에서 이루어지기 때문에, 다양한 모달이 있는데

좀더 UX 면에서 개선하고자 자잘하다고 할수도 있는 기능들을 추가했다.

요건 코드랑 함께 좀더 자세히 기록해두기 위해 별도의 포스팅으로 !