728x90
728x90
관계형 데이터베이스(RDBMS) 관계형 데이터베이스는 테이블(표) 기반으로 데이터를 구조화하여 저장한다. 데이터를 행(row)과 열(column)의 형태로 관리하며 데이터 간 관계를 명확히 정의한다. SQL(Structured Query Language)을 사용하여 데이터를 조회, 삽입, 수정, 삭제할 수 있다. 관계형 데이터베이스는 데이터 구조가 엄격하게 정의되어 있어 테이블에 저장된 데이터들의 일관성을 유지할 수 있다. 또한 테이블 간의 관계를 정의하여 데이터 중복을 줄이고 데이터 무결성을 유지한다. (RDBMS의 고정된 스키마와 테이블 관계 특징) 대표적인 관계형 데이터베이스는 MySQL, Oracle Database, Microsoft SQL Server, PostgreSQL이 있다. 관계형 데이..
이번 글은 Next.js 공식 튜토리얼을 번역한 글입니다.공식 튜토리얼을 따라하면 Next.js 의 동작원리와 개발 방식에 대해 학습하기 쉽고 잘 쓰여진 튜토리얼이라고 생각되어 번역하게 되었습니다.오타 또는 오역된 부분이 있다면 댓글 부탁드립니다. Learn Next.js: Creating Layouts and Pages | Next.jsCreate the dashboard routes and a shared layout that can be shared between multiple pages.nextjs.org 현재 애플리케이션에는 홈 페이지만 있습니다. 이제 레이아웃과 페이지를 활용하여 더 많은 라우트를 생성하는 방법을 배워봅시다.이 장에서 다룰 내용파일 시스템 라우팅을 사용하여 대시보드 라우트를 ..
Middleware란?미들웨어(Middleware)는 Next.js 12 버전부터 도입된 기능으로, 서버로 들어오는 요청(request)와 응답(response) 사이에 실행되는 함수이다.미들웨어는 요청이 완료되기 전에 실행되어 요청 또는 응답 헤더를 다시 작성, 리디렉션, 수정하거나 직접 응답하여 응답이 가능하다.이를 통해 Next.js 미들웨어 공식 문서에서 아래와 같은 작업을 예시로 보여준다.인증 및 권한 부여: 특정 페이지나 API 경로에 대한 액세스 권한을 부여하기 전에 사용자 신원을 확인하고 세션 쿠키를 확인한다.서버 측 리디렉션: 특정 조건(예: locale, user role)에 따라 서버 수준에서 사용자를 리디렉션한다.경로 재작성: 요청 속성에 따라 API 경로나 페이지에 대한 경로를 동..
Falsy 값 체크JavaScript에서 빈 값을 검사할 때 가장 간단한 방법은 Falsy 값을 확인하는 것이다. JavaScript의 Falsy 값에는 null, undefined, "" (빈 문자열), 0, NaN, false가 있다. 이러한 값들은 조건문에서 false로 인식되므로 if (!value) 문을 통해 빈 값 여부를 검사할 수 있다. function isEmpty(value) { return !value;}// 사용 예시console.log(isEmpty(null)); // trueconsole.log(isEmpty(undefined)); // trueconsole.log(isEmpty("")); // trueconsole.log(isEmpty(0)); ..
Babel(바벨)이란?Babel은 널리 사용되는 자바스크립트 트랜스파일러로 최신 ES6+ 자바스크립트 코드를 ES5 이하로 변환하여 구형 브라우저에서도 최신 기능을 활용할 수 있도록 해준다. Babel은 플러그인과 프리셋(preset) 설정을 통해 유연하게 구성할 수 있으며 다양한 자바스크립트 기능을 지원한다. Babel의 주요 기능문법 변환: 화살표 함수, 클래스, 템플릿 리터럴 등 ES6+ 문법을 ES5 이하로 변환폴리필 지원: 특정 기능을 구형 브라우저에서도 사용할 수 있도록 폴리필 추가모듈 시스템 변환: ES6 모듈을 CommonJS 또는 AMD와 같은 다른 모듈 시스템으로 변환플러그인 및 프리셋 관리: 필요한 기능에 맞춰 플러그인이나 프리셋을 추가하여 변환을 최적화 Babel 의 예시// 변환 ..
이번 글은 Next.js 공식 튜토리얼을 번역한 글입니다.공식 튜토리얼을 따라하면 Next.js 의 동작원리와 개발 방식에 대해 학습하기 쉽고 잘 쓰여진 튜토리얼이라고 생각되어 번역하게 되었습니다.오타 또는 오역된 부분이 있다면 댓글 부탁드립니다. Learn Next.js: Optimizing Fonts and Images | Next.jsOptimize fonts and images with the Next.js built-in components.nextjs.org 지난 장에서는 Next.js 애플리케이션의 스타일링에 대해 알아보았습니다. 이번에는 홈페이지에 커스텀 폰트와 히어로 이미지를 추가하는 방법을 배워보겠습니다. 이번 장에서 다룰 주제는 다음과 같습니다. next/font를 사용하여 커스텀 폰..