분류 전체보기
-
(삽질금지 시리즈) Nextjs getServerSideProps에서 SSR 할때 react-query 사용 hydrate fetchQuery와 prefetchQueryNext.js 2024. 2. 2. 13:23
개발 하면서 ssr를 이용하여 api를 요청 할때 try catch 구문을 이용하여 restapi의 error상태에 따라 error 페이지로 보내줄려고 했다. ssr에서 react-query를 사용 할때 hydrate 방법을 사용 했는데, 굉장히 흥미로운게 있었다. react-query를 ssr에서 사용 할때 const queryClient = new QueryClient(); await queryClient.fetchQuery await queryClient.prefetchQuery 이렇게 사용하는데 - fetchQuery - perfetchQuery의 차이는 fetchQuery : 리턴값이 있다. prefetchQeury: 리턴값이 없다. fetchQuery : Promise prefetchQeury..
-
(삽질금지 시리즈) Docker 환경에서 NextJS SSR 사용시 주의할점Next.js 2024. 2. 1. 20:48
Next.js13에서 docker nginx환경에서 getServerSideProps(ssr) api 호출 에러 404 not found 개발 환경 구조는 다음과 같다. docker-compose nginx client backend Next.js13에서 docker nginx환경에서 getServerSideProps(ssr) api 호출 에러 404 not foundnginx에서 localhost:3000일때 client를 localhost:3000/api를 호출 하면 baceknd를 호출 하게 proxy 설정을 해주었다. export const getServerSideProps = (async context => { const queryClient = new QueryClient(); const { ..
-
-
typescript에서 제네릭으로 파라미터 defaultValue값 설정시Typescript 2024. 1. 28. 16:50
제네릭으로 파라미터 defaultValue값을 설정 했을때 발생하는 에러 import { useState } from 'react'; import { EditMode, Union } from 'types'; export const useEditMode = ( defaultEditMode: T, ) => { const [isMode, setMode] = useState(defaultEditMode); const handleEdit = (mode: T) => { setMode(mode); }; return { isMode, handleEdit, }; }; // Union 타입 추론 결과 "information" | "visitMessage" | "reset" - 해당 useEditMode에서 제네릭 T를 이..
-
TypeOrm에서 findOption의 order를 이용시 skip과 take의 paginate 오류Nest.js/TypeOrm 2024. 1. 25. 16:02
await this.repository.findAndCount({ select: { id: true, groupId: true, scheduleImage: true, scheduleName: true, startPeriod: true, endPeriod: true, updatedAt: true, schedulePeriods: { id: true, period: true, startTime: true, endTime: true, tourisms: { id: true, contentId: true, stayTime: true, tourismImage: true, title: true, position: true, }, }, }, where: { memberId: memberId, }, relations: {..
-
node.js ioc 라이브러리 inversify.jsTypescript 2024. 1. 22. 17:40
https://www.npmjs.com/package/inversify?activeTab=readme inversify A powerful and lightweight inversion of control container for JavaScript and Node.js apps powered by TypeScript.. Latest version: 6.0.2, last published: 3 months ago. Start using inversify in your project by running `npm i inversify`. There are 2795 other www.npmjs.com
-
eslint import/no-unresolved tsconfig.json paths 인식 오류eslint 2024. 1. 19. 12:48
eslint.js module.exports = { parser: '@typescript-eslint/parser', parserOptions: { project: 'tsconfig.json', tsconfigRootDir: __dirname, sourceType: 'module', }, settings: { 'import/resolver': { typescript: { project: './tsconfig.json', }, }, }, plugins: ['@typescript-eslint/eslint-plugin', 'import'], extends: [ 'plugin:@typescript-eslint/recommended', 'plugin:prettier/recommended', ], root: tru..
-
go와 sql를 사용하기위한 orm대신 sqlc사용Go/sqlc 2024. 1. 13. 23:17
go는 프레임워크도 그렇지만 orm도 딱히 대중적인게 없는듯 하다. sqlc generates type-safe code from SQL https://pkg.go.dev/github.com/kyleconroy/sqlc#section-readme sqlc package - github.com/kyleconroy/sqlc - Go Packages Discover Packages github.com/kyleconroy/sqlc Version: v1.19.1 Opens a new window with list of versions in this module. Published: Jul 13, 2023 License: MIT Opens a new window with license information. Imp..