본문 바로가기

분류 전체보기234

[Prisma] provider = "MongoDB" 일 때 모델의 id에 대해 id String @id @default(auto()) @map("_id") @db.ObjectId 1. id 는 이 필드의 문자열(String)타입의 필드 (기본키로 사용 될 것) 2. @id: 이것은 Prisa 스키마에서 해당필드가 db의 기본 키로 사용됨을 지정하는 데코레이터 3. @default(auto()) : 이 데코레이터는 해당 필드가 새로운 레코드를 생성할 때, 자동으로 값을 생성하는 것을 의미함 4.@map("_id") : 이것은 prisma 스키마에서 해당 필드를 MongDB 내부에서 "_id"필드와 매핑하는 것을 의미함. MongoDB는 기본적으로 "_id"라는 이름의 필드를 사용해서 각 문서를 고유하게 식별함 Prisma에서는 이 "_id" 필드를 "id"라는 이름으로 사용하고자 할.. 2023. 8. 3.
[Next.js] pusher 라이브러리 Pusher.js는 실시간 웹 기술을 구현하기 위해 사용되는 클라이언드 사이드 라이브러리. 웹과 앱에서 실시간 데이터를 전송하는데 사용되며, 소켓 통신을 기반으로 작동 됨 Pusher.js의 두 가지 주요 구성 요소 Pusher 객체: 웹에서 사용 가능한 Pusher 라이브러리로, 웹 소켓 연결을 설정하고 실시간 데이터를 주고 받음 Pusher Channels: Pusher는 채널 시스템을 통해 데이터를 전송함. 채널은 특정 주제에 데이터를 게시하고 구독하는데 사용함. client는 원하는 채널에 가입하고 해당 채널로부터 데이터 업데이트를 수신함. pusher를 사용하기 위해서는 API키를 얻어야 함. 이 후 클라이언트와 서버 양쪽에서 pusher라이브러리 로드 웹 소켓을 지원하지 않는 브라우저에서는 p.. 2023. 8. 2.
내가 만든 컴포넌트가 어디에서 import 되고 있나? 컴포넌트가 다른 곳에서 import되고 있는지 확인하는 방법은 프로젝트의 규모와 개발 환경에 따라 다를 수 있습니다. 주로 사용하는 개발 도구에 따라 다양한 방법이 있지만, 일반적으로는 다음과 같은 방법들을 활용할 수 있습니다: IDE 또는 코드 편집기의 검색 기능: 대부분의 통합 개발 환경(IDE) 또는 코드 편집기는 "검색" 또는 "찾기" 기능을 제공합니다. 이를 활용하여 해당 컴포넌트의 이름으로 검색하면 해당 컴포넌트가 어디에서 import되었는지 쉽게 확인할 수 있습니다. 코드베이스 전체에서 특정 문자열 검색: 만약 IDE나 편집기에서 검색 기능이 제한적이거나 사용할 수 없는 경우, 전체 코드베이스에서 특정 문자열 검색을 수행하는 방법을 사용할 수 있습니다. 예를 들어, 프로젝트 디렉토리에서 터미.. 2023. 7. 24.
[TS] 타입스크립트 Utility types - Exclude, Omit Exclude, Omit - TS에서 제공하는 type 변형을 유연하게 도와주는 타입들 Exclude Exclude from T those types that are assignable to U. (typescript 2.8 릴리즈) Exclude => union type에서 제외된 타입들에 대한 새로운 타입을 정의함 type MyUnion = string | number | boolean; type ExcludeNumber = Exclude; const value: ExcludeNumber = 'hello'; // value can only be of type string or boolean Omit TypeScript 3.5 introduces the new Omit helper type, which.. 2023. 7. 17.
[Next.js] libs 폴더에는? libs 폴더는 Next.js 프로젝트에서 프론트엔드 개발자들이 사용하는 라이브러리 및 유틸리티 함수들을 모아놓는 공통 디렉토리 공통 함수 및 유틸리티: libs 폴더는 여러 컴포넌트나 페이지에서 공통으로 사용되는 함수나 유틸리티 기능들을 저장하는 곳입니다. 이러한 함수들은 중복 코드를 피하고 코드 재사용성을 높이는 데 도움을 줍니다. 외부 라이브러리 및 통합: libs 폴더는 프로젝트에서 사용하는 외부 라이브러리들을 관리하는 곳으로 활용될 수 있습니다. 예를 들어, Next.js에서는 libs 폴더에 외부 라이브러리들을 가져와 사용하는 코드를 작성할 수 있습니다. API 클라이언트: libs 폴더는 백엔드 API와 통신하는 클라이언트 코드를 작성하는 데 사용될 수 있습니다. 예를 들어, REST API.. 2023. 7. 15.
[Prisma] @id @default(auto()) @map("_id") @db.ObjectId 의미 id String @id @default(auto()) @map("_id") @db.ObjectId​ 이 문장의 의미 위의 코드는 Prisma ORM에서 데이터베이스 모델을 정의하는 부분입니다. 각 필드의 의미는 다음과 같습니다: id: 데이터베이스에서 고유 식별자로 사용되는 필드입니다. String 타입으로 정의되어 있으며, @id 데코레이터를 통해 이 필드가 식별자임을 나타냅니다. @default(auto())는 이 필드의 기본값을 자동으로 생성하는 설정입니다. @map("_id"): 해당 필드를 데이터베이스에서 "_id"라는 이름으로 매핑합니다. 일부 데이터베이스에서는 기본적으로 "_id"라는 이름의 필드를 사용하는데, Prisma에서는 이를 명시적으로 매핑하기 위해 사용됩니다. @db.Object.. 2023. 7. 15.
[React] React.ReactElement 와 React.ReactNode React.ReactElement와 React.ReactNode은 React에서 사용되는 두 가지 다른 타입입니다. React.ReactElement: React.ReactElement는 React 컴포넌트의 인스턴스를 나타내는 타입입니다. React 컴포넌트를 JSX로 작성할 때 생성되는 엘리먼트입니다.(jsx 요소만을 허용) React.ReactElement는 컴포넌트의 타입, 속성(props), 자식 엘리먼트 등을 포함합니다. 일반적으로 JSX를 사용하여 컴포넌트를 작성하면 React.ReactElement가 생성됩니다. (JSX.Element와 차이 없음) 예: React.ReactNode: React.ReactNode은 React 컴포넌트가 렌더링할 수 있는 모든 타입을 나타내는 타입입니다. R.. 2023. 7. 13.
Parsing error: Cannot find module 'next/babel'Require stack: eslint-parser에 의해 발생. babel에 처리하는 형식으로 변환되지 않아서 발생 프로젝트 루트 경로에 .babelrc 파일 생성 후 아래 코드 작성 { "presets": ["next/babel"], "plugins": [] } 이 후 루트 경로에 있는 .eslintrc.json 파일을 열어 아래 코드로 수정 { "extends": ["next/core-web-vitals", "next/babel"] } 2023. 7. 12.
[HTTP] 상태 코드 1XX : 요청이 수신되어 처리중 2XX : 요청 정상 처리 3XX : 요청을 완료하려면 추가 행동이 필요 4XX : 클라이언트 오류, 잘못된 문법등으로 서버가 요청을 수행할 수 없음 5XX : 서버 오류, 서버가 정상 요청을 처리하지 못함 2023. 7. 10.

티스토리툴바