JavaScript82 TypeScript 내장 유틸리티 타입 1. Partial목적:기존 타입 T의 모든 속성을 선택적(optional)으로 만듭니다.예시:type Person = { name: string; age: number;};// 모든 속성이 선택적이므로, 일부만 제공해도 됨type PartialPerson = Partial;// 결과: { name?: string; age?: number; }2. Required목적:기존 타입 T의 모든 속성을 필수(required)로 만듭니다.예시:type Person = { name?: string; age?: number;};type RequiredPerson = Required;// 결과: { name: string; age: number; }3. Readonly목적:T의 모든 속성을 읽기 전용(reado.. 2025. 3. 4. Drizzle ORM Drizzle ORM(https://orm.drizzle.team/)이란? Drizzle ORM - next gen TypeScript ORM.Drizzle ORM is a lightweight and performant TypeScript ORM with developer experience in mind.orm.drizzle.team **TypeScript 기반의 초경량 SQL ORM(Object-Relational Mapping)**이야.👉 Prisma, TypeORM보다 가볍고 빠르면서, TypeScript 타입 안정성이 뛰어남!👉 Next.js, Neon, PlanetScale 등 서버리스 환경과 궁합이 좋음. 초경량 ORM → Prisma보다 가볍고 빠름TypeScript 기반 → 완벽한 .. 2025. 2. 12. Neon Neon(https://neon.tech/)이란? Neon Serverless Postgres — Ship fasterThe database you love, on a serverless platform designed to help you build reliable and scalable applications faster.neon.techNeon은 서버리스 PostgreSQL 데이터베이스 서비스.Vercel, Next.js, Edge Functions와 완벽한 조합으로 빠르고 자동 확장 가능한 PostgreSQL을 제공. 서버리스 PostgreSQL → 자동 확장 & 비용 절감 (사용량이 없으면 리소스 차단)Branching 지원 → Git 브랜치처럼 DB를 분기(branch)해서 테스트 가능초고속 .. 2025. 2. 12. Clerk Clerk이란?Next.js, React, Vue 등에서 간편하게 인증(Authentication) 기능을 추가할 수 있는 서비스Firebase Auth, Supabase Auth 같은 인증 솔루션과 비슷하지만, Next.js와의 강력한 통합 기능을 제공Next.js와 완벽하게 연동 가능 (App Router & Pages Router 지원)소셜 로그인 지원 (Google, GitHub, Facebook, Discord 등)비밀번호 없는 로그인 (Magic Link, OTP 지원)2FA (Two-Factor Authentication) 지원백엔드 없이도 작동 (완전한 BaaS - Backend as a Service)RBAC (Role-Based Access Control) 지원 → 관리자/유저 역할 설.. 2025. 2. 12. ShadCN/UI & Lucide React 사용하기 ShadCN/UI(https://ui.shadcn.com/docs/installation/next)란? Next.jsInstall and configure Next.js.ui.shadcn.comShadCN/UI는 Next.js와 React에서 최신 UI 컴포넌트를 쉽게 사용할 수 있도록 도와주는 Tailwind CSS 기반의 UI 라이브러리 Next.js + Tailwind CSS에 최적화됨.Radix UI 기반 → 접근성과 모던한 디자인 제공.컴포넌트가 설치형 → 필요한 컴포넌트만 직접 추가 가능.완전한 커스터마이징 가능 → 코드가 내 프로젝트 내부에 포함됨.TypeScript 지원.설치하기npx shadcn-ui@latest init // npm을 사용 중이라면bunx --bun shadcn@late.. 2025. 2. 12. [Next] next 시작하기(폴더 구조, use client와 server) Next 시작하기(https://nextjs.org/) Next.js by Vercel - The React FrameworkNext.js by Vercel is the full-stack React framework for the web.nextjs.org// 최신 버전 확인하기bunx create-next-app@latest --version// 최신 버전 설치하기bunx create-next-app@latestnext 폴더 기본 구조my-next-app/├── app/│ ├── layout.tsx # 공통 레이아웃│ ├── page.tsx # 홈 페이지│ ├── features/ # 기능별 폴더│ │ ├── auth/ # 인증 관련 폴더│ │ │.. 2025. 2. 12. Bun Bun은 Node.js의 대체 런타임을 목표로 만들어진 초고속 JavaScript 런타임 & 패키지 매니저이다. Rust로 개발되어 기존 Node.js보다 빠르게 동작함.npm, pnpm, yarn 대신 자체 패키지 매니저(bun install) 제공.내장된 번들러(빌드 도구) 및 테스트 러너 지원.Node.js, Deno와 같은 JavaScript 런타임으로서 실행 가능.서버 개발, 스크립트 실행, 웹 애플리케이션 개발에 활용 가능. https://bun.sh/ Bun — A fast all-in-one JavaScript runtimeBun implements the Web-standard APIs you know and love, including fetch, ReadableStream, Reque.. 2025. 2. 11. [Next/SpringBoot] Next와 Spring 연동하기 CORS(Cross-Origin Resource Sharing)란?교차 출처 리소스 공유를 의미한다. 브라우저가 다른 출처의 리소스를 로딩할 수 있도록 서버가 허가하는 HTTP 헤더 기반의 메커니즘이다.먼저 spring boot에 configuration을 만들어준다.package com.findMyBook.backend.config;import org.springframework.context.annotation.Configuration;import org.springframework.web.servlet.config.annotation.CorsRegistry;import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;@Confi.. 2025. 1. 24. [TypeScript] 타입스크립트 기본 문법(변수, 선언 키워드, 타입) 변수 선언:[선언키워드] [변수명]: [타입]선언키워드: const, let, var변수명: ex) number, name, car...타입: number숫자 타입.정수 및 부동 소수점 숫자를 포함. let age: number = 30;bigintnumber의 범위를 넘어서는 정수정수 끝에 n을 붙여 나타냄. let bigInt1 = 123456789012345678901234567890n; // n을 붙여서 생성let bigInt2 = BigInt("123456789012345678901234567890"); string 문자열 타입.텍스트 데이터를 나타냄.let name: string = "Alice";boolean불리언 타입. true 또는 false 값을 가짐.let isActive: bool.. 2025. 1. 13. 이전 1 ··· 5 6 7 8 9 10 다음