Đăng nhập không cần mật khẩu trong NextJs 13

Bài viết này sẽ đi sâu vào các bước cần thiết để triển khai xác thực không cần mật khẩu trong dự án Next.js bằng thư viện NextAuth.js. Ngoài ra, chúng tôi sẽ sử dụng Prisma làm bộ điều hợp cơ sở dữ liệu để đạt được điều này.

Xác thực không cần mật khẩu là một cách tiếp cận sáng tạo giúp loại bỏ nhu cầu kết hợp tên người dùng và mật khẩu truyền thống. Thay vào đó, nó mang lại trải nghiệm xác thực an toàn và thân thiện hơn với người dùng bằng cách tận dụng các phương pháp thay thế, chẳng hạn như liên kết ma thuật qua email hoặc mã một lần được gửi qua SMS.

Next.js là một framework React phổ biến để xây dựng các ứng dụng web, được biết đến vì tính đơn giản và hiệu quả. Chúng tôi có thể dễ dàng kết hợp xác thực không cần mật khẩu vào dự án của mình bằng cách tích hợp NextAuth.js, một thư viện xác thực được thiết kế rõ ràng cho Next.js.

Ngoài ra, chúng tôi sẽ dựa vào Prisma làm bộ điều hợp cơ sở dữ liệu của mình. Prisma là một công cụ ORM (Ánh xạ quan hệ đối tượng) giúp đơn giản hóa các tương tác cơ sở dữ liệu bằng cách cung cấp trình tạo truy vấn được tạo tự động và an toàn theo loại. Nó hỗ trợ nhiều cơ sở dữ liệu, bao gồm PostgreSQL, MySQL và SQLite, khiến nó trở thành lựa chọn linh hoạt cho việc triển khai xác thực của chúng tôi.

Trong suốt hướng dẫn này, chúng tôi sẽ cung cấp hướng dẫn từng bước về cách thiết lập và định cấu hình xác thực không cần mật khẩu bằng NextAuth.js trong dự án Next.js. Chúng tôi cũng sẽ trình bày cách tích hợp Prisma làm bộ điều hợp cơ sở dữ liệu, cho phép liên lạc liền mạch giữa ứng dụng và cơ sở dữ liệu của chúng tôi.

Bây giờ chúng ta sẽ khám phá cách cải thiện tính bảo mật và trải nghiệm người dùng của ứng dụng Next.js bằng cách sử dụng xác thực không cần mật khẩu cũng như các khả năng của NextAuth.js và Prisma. Hãy bắt đầu.

Đăng nhập không cần mật khẩu là gì?

Đăng nhập không mật khẩu, như tên cho thấy, là một phương pháp xác thực giúp loại bỏ nhu cầu kết hợp tên người dùng và mật khẩu truyền thống. Thay vào đó, nó sử dụng các phương tiện thay thế để xác minh danh tính người dùng, chẳng hạn như các liên kết ma thuật qua email hoặc mã một lần được gửi qua SMS. Cách tiếp cận này cung cấp một số lợi thế so với các phương thức đăng nhập truyền thống. Thứ nhất, nó loại bỏ nguy cơ xảy ra các lỗ hổng liên quan đến mật khẩu, chẳng hạn như mật khẩu yếu hoặc sử dụng lại mật khẩu. Thứ hai, nó đơn giản hóa trải nghiệm người dùng bằng cách loại bỏ nhu cầu ghi nhớ và nhập mật khẩu phức tạp.

Để triển khai đăng nhập không cần mật khẩu bằng cách sử dụng các liên kết ma thuật email hoặc mã một lần, chúng tôi cần một máy chủ SMTP (Giao thức truyền thư đơn giản).

