목록전체 글 (161)
지영이의 개발 블로그

|| 연산자 (논리 OR 연산자) // 예시 1 let value1 = 'Hello' || 'Default'; console.log(value1); // 출력: Hello // 예시 2 let value2 = null || 'Default'; console.log(value2); // 출력: Default // 예시 3 let value3 = undefined || 'Default'; console.log(value3); // 출력: Default // 예시 4 let value4 = 0 || 'Default'; console.log(value4); // 출력: Default ?? 연산자 (nullish coalescing 연산자) // 예시 1 let value1 = 'Hello' ?? 'Default..
1. 먼저, 프로젝트에 next-auth를 설치해야 합니다. 터미널에서 다음 명령어를 실행하여 설치하세요: yarn add next-auth 2.Next.js 프로젝트의 pages/api/auth/[...nextauth].js 파일을 생성하고 다음 코드를 추가하세요: import NextAuth from "next-auth" import GithubProvider from "next-auth/providers/github" export const authOptions = { // Configure one or more authentication providers providers: [ GithubProvider({ clientId: process.env.GITHUB_ID, clientSecret: pro..
데이터 시드(seed)란 ? 초기 데이터나 테스트 데이터를 생성하고 채우는 과정 1. Seed 파일 생성: 먼저, Prisma seed를 정의하는 파일을 생성합니다. 예를 들어, prisma/seed.ts 파일을 만들고 다음과 같이 데이터를 정의합니다. import { PrismaClient } from "@prisma/client"; import * as data from "../src/data/store_data.json"; const prisma = new PrismaClient(); async function seedData() { data?.["DATA"]?.map(async (store) => { const storeData = { phone: store?.tel_no, address: sto..

Prisma를 사용하여 프로젝트를 설정하고 데이터베이스 마이그레이션을 수행하는 기본 단계를 설명하겠습니다. 아래는 각 단계에 대한 자세한 설명입니다: Prisma 설치 및 프로젝트 초기화: 프로젝트 폴더로 이동한 후 다음 명령어를 사용하여 Prisma를 설치합니다. yarn add --dev prisma 다음으로, 프로젝트 초기화를 위해 다음 명령어를 실행합니다. npx prisma init 이 명령어는 프로젝트 루트에 prisma 디렉토리를 생성하고, schema.prisma 파일을 초기화합니다. 이 파일은 데이터 모델을 정의하는데 사용됩니다. Prisma Client 설치: Prisma Client는 데이터베이스와 상호 작용하기 위한 클라이언트 라이브러리입니다. 아래 명령어를 사용하여 Prisma C..
✔렉시컬 스코프(Lexical Scope)란? 클로저를 이해하려면 렉시컬 스코프(Lexical Scope)를 먼저 이해해야 한다 렉시컬 스코프는 함수를 어디에 선언하였는지에 따라 상위 스코프가 결정되는 것을 말한다. 자바스크립트를 포함한 대부분의 프로그래밍 언어는 렉시컬 스코프를 따르며, 이를 정적 스코프(Static Scope)라고 부르기도 한다. var x = 1; function foo() { var x = 10; bar(); } function bar() { console.log(x); } foo(); // 1 bar(); // 1 위와 같은 상황에서 bar 함수에서 참조하는 x 변수는 bar 함수의 상위 스코프가 무엇인지에 따라 결정된다. 따라서, 상위 스코프가 무엇인지 알려면 bar 함수가 어..

● 사용이유 (장점) 서버 데이터 캐싱 데이터 패칭 시 로딩, 에러 처리를 한 곳에서 처리 가능 prefetching, retry 등 다양한 옵션 쉬운 상태 관리 리덕스대신 비동기 처리를 간편하게 하기위해 무한 스크롤 ,페이지 네이션과 같은 라이브러리 제공 ● UseQuery - userQuery는 데이터를 get 할 때 사용합니다 - unique Key는 고유값이 들어가야 하며, 다른 컴포넌트에서도 해당 키로 호출 가능합니다. (배열 형식으로 넣었을 때는 특정 값을 인자로 사용할수도 있습니다.) -useQuery는 비동기로 작동합니다. 즉, 한 컴포넌트에 여러개의 useQuery가 있다면 하나가 끝나고 다음 useQuery가 실행되는 것이 아닌 두개의 useQuery가 동시에 실행됩니다. 여러개의 비동..

3.1 함수형이란 무엇인가? 자바스크립트에서는 함수가 애플리케이션의 데이터를 표현할 수 있다. 문자열이나 수 ,또는 다른 모든값과 마찬가지로 var 키워드를 사용해서 함수를 정의할 수 있다. var log = function(message) { console.log(message) } log("자바스크립트에서는 함수를 변수에 넣을 수 있습니다.") 화살표 함수를 사용해 같은 함수를 정의할 수 있다. const log = message => console.log(message) log("ES6 화살표 함수") 함수를 변수에 넣을 수 있는 것과 마찬가지로 , 함수를 객체에 넣을 수도 있다. const obj = { message: "함수를 다른 값과 마찬가지로 객체에 추가할 수도 있습니다.", log(mes..