`프론트엔드 개발자` 개형이의 벽돌집

디자이너가 직접 만들어준 아이콘을 Material UI SvgIcon에 넣어 사용하고 싶었다. 차근차근 진행했던 방법을 기록해보고자 한다. 1. Material UI SvgIcon 디자이너는 나에게 svg 아이콘을 파일로 제공했다. 그래서 이 파일을 컴포넌트로 만들어 Material UI SvgIcon에 넣고 싶었다. 관련한 예제는 Material UI SvgIcon Component Prop 에서 확인할 수 있는데, import ArrowIcon from './Arrow.svg'; 위처럼 바로 적용해서 되면 참 좋겠지만, 그렇지 않았다. Svg 파일을 리액트 컴포넌트처럼 사용하기 위해서는 svgr 라이브러리가 필요했다. 끙 2. Svgr 다행히 공식문서 를 보면 쉽게 적용이 가능하다. Next.js 메..

개발 중에 발견한 문제에 대한 해결책을 간단하게 적어두려 한다. 우선 Next Js는 SSR이라는 점을 꼭 기억해야 한다!! 무턱대고 sessionStorage 혹은 localStorage (그 외 window 함수..)를 사용하려고 하면 다음과 같은 에러메시지를 발견할 것이다. ReferenceError: sessionStorage is not defined 발생하는 이유를 간략하게 설명한다면... CSR (Client Side Rendering) 작업에 익숙한 경우 서버에서 localStorage에 액세스할 수 없는 경우가 발생할 수 있다. 이는 localStorage가 `window` 객체에 정의되어 있지 않고 Next.js가 클라이언트 사이드 렌더 전에 서버 사이드 렌더를 수행하기 때문이다. 따라..