Máy chủ SMTP chịu trách nhiệm gửi email qua Internet. Trong bối cảnh xác thực không cần mật khẩu, máy chủ sẽ gửi các liên kết ma thuật hoặc mã một lần đến địa chỉ email đã đăng ký của người dùng. Khi người dùng bắt đầu quá trình đăng nhập, một email chứa liên kết hoặc mã duy nhất sẽ được tạo và gửi cho người dùng. Sau đó, người dùng có thể nhấp vào liên kết hoặc nhập mã để hoàn tất quá trình xác thực. Máy chủ SMTP đóng vai trò trung gian giữa ứng dụng và dịch vụ email của người dùng, đảm bảo việc gửi tin nhắn xác thực an toàn và đáng tin cậy. Bằng cách sử dụng máy chủ SMTP, chúng tôi có thể triển khai đăng nhập không cần mật khẩu một cách hiệu quả và cung cấp trải nghiệm xác thực liền mạch cho người dùng của mình.

Hãy bắt đầu!

Đầu tiên, chúng ta cần tạo một dự án Next.js mới. Để thực hiện việc này, hãy sử dụng lệnh sau:

npx create-next-app@latest

Sau khi tạo dự án Next.js mới, bạn có thể điều hướng đến thư mục dự án mới tạo.

Bằng cách thay đổi thư mục vào dự án, bạn sẽ có thể khám phá các thư mục và tệp khác nhau tạo nên cấu trúc dự án Next.js.

Hiểu cấu trúc dự án là điều cần thiết để phát triển và tổ chức hiệu quả ứng dụng Next.js của bạn. Bằng cách tham khảo tài liệu chính thức, bạn có thể tận dụng các phương pháp hay nhất và hiểu rõ hơn về cách cấu trúc mã, quản lý nội dung tĩnh và tạo ra các thành phần có thể tái sử dụng.

Cài đặt các phần phụ thuộc của chúng tôi

Để bật xác thực không cần mật khẩu trong dự án Next.js bằng NextAuth.js, trước tiên chúng ta phải cài đặt các phần phụ thuộc cần thiết. Chạy lệnh yarn add next-auth nodemailer để thêm cả NextAuth.js và nodemailer vào dự án của chúng ta.

Chúng tôi đặc biệt sử dụng nodemailer vì đây là mô-đun phổ biến và linh hoạt để gửi email trong Node.js. Nó cung cấp một cách đơn giản và đáng tin cậy để gửi các liên kết ma thuật hoặc mã một lần cần thiết để xác thực không cần mật khẩu qua email.

Tiếp theo, hãy tích hợp Prisma làm bộ điều hợp cơ sở dữ liệu của chúng tôi. Bắt đầu bằng cách cài đặt các gói Prisma cần thiết bằng lệnh:

yarn add @prisma/client @next-auth/prisma-adapter

Các gói này sẽ cho phép liên lạc liền mạch giữa ứng dụng Next.js của chúng tôi và cơ sở dữ liệu. Ngoài ra, chúng ta cũng cần cài đặt Prisma làm phần phụ thuộc của nhà phát triển bằng cách chạy:

yarn add prisma --dev

Bước này đảm bảo chúng ta có các công cụ cần thiết để làm việc với Prisma và trình tạo truy vấn được tạo tự động của nó để tương tác với cơ sở dữ liệu.

Bằng cách cài đặt các phần phụ thuộc này, chúng tôi đặt nền tảng cho việc triển khai xác thực không cần mật khẩu bằng NextAuth.js và Prisma trong dự án Next.js của chúng tôi.

Cài đặt Prisma

Cần thiết lập Prisma và có quyền truy cập vào máy chủ SMTP để gửi email nhằm sử dụng xác thực không cần mật khẩu trong dự án Next.js. Hướng dẫn này sẽ hướng dẫn bạn cách sử dụng tài khoản Gmail cá nhân để gửi email. Thực hiện theo các bước dưới đây để thiết lập thành công.

