본문 바로가기

개발 179

[Adsense] 구글 핀번호 1년 만에 온 후기 (feat.3회 실패) 제가 개인적으로 존경하는 개발자 분 중에 주니어분들께 코드 리뷰나 지식 공유를 할 때 블로그 주소를 던져주시는 분이 계셨습니다. 솔직히 너무 멋졌고 그런 블로그를 가지고 싶어 하나씩 글을 작성한지 어느덧 2년째가 되었습니다. 처음에는 자바스크립트 문법을 정리하는 글부터 썼고 최근에는 트러블슈팅이나 개발과정에서 경험했던 내용을 정리하고 있습니다. 다행스럽게도 블로그는 꾸준히 성장하여 작년에는 일일방문자 200명대, 올해는 300명대에 진입할 수 있었습니다. 이런 와중에 구글 애드센스로 구글 주식을 사보자는 발칙한 생각을 하게 되었고 현시점 기준으로 대충 300개월을 해야 한주를 살 수 있는 상황입니다... 그런 와중에 붙여 놓았던 구글 애드센스에서 주소 인증 요청이 받게 되었고, 내가 처음으로 글로벌 대기.. 2021. 12. 22.
[Next] 웹페이지의 성능 개선을 해보자 #2 (feat.LightHouse) [Next] 웹페이지의 성능 개선을 해보자 #1 (feat.LightHouse) 최근 들어 Next.js를 접하고 너무 재밌어서 기존에 미뤘던 프로젝트를 Next.js로 마이그레이션 해봤다. 바로 내 포트폴리오 사이트였는데, 2019년도인가 처음 fork를 뜨고 가져와서 내용만 업데이트를 all-dev-kang.tistory.com 이전 글에 이어서 이번에도 계속 진행해보도록 하겠습니다. 이번에는 Accessibility에 대해서 점수를 올려보도록 해보겠습니다. Accessibility 란? Accessibility 이란 해당 웹사이트에 장애가 있는 사람들이 사용할 수 있도록 설계 및 개발되는 것을 의미합니다. 따라서 다음과 같은 모든 장애에 대해 인식하고 개발하기를 권장하고 있습니다. 시각 : 시각 장.. 2021. 12. 22.
[Next] Susponse, Error Boundary 적용 후기(feat.SWR) 도입부 [리액트] React-query 도입과 Suspense, Error Boundary를 적용 React-query는 왜 도입했는가? 실제로 처음 접한 라이브러리는 react-query가 아닌 swr입니다. 진행하고 있는 사이드 프로젝트가 Next를 사용하고 있고 그래서 자연스레 swr를 도입했습니다. 사용하다 보 all-dev-kang.tistory.com 먼저 위의 글을 읽고 오시면 React-query 또는 SWR을 이용해 Susponse와 ErrorBoundary를 처리하는 구조을 왜 적용하려는 지에 대한 의문이 약간이나마 해소되실 겁니다. 다시 한번 상기해보면 SWR의 useSWR은 다음과 같은 형태를 가지고 있고 data와 error 주고 해당 값을 통해 상황에 맞는 랜더링을 하도록 예시를.. 2021. 12. 20.
[리액트] RIW 프로젝트 - scroll animated number widget RIW 프로젝트란? React Interactive Widget 이란 오픈소스 프로젝트이며, 그냥 제가 개발하면서 동적인 컴포넌트들 구현해서 오픈스소화 시킬 목적으로 합니다. Scroll animated number widget 란? 금융관련된 프로젝트를 하면서 좋은 래퍼런스를 찾곤 했는데, 그 중에 로빈후드의 홈페이지를 보고 이쁘다고 한 화면이 있습니다. 바로 위아래로 스크롤하든 변하는 숫자들입니다. 동적으로 변하는게 멋져서 저도 이걸 구현해봐야겠다고 생각했습니다. 첫번째 아이디어는 "진짜 스크롤을 이용해보기" 입니다. [리액트] 부드럽게 이동하는 숫자 컴포넌트를 구현하는 방법(feat.타입스크립트) 사이드 프로젝트를 진행하면서 다른 웹페이지를 많이 보고 공부하고 있습니다. 그러던 와중에 로빈후드의 주.. 2021. 12. 16.