[TIL] 20240207 개발일지

알고리즘 

 

 

 

 

Front-End

url 공유 시 미리보기 이미지 및 내용 지정하기

채팅 서비스 등에서 URL 공유 시 출력되는 이미지, 제목, 설명을 지정하는 방법을 찾아보았다.

 

 

meta 태그에 속성을 수정하면 적용된다고 한다.

 

우선 적용은 완료하였고 배포를 수행하고 적용되는데 약간 시간이 걸린다고 하니 우선 기다려봐야할 것 같다.

 

 

 

페이지 이동 시 최상단 화면 보여주기

https://angelplayer.tistory.com/537

react router dom을 이용하여 이동을 구현하면 실제 페이지 이동이 아니라 랜더링만 일어나기 때문에 사용자가 기존에 보던 스크롤 위치에서 새로운 데이터를 출력하게 된다.

 

이를 방지하기 위해서 별도의 컴포넌트를 작성하고, 해당 컴포넌트에서 url의 수정을 감지한 후, 변경 시 스크롤을 최상단으로 이동하고 하는 기능을 구현하였다.

 

 

 

 

기타

npm에 스코프를 생성하였다.

 

 

 

평소에 캐러셀을 쓸 일이 종종 있었는데 npm에 배포된 것은 사용법도 어렵고 뭔가 디자인도 마음에 들지 않아서 이번에 조금 오랜 시간을 들여서 만들게 되었다.

 

만들고 나니 나중에 재사용할 수 있게 정리해두면 좋을 것 같아 npm을 통해서 배포하는 것을 도전해보았다.

 

 

 

올라갔는데 css가 같이 안올라갔다.

 

vanilla css는 webpack 등으로 같이 번들링 해야 하는듯 하다. 

 

일단 에러가 나는 부분이 있어서 내일 다시 수정이 필요할 듯하다.