Đầu tiên, tạo thư mục "prisma" ở thư mục gốc của dự án. Thư mục này sẽ chứa các tập tin và cấu hình liên quan đến Prisma. Sau đó, trong thư mục "prisma", hãy tạo một tệp mới có tên "schema.prisma". Tệp lược đồ xác định cấu trúc cơ sở dữ liệu của bạn và dùng làm bản thiết kế cho mã được tạo tự động của Prisma.

Nếu bạn chưa quen với khái niệm lược đồ, đừng lo lắng! Lược đồ chỉ định các bảng, trường, mối quan hệ và ràng buộc trong cơ sở dữ liệu của bạn. Để tạo lược đồ, bạn có thể tham khảo tài liệu chính thức của NextAuth.js và sao chép lược đồ mẫu được cung cấp ở đó. Lược đồ này là điểm khởi đầu và có thể được tùy chỉnh để phù hợp với yêu cầu ứng dụng của bạn.

Tiếp theo, tạo tệp ".env" ở thư mục gốc dự án của bạn. Tệp này sẽ lưu trữ các biến môi trường của bạn, bao gồm các cấu hình cần thiết cho máy chủ SMTP của bạn. Để điền vào tệp ".env", bạn có thể sao chép các cấu hình mẫu được cung cấp bên dưới. Đảm bảo nhập thông tin đăng nhập tài khoản Gmail và cài đặt máy chủ SMTP của bạn vào các trường tương ứng.

EMAIL_SERVER_USER="YourGmailAddress"
EMAIL_SERVER_PASSWORD="GmailPassOrGeneratedPass"
EMAIL_SERVER_HOST=smtp.gmail.com
EMAIL_SERVER_PORT=587
EMAIL_FROM="noreply@example.com"

NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=ThisNeedsToBeSuperSecret

Bằng cách làm theo các bước này, bạn sẽ thiết lập Prisma và định cấu hình máy chủ SMTP để gửi email bằng tài khoản Gmail của mình. Những bước chuẩn bị này rất quan trọng để kích hoạt luồng xác thực không cần mật khẩu trong dự án Next.js của bạn.

Ghi chú

Bạn phải tạo mật khẩu ứng dụng nếu bạn đã bật Xác thực hai yếu tố (2FA) cho tài khoản Google của mình. Mật khẩu ứng dụng là mật khẩu riêng biệt cấp quyền truy cập vào các ứng dụng hoặc thiết bị cụ thể mà không làm lộ mật khẩu tài khoản Google chính của bạn. Thực hiện theo các hướng dẫn bên dưới để tạo mật khẩu ứng dụng.

Truy cập trang cài đặt Tài khoản Google bằng cách truy cập vào https://myaccount.google.com/.
Điều hướng đến tab "Bảo mật".
Tìm phần "2FA", cuộn xuống và chọn "Mật khẩu ứng dụng".

Bạn có thể được nhắc nhập lại mật khẩu tài khoản Google của mình để xác minh bảo mật.
Trong danh sách thả xuống "Chọn ứng dụng", chọn "Thư" hoặc "Khác (Tên tùy chỉnh)".

Nếu tùy chọn "Thư" có sẵn, hãy chọn nó.
Nếu tùy chọn "Thư" không khả dụng, hãy chọn "Khác (Tên tùy chỉnh)" và cung cấp tên tùy chỉnh để nhận dạng.

Nhấp vào nút "Tạo" hoặc "Tạo mật khẩu".
Google sẽ tạo mật khẩu ứng dụng duy nhất cho bạn. Hãy ghi lại mật khẩu này vì chúng tôi sẽ sử dụng mật khẩu này trong ứng dụng gửi email của mình.
Sử dụng mật khẩu ứng dụng đã tạo này trong cấu hình máy chủ SMTP của ứng dụng Next.js của bạn. Thay thế mật khẩu tài khoản Gmail thông thường của bạn bằng mật khẩu ứng dụng này.

Điều này đảm bảo rằng ngay cả khi bật 2FA, ứng dụng của bạn vẫn có thể gửi email một cách an toàn bằng tài khoản Gmail của bạn.

