타입 카멜케이스
타입은 기본적으로 카멜케이스로 선언한다. 이번 Vue과제는 서버에서 타입과 값을 파스칼케이스로 내려주어서 어쩔수없이 썼지만, 다음부턴 꼭 파스칼케이스로 해보자.
쿼리스트링과 SEO
https://developers.google.com/search/docs/fundamentals/seo-starter-guide?hl=ko
구글 공식문서를 보자.
내가 원래 사용했던 url은 localhost.com/movieTitle/Page였다.
하지만 정말로 페이지가 바뀌진 않고, 아래 렌더링되는 영화 목록들만 달랐다. 다른페이지가 아니다.
홈페이지를 참고할 때 호스트 이름 뒤에 오는 슬래시는 동일한 내용(https://example.com/은 https://example.com과 동일함)으로 이어지므로 선택사항입니다. 경로와 파일 이름의 경우 후행 슬래시는 파일이나 디렉터리를 나타내는 다른 URL이 될 수 있습니다. 예를 들어 https://example.com/fish는 https://example.com/fish/와 다릅니다.
구글에서는 이렇게 설명한다.
페이지를 수집하는 구글 봇은 다른 페이지라 여긴다. 이는 SEO최적화를 방해하는 요인중 하나다.
따라서 실제 페이지가 바뀌거나 디렉토리 이동이 일어난 게 아닌이상 쿼리스트링을 사용하는 게 옳다.
상태함수는 스토어에 집약
상태관리는 스토어에서 전부 이루어지는게 단일 책임과 관리에 있어서 편하다.
this.store.state = value이런식으로도 가능하지만, 액션함수를 만들어 호출하는 편이 낫다.
에러처리
에러처리는 사용하는 곳에서 하는게 옳다.
예를들어 컴포넌트에서 전역스토어의 getFetch1함수 호출 => getFetch1함수는 서버리스 함수인 getFetch2호출 => getFetch2함수는 api인 getFetch3 호출
이 순서라고 가정했을때, 1번이나 2번에서 에러처리를 하는게 좋다.
=> 에러 컴포넌트를 보여주기도 편하고 상태관리하기도 용이하다.
즉, 보여지는 쪽에서 에러처리를 관리하는게 훨씬 수월하다.
기본
import문과 변수선언 개행- 네이밍
- 중복로직 함수 분리(scss mixin도 마찬가지)
- 카멜케이스
등등...기본적이지만 의식하지 않으면 나도 모르게 대충해버리는 부분들은 무의식속에서도 기본적으로 수행할수 있게 훈련이 필요하다...이를 위해선 의식적 훈련을 해야겠지!
앞으로 계속 의식하며 코드를 쳐보겠다!
