프론트(front)에서 API 를 받을때 정적(static) 으로 하는 이유
2023. 12. 31. 14:04
Frontend/React & React.Native &Next.js
앱 성능 향상: 정적 API는 미리 컴파일되어 있어 런타임 중에 동적으로 생성되는 것보다 훨씬 빠를 수 있습니다. 따라서 앱이 더 빠르게 데이터에 액세스할 수 있습니다. 보안 강화: 동적 API는 런타임에 생성되므로 앱의 보안에 취약할 수 있습니다. 정적 API는 미리 정의되어 있으며, 미리 정의된 권한과 규칙을 따르므로 보안 측면에서 높은 수준의 안전성을 제공할 수 있습니다. 캐시 및 최적화: 정적 API는 캐시될 수 있어서 동일한 요청에 대해 더 빠른 응답을 제공할 수 있습니다. 또한 미리 알려진 구조를 가지고 있어서 클라이언트 측에서 더 효율적으로 최적화될 수 있습니다. 서버 부하 감소: 동적 API는 요청이 있을 때마다 서버에서 응답을 생성해야 합니다. 반면에 정적 API는 이미 생성된 응답을 제..
NextJS) Would you like to customize the default import alias (@/*)?
2023. 10. 27. 12:36
Frontend/React & React.Native &Next.js
이 문장은 특정 프로그래밍 환경이나 프레임워크에서 기본적으로 설정되어 있는 "import alias"나 "import 경로 별칭"을 사용자가 변경하고자 할 때 묻는 질문입니다. 여기서 "import alias"나 "import 경로 별칭"은 코드에서 다른 파일이나 모듈을 불러올 때 사용되는 경로에 붙이는 짧은 별칭을 말합니다. 이러한 별칭을 변경하면 코드를 더 짧고 가독성 좋게 만들 수 있습니다. 문장은 사용자에게 이러한 별칭을 수정하고자 하는지를 묻는 것입니다. json { "compilerOptions": { "baseUrl": "./", "paths": { "@/*": ["src/*"] } } } 불러올때 import Header from '@/components/Header'; // 나머지 코드
ReactJS) 글쓰기-유저가 여러번 클릭 막기/ router.query가 null 인 경우/ +id.toString() 하는 이유/데이터 베이스 날짜, 시간 렌더링
2023. 2. 22. 11:07
Frontend/React & React.Native &Next.js
글쓰기-유저가 여러번 클릭 막기 const onValid = (data) =>{ // 유저가 여러번 클릭하는 거 막기 위한 것 if(loading) return ; test(data) } router.query가 null 인 경우 상세페이지에서는 router.query가 null일 수 있다 null이면 error를 받기 떄문에 null 페이지로 갈 수 있다 const { data, error } = useSWR(router.query.id ? `/api/test/${router.query.id}` : null) +id.toString() 하는 이유 const post = await client.test.findUnique({ where: { // id가 배열로 들어올 수 있고, 저장할떄는 숫자로 해야해서..
NextJS)페이지(router)가 변할때 이벤트 주기
2023. 2. 13. 00:24
Frontend/React & React.Native &Next.js
NextJS)에서 beforeunload 같은 기능 useEffect(()=>{ 이벤트 },[, router])