PostgreSQL sử dụng Supabase

Trước khi có thể tiếp tục, chúng tôi cần đảm bảo rằng cơ sở dữ liệu cho dự án của chúng tôi hoạt động chính xác. Đối với bản demo này, chúng tôi khuyên bạn nên sử dụng cơ sở dữ liệu Supabase PostgreSQL. Để bắt đầu với dự án Supabase và lấy URL kết nối PostgreSQL, hãy làm theo các bước sau:

Truy cập supabase.io và đăng nhập vào tài khoản của bạn hoặc tạo tài khoản mới nếu bạn chưa có.
Sau khi đăng nhập, bạn sẽ được chuyển đến bảng điều khiển Supabase. Nhấp vào "Tạo dự án mới" để bắt đầu một dự án mới.
Đặt tên cho dự án của bạn và chọn khu vực gần vị trí hiện tại của bạn nhất. Hãy nhớ mật khẩu của bạn, bạn sẽ cần nó sau này.
Khi bạn đã tạo dự án, bạn sẽ được đưa đến bảng thông tin dự án. Nhấp vào "Cơ sở dữ liệu" trên thanh bên trái để truy cập cài đặt cơ sở dữ liệu.
Trong phần "Cơ sở dữ liệu", bạn sẽ tìm thấy URL kết nối PostgreSQL. URL này chứa tất cả thông tin cần thiết để kết nối với cơ sở dữ liệu của dự án Supabase của bạn, chẳng hạn như máy chủ, cổng, tên cơ sở dữ liệu, tên người dùng và mật khẩu. Nó sẽ được hiển thị ở định dạng: postgres://<username>:<password>@<host>:<port>/<database>

Sao chép URL kết nối PostgreSQL và giữ an toàn. Bạn sẽ cần nó để thiết lập kết nối giữa ứng dụng của bạn và cơ sở dữ liệu Supabase.

    // .env
    
    DATABASE_URL=postgresql://postgres:[Password]@db.ixjsisbwdafsjvgifliu.supabase.co:5432/postgres
    ```

Bây giờ, hãy đảm bảo rằng chúng tôi tạo ứng dụng khách Prisma bằng cách chạy lệnh sau: `npx prisma generate`.

Máy khách Prisma là máy khách cơ sở dữ liệu được tạo tự động dựa trên lược đồ của bạn. Theo mặc định, Ứng dụng khách Prisma được tạo trong thư mục `node_modules/.prisma/client`, nhưng bạn có thể [chỉ định vị trí tùy chỉnh nếu cần](https://www.prisma.io/docs/concepts/components/prisma-client/working-with-prismaclient/generating-prisma-client#using-a-custom-output-path).

Tiếp theo, chúng ta sẽ tiến hành tạo di chuyển ban đầu. Chạy lệnh sau: `npx prisma di chuyển dev`. Bạn có thể đặt cho mỗi lần di chuyển một tên mô tả.

Trong Prisma, di chuyển là một phương pháp được sử dụng để quản lý các điều chỉnh đối với lược đồ cơ sở dữ liệu của bạn theo thời gian. Nó cho phép bạn sửa đổi cấu trúc cơ sở dữ liệu của mình mà không làm mất bất kỳ dữ liệu nào có sẵn. Những lần di chuyển này rất quan trọng vì chúng đảm bảo rằng lược đồ cơ sở dữ liệu của bạn phù hợp với nhu cầu của ứng dụng khi chúng thay đổi. Với công cụ di chuyển của Prisma, bạn có thể tạo phiên bản, áp dụng và hoàn nguyên những thay đổi này một cách thuận tiện, đơn giản hóa hoạt động làm việc nhóm và duy trì lược đồ cơ sở dữ liệu thống nhất trên nhiều môi trường khác nhau.

Bây giờ, nếu chúng tôi kiểm tra cơ sở dữ liệu của mình, chúng tôi sẽ có thể thấy những thay đổi từ quá trình di chuyển ban đầu được phản ánh trong phần cơ sở dữ liệu.

Bằng cách thực hiện quá trình di chuyển ban đầu, chúng tôi đã áp dụng các sửa đổi cho lược đồ cơ sở dữ liệu của mình như được xác định trong tập lệnh di chuyển.

![Database Tables after Migration](https://drive.google.com/uc?export=view&id=1PZ6ban5h4VZs3UHQoJS_5kNYkhqs-MAx)

### Thiết lập NextAuthJS với Prisma Adaptor

Trong ứng dụng Next.js, NextAuthJS sử dụng tuyến tổng hợp, còn được gọi là tuyến ký tự đại diện hoặc tuyến dự phòng, để quản lý các yêu cầu xác thực. Tuyến động này được xác định bằng hệ thống định tuyến dựa trên tệp trong Next.js.

Tạo một thư mục có tên "**api**" bên trong thư mục "**app**" của bạn. Trong thư mục "**api**", tạo thư mục "**auth**". Bên trong thư mục "**auth**", hãy tạo một tuyến đường tổng hợp có tên "**[...nextauth]**" làm thư mục. Cuối cùng, tạo tệp "**route.ts**" bên trong thư mục tuyến đường tổng hợp và thêm mã sau đây.

```jsx
// app/api/auth/[...nextauth]/route.ts
import { PrismaAdapter } from '@next-auth/prisma-adapter';
import { PrismaClient } from '@prisma/client';
import NextAuth from 'next-auth';
import EmailProvider from 'next-auth/providers/email';

