Next.js 15 Fullstack Web Apps · درس

مقدمة إلى Prisma ORM

افهم ماهية Prisma وفوائدها، وكيفية إعدادها في مشروع Next.js.

الدرس 1 من 411 خطوة

مقدمة إلى Prisma ORM درس مجاني في Next.js 15 Fullstack Web Apps على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Next.js 15 Fullstack Web Apps، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Next.js 15 Fullstack Web Apps 4 دروس في المجموع.

بعض أجزاء هذا الدرس لم تُترجم بعد وتظهر باللغة الإنجليزية.

What is an ORM? Meet Prisma!

Welcome to working with databases in Next.js! Often, you'll hear about an ORM, or Object-Relational Mapping. An ORM helps you interact with your database using your preferred programming language (like JavaScript/TypeScript) instead of writing raw SQL.

Prisma is a modern, open-source ORM that makes working with databases intuitive and type-safe. It's a fantastic tool for Next.js applications.

Why Choose Prisma for Next.js?

Prisma offers several key advantages for your Next.js projects:

  • Type-Safety: It generates a type-safe client based on your database schema, catching errors at compile time.
  • Developer Experience: Provides excellent auto-completion and readability for database queries.
  • Migrations: Helps manage changes to your database schema over time in a controlled way.
  • Modern Tooling: Integrates smoothly with modern JavaScript/TypeScript workflows and serverless environments.

Prisma's Core Components

Prisma isn't just one tool; it's a suite of tools that work together:

  • Prisma Client: An auto-generated, type-safe query builder for your database. This is what you'll use in your code.
  • Prisma Migrate: A migration system to evolve your database schema and keep it in sync with your Prisma schema.
  • Prisma Studio: A visual GUI to view and edit data in your database.

Prerequisites for Setup

Before we dive into setting up Prisma in your Next.js project, make sure you have these:

  • An existing Next.js project (we'll assume you have one ready).
  • Node.js and npm/yarn installed on your machine.
  • A database. For local development, SQLite is easy to start with, or you can use PostgreSQL, MySQL, SQL Server, or MongoDB.

Installing Prisma Packages

First, you need to install the Prisma CLI and the Prisma Client library as development dependencies in your Next.js project. Open your terminal in your project's root directory and run:

npm install prisma @prisma/client

Initializing Prisma in Your Project

After installation, you'll initialize Prisma in your project. This command sets up the necessary files for Prisma to work. Run this in your terminal:

npx prisma init

What `prisma init` Does

The npx prisma init command performs two important actions:

  • It creates a new directory named prisma in your project root, containing a file called schema.prisma. This file defines your database schema.
  • It creates a .env file in your project root. This file is used to store environment variables, most importantly your database connection URL.

Exploring `schema.prisma` Structure

The prisma/schema.prisma file is central to Prisma. It's where you define your database models and connection details. Here's what it looks like initially:

datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

generator client {
  provider = "prisma-client-js"
}

Configuring Your Database URL

The .env file created earlier is where you'll specify your database connection string. For local development, you might use SQLite, which is file-based. Update your .env file to point to your database:

# .env
DATABASE_URL="file:./dev.db"

Quick Check: Prisma Setup

You've learned about Prisma's purpose and initial setup steps. Let's test your understanding!

Recap: Getting Started with Prisma

In this lesson, we introduced Prisma ORM, understanding its role in bridging your application code with your database. We covered its key benefits like type-safety and improved developer experience, and explored its core components: Prisma Client, Migrate, and Studio.

You also learned the initial steps to integrate Prisma into a Next.js project, including installing the necessary packages and using npx prisma init to set up your schema.prisma and .env files. You're now ready to define your database schema!

البدء مجانًا

تعلم TypeScript مع معلم ذكاء اصطناعي — مجانًا

اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.

الدورات
12
الدروس
48

الأسئلة الشائعة

هل درس «مقدمة إلى Prisma ORM» مجاني؟

نعم — نص درس «مقدمة إلى Prisma ORM» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Next.js 15 Fullstack Web Apps، انتقل إلى CoddyKit PRO. تتضمن دورة Next.js 15 Fullstack Web Apps 4 دروس في المجموع.

ماذا ستتعلم في «مقدمة إلى Prisma ORM»؟

افهم ماهية Prisma وفوائدها، وكيفية إعدادها في مشروع Next.js. تتمرن على Next.js 15 Fullstack Web Apps مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Next.js 15 Fullstack Web Apps؟

لا تُشترط خبرة سابقة. Next.js 15 Fullstack Web Apps على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.

كم من الوقت يستغرق درس «مقدمة إلى Prisma ORM»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Next.js 15 Fullstack Web Apps هذا؟

نعم. كل درس في Next.js 15 Fullstack Web Apps يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. مقدمة إلى Prisma ORM
  2. تصميم مخطط Prisma وعمليات الترحيل
  3. عمليات CRUD باستخدام Prisma Client
  4. العلاقات والاستعلامات المتقدمة باستخدام Prisma
← العودة إلى Next.js 15 Fullstack Web Apps