Why database access matters in NextJS - Test Your Understanding

Practice - 5 Tasks

1fill in blank

easy

Complete the code to import the database client in a Next.js server component.

NextJS

import [1] from '@/lib/dbClient';

Drag options to blanks, or click blank then click option'

AdbClient

BReact

CuseState

Dfetch

Attempts:

3 left

💡 Hint

Common Mistakes

Importing React instead of the database client

Using useState which is a React hook

Trying to import fetch as the database client

We import the database client to access the database in Next.js server components.

2fill in blank

medium

Complete the code to fetch all users from the database using the client.

NextJS

const users = await dbClient.[1].findMany();

Drag options to blanks, or click blank then click option'

Acreate

Bdelete

CfindMany

Dupdate

Attempts:

3 left

💡 Hint

Common Mistakes

Using create instead of findMany

Using delete or update which modify data

The findMany method fetches multiple records from the database.

3fill in blank

hard

Fix the error in the code to correctly fetch a user by ID.

NextJS

const user = await dbClient.user.findUnique({ where: { id: [1] } });

Drag options to blanks, or click blank then click option'

AuserId

Bid

Cuser.id

DuserId.value

Attempts:

3 left

💡 Hint

Common Mistakes

Using a variable name that does not match the field

Using dot notation incorrectly

The where clause expects the exact field name id with the value to match.

4fill in blank

hard

Fill both blanks to create a new user with name and email.

NextJS

await dbClient.user.create({ data: { name: [1], email: [2] } });

Drag options to blanks, or click blank then click option'

A"Alice"

B"[e-mail]"

CuserName

DuserEmail

Attempts:

3 left

💡 Hint

Common Mistakes

Using variable names instead of string literals

Missing quotes around strings

We provide string values for name and email inside the data object.

5fill in blank

hard

Fill all three blanks to update a user's email by ID.

NextJS

await dbClient.user.update({ where: { id: [1] }, data: { email: [2] }, select: { [3]: true } });

Drag options to blanks, or click blank then click option'

AuserId

B"[e-mail]"

Cemail

Did

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong variable names

Not quoting the new email string

Selecting wrong fields

We specify the user ID, new email string, and select the email field to return.