const prisma = new PrismaClient();

export const authOptions = {
  adapter: PrismaAdapter(prisma),
  providers: [
    EmailProvider({
      server: {
        host: process.env.EMAIL_SERVER_HOST,
        port: process.env.EMAIL_SERVER_PORT,
        auth: {
          user: process.env.EMAIL_SERVER_USER,
          pass: process.env.EMAIL_SERVER_PASSWORD,
        },
      },
      from: process.env.EMAIL_FROM,
    }),
  ]
};

const handler = NextAuth(authOptions);

export { handler as GET, handler as POST };

Trong tệp lộ trình tổng hợp, chúng tôi nhập thư viện NextAuthJS và thiết lập các tùy chọn xác thực, nhà cung cấp và cấu hình. NextAuthJS xử lý việc phân tích cú pháp các yêu cầu đến, xác định hành động xác thực cần thiết và thực thi logic thích hợp theo các tùy chọn đã chỉ định.

Mã được cung cấp sẽ thiết lập NextAuthJS với bộ điều hợp Prisma để xác thực bằng nhà cung cấp email. Hãy giải thích từng câu:

Nhập khẩu:

PrismaAdapter và PrismaClient lần lượt được nhập từ @next-auth/prisma-adapter và @prisma/client. Chúng được sử dụng để tích hợp NextAuthJS với Prisma.
NextAuth được nhập từ next-auth và là thư viện chính để xử lý xác thực trong các ứng dụng Next.js.
EmailProvider được nhập từ next-auth/providers/email và được sử dụng làm nhà cung cấp để xác thực dựa trên email.

Thiết lập Prisma:

Một phiên bản của PrismaClient được tạo bằng cách sử dụng new PrismaClient(). Điều này cho phép giao tiếp với Prisma ORM và cơ sở dữ liệu cơ bản.

Tùy chọn xác thực:

authOptions là đối tượng xác định cấu hình xác thực trong NextAuthJS.
Thuộc tính adapter được đặt thành PrismaAdapter(prisma), thuộc tính này kết nối NextAuthJS với Prisma bằng cách sử dụng PrismaAdapter.
Mảng providers chứa một nhà cung cấp duy nhất, EmailProvider. Nó được cấu hình với các chi tiết máy chủ email cần thiết và địa chỉ email from.

