kohigowild

🤯 유저가 로그인을 완료하게 되면 서버로부터 유저의 정보가 response로 들어오게 되고 클라이언트에서는 이 값을 store에 저장해서 필요 시에 꺼내 쓸 수 있는데, 기존의 store는 새로고침 시 초기화되는 정보이므로 이를 해결해 주어야 한다. redux-persist 설치 npm i redux-persist yarn add redux-persist persist store 정의 store.tsx import { combineReducers, configureStore } from "@reduxjs/toolkit"; import { useDispatch, useSelector } from "react-redux"; import storage from "redux-persist/lib/storage"..

Debounce 는 이벤트 핸들러의 과도한 횟수가 발생하는 경우를 효과적으로 제어하여 성능의 개선을 목표로 하는 프로그래밍 기법으로, 연이어 호출되는 함수들 중 마지막 함수만 호출하도록 하는 기법이다. 해당 프로젝트에서는 검색 페이지에서 키워드 입력 시, 키워드 입력 완료 후 특정 시간 이후 API를 요청하도록 적용하였다. 🗒️ 적용 전 코드 키워드를 담을 state를 선언해 주고 input에 onChange 이벤트를 적용한다 의존성 배열에 keyword를 전달해서 keyword의 값이 변동될 때마다 api를 요청한다 const [keyword, setKeyword] = useState(''); useEffect(() => { // api call searchFeedList(keyword, setFeed..

Problem 타입스크립트 환경에서 env 변수 사용 시 import.meta.env에서 타입 오류 발생 Property 'env' does not exist on type 'ImportMeta'. Reference https://github.com/vitejs/vite/issues/9539 Property 'env' does not exist on type 'ImportMeta' in 3.0.0 · Issue #9539 · vitejs/vite Describe the bug In vite 3.0.0 it still exists, even if it was previously closed. Can be recreated using react-ts template. Try to use env variabl..

https://heytossme.netlify.app/ HeyTossMe heytossme.netlify.app Problem 메인 페이지 등에서 사이트가 버벅거리거나 로딩이 느려지는 문제 이미지 최적화 관련 처리 X Reason 검색하다가 LightHouse라는 툴을 발견해서(!!) 한 번 적용해 봤는데 성능 점수 뭔 일임 메인 페이지 무한 슬라이드에서 성능 문제가 있을 거라는 예상은 했었는데, 무한 슬라이드 로직에 문제가 있는 게 아니라 고화질 이미지를 너무 많이 사용한 데서 크게 문제가 아닐까 싶었다 Try to solve 메인 페이지 무한 슬라이드 이미지 교체 대놓고 버벅거리는 문제는 해결됨 41점이긴 한데 410점 같음 이미지 업로드 시 이미지 압축 코드 작성 browser-image-compr..

Problem Error: Image import ... is not a valid image file. The image may be corrupted or an unsupported format. build 되는 과정에서 public 폴더 안에 있는 static 이미지가 누락되는 문제 Reason Disable Static Imports disableStaticImages 속성이 true로 되어 있어서 정적 이미지를 가져올 수 없었던 걸로 추측됨 Try to solve invalid-images-config | Next.js invalid-images-config | Next.js Invalid images config In your next.config.js file you provided an i..

Problem Syntax error: "@next/font" requires SWC although Babel is being used due to a custom babel config being present. Reason 🤔 https://github.com/mui/material-ui/issues/35673 Syntax error: "@next/font" requires SWC although Babel is being used due to a custom babel config being present. · Issue #35673 Duplicates I have searched the existing issues Latest version I have tested the latest versi..