Trình xử lý NextAuth:

Hàm NextAuth được gọi với authOptions làm đối số, tạo trình xử lý xác thực.
Trình xử lý kết quả được gán cho biến handler.

Xuất khẩu:

handler được xuất dưới dạng GET và POST để hỗ trợ cả yêu cầu HTTP GET và POST.

Bây giờ, hãy chạy máy chủ của chúng tôi và kiểm tra chức năng. Đầu tiên, khởi động máy chủ phát triển bằng cách chạy yarn dev. Tiếp theo, mở trình duyệt của bạn và truy cập localhost:3000 để xem ứng dụng hoạt động.

Để kiểm tra chức năng xác thực, hãy truy cập localhost:3000/api/auth/signin. Tại đây, bạn sẽ trải nghiệm sự kỳ diệu của NextAuthJS. Mẫu được cung cấp kèm theo NextAuthJS cho phép quá trình đăng nhập không cần mật khẩu. Để dùng thử, hãy nhập một địa chỉ email hợp lệ.

Sau khi bạn gửi email, NextAuthJS sẽ xử lý quy trình hậu trường. Đầu tiên, nó sẽ tạo và gửi một email chứa liên kết đăng nhập duy nhất đến địa chỉ email được cung cấp. Liên kết này đóng vai trò là mã thông báo xác thực an toàn cho người dùng. Sau đó, khi người dùng nhấp vào liên kết, NextAuthJS sẽ xác thực mã thông báo và xác thực người dùng.

Tính năng đăng nhập không cần mật khẩu này nâng cao tính bảo mật và trải nghiệm người dùng bằng cách loại bỏ nhu cầu sử dụng mật khẩu. Người dùng có thể truy cập tài khoản của mình một cách nhanh chóng và an toàn chỉ bằng cách nhấp vào liên kết nhận được qua email. Nó hợp lý hóa quá trình đăng nhập và giảm nguy cơ lỗ hổng liên quan đến mật khẩu.

Khi người dùng nhấp vào email đăng nhập do NextAuthJS tạo và được xác thực, một số hành động sẽ diễn ra ở hậu trường để tạo điều kiện cho trải nghiệm đăng nhập liền mạch.

1. Xác thực liên kết email: Khi người dùng nhấp vào liên kết đăng nhập, NextAuthJS sẽ xác thực mã thông báo xác thực được nhúng trong liên kết. Mã thông báo này đảm bảo tính bảo mật và tính toàn vẹn của quá trình xác thực.

Quy trình xác thực: Sau khi xác thực mã thông báo thành công, NextAuthJS sẽ xác định người dùng và hoàn tất quy trình xác thực. Nó xác minh danh tính của người dùng dựa trên mã thông báo được cung cấp và bất kỳ yếu tố xác thực bổ sung nào được định cấu hình, chẳng hạn như xác thực đa yếu tố.

3. Tạo phiên: Sau khi xác thực thành công, NextAuthJS sẽ tạo một phiên cho người dùng. Phiên là trạng thái liên tục thể hiện trạng thái xác thực của người dùng và cho phép họ truy cập các tài nguyên được bảo vệ mà không cần phải xác thực lại cho các yêu cầu tiếp theo.

4. Cookie: NextAuthJS đặt cookie an toàn chỉ HTTP trong trình duyệt của người dùng để quản lý phiên. Những cookie này đóng vai trò quan trọng trong việc duy trì trạng thái xác thực của người dùng qua nhiều yêu cầu. Các cookie thường bao gồm cookie phiên và tùy chọn cookie mã thông báo làm mới, tùy thuộc vào cấu hình xác thực.

Cookie phiên: Cookie phiên chứa mã định danh phiên (ví dụ: chuỗi được tạo ngẫu nhiên) xác định duy nhất phiên của người dùng. Nó giúp NextAuthJS liên kết các yêu cầu tiếp theo với đúng phiên và người dùng.
Cookie mã thông báo CSRF: NextAuthJS đặt cookie mã thông báo CSRF (Giả mạo yêu cầu chéo trang web) để bảo vệ khỏi các cuộc tấn công CSRF. Mã thông báo CSRF là giá trị duy nhất do NextAuthJS tạo và được lưu trữ trong cookie. Nó được sử dụng để xác thực và xác minh tính xác thực của các yêu cầu tiếp theo do người dùng thực hiện. Khi người dùng gửi biểu mẫu hoặc thực hiện các hành động nhạy cảm, mã thông báo CSRF sẽ được bao gồm trong tiêu đề hoặc nội dung yêu cầu để đảm bảo rằng yêu cầu bắt nguồn từ phiên của người dùng đã xác thực chứ không phải từ nguồn độc hại.
Cookie URL gọi lại: NextAuthJS đặt cookie URL gọi lại để lưu trữ URL gốc mà người dùng đang cố truy cập trước khi được chuyển hướng đến quy trình xác thực. Cookie này giúp NextAuthJS chuyển hướng người dùng quay lại trang mong muốn sau khi xác thực thành công. Nó đảm bảo trải nghiệm người dùng mượt mà bằng cách đưa người dùng trở lại đích dự định của họ một cách liền mạch thay vì một trang đích chung chung.

Bằng cách sử dụng cookie an toàn chỉ HTTP, NextAuthJS đảm bảo rằng trạng thái xác thực vẫn an toàn và chống giả mạo. Cookie được mã hóa, ngăn chặn sự truy cập hoặc sửa đổi trái phép của các tác nhân độc hại.

Bạn đã tích hợp thành công NextAuthJS với bộ chuyển đổi Prisma vào ứng dụng Next.js của mình! Với sự dễ dàng và khả năng thích ứng do NextAuthJS cung cấp, giờ đây bạn có một hệ thống xác thực đáng tin cậy.

Hãy xem kho lưu trữ GitHub được liên kết bên dưới để biết mã được sử dụng trong hướng dẫn này: https://github.com/codelabsacademy/next-auth-guide.

Nhưng tại sao lại dừng ở đây? Nếu bạn đam mê phát triển web và mong muốn nâng cao kỹ năng của mình, hãy cân nhắc đăng ký tham gia chương trình đào tạo phát triển web của chúng tôi. Bootcamp của chúng tôi mang đến trải nghiệm học tập toàn diện, trang bị cho bạn kiến thức và kỹ năng thực tế cần thiết để vượt trội trong thế giới phát triển web năng động.

Khi tham gia chương trình đào tạo của chúng tôi, bạn sẽ có được trải nghiệm thực tế với các công nghệ tiên tiến, làm việc trong các dự án thực tế và nhận được hướng dẫn cá nhân từ các chuyên gia trong ngành. Cho dù bạn là người mới bắt đầu hay nhà phát triển có kinh nghiệm, chương trình của chúng tôi được thiết kế để nâng kỹ năng phát triển web của bạn lên một tầm cao mới.

Đừng bỏ lỡ cơ hội này để đẩy nhanh hành trình phát triển web của bạn. Đăng ký chương trình đào tạo phát triển web của chúng tôi ngay hôm nay và phát huy hết tiềm năng của bạn trong lĩnh vực phát triển web thú vị. Hãy cùng nhau xây dựng những trải nghiệm kỹ thuật số tuyệt vời và định hình tương lai của web.

Triển khai đăng nhập không cần mật khẩu trong Dự án Next.js 13 với NextAuth.js và Prisma

Đăng nhập không cần mật khẩu là gì?

Hãy bắt đầu!

Cài đặt các phần phụ thuộc của chúng tôi

Cài đặt Prisma

PostgreSQL sử dụng Supabase

Dịch vụ nghề nghiệp

Hãy giữ liên lạc