Schema definition in NextJS - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ component_behavior

intermediate

What is the output of this Next.js schema validation?

Given this Next.js schema using Zod, what will be the result of validating { age: 20 }?

NextJS

import { z } from 'zod';

const userSchema = z.object({
  name: z.string().min(1),
  age: z.number().int().min(18),
});

const result = userSchema.safeParse({ age: 20 });
console.log(result.success);

A Throws a runtime error

B true

C false

D undefined

💡 Hint

Check if all required fields are present in the object.

The schema requires both name and age. Since name is missing, validation fails and result.success is false.

📝 Syntax

intermediate

Which option correctly defines a Next.js schema for a user with optional email?

Choose the correct Zod schema that defines a user object with a required username string and an optional email string.

A z.object({ username: z.string().optional(), email: z.string() })

B z.object({ username: z.string().required(), email: z.string() })

C z.object({ username: z.string(), email: z.string().nullable() })

D z.object({ username: z.string(), email: z.string().optional() })

💡 Hint

Optional fields use the .optional() method in Zod.

Option D correctly marks email as optional. Option D makes username optional which is wrong. Option D allows email to be null but not missing. Option D uses .required() which is not a Zod method.

🔧 Debug

advanced

Why does this Next.js schema validation throw an error?

Examine the code and identify why validation throws an error instead of returning a result.

NextJS

import { z } from 'zod';

const productSchema = z.object({
  id: z.number(),
  price: z.number().positive(),
});

const data = { id: 1, price: -5 };

const result = productSchema.parse(data);
console.log(result);

A Because price is negative and parse throws on invalid data

B Because id is not a string

C Because parse returns undefined on failure

D Because the schema is missing a required field

💡 Hint

Check the value constraints on the price field.

The price field must be positive. Since -5 is negative, parse throws an error instead of returning a result.

❓ state_output

advanced

What is the value of isValid after this Next.js schema check?

Given this code, what is the value of isValid after validation?

NextJS

import { z } from 'zod';

const loginSchema = z.object({
  email: z.string().email(),
  password: z.string().min(8),
});

const input = { email: '[e-mail]', password: '1234567' };

const isValid = loginSchema.safeParse(input).success;

A true

B false

C Throws a TypeError

D undefined

💡 Hint

Check the minimum length required for password.

The password is only 7 characters but the schema requires at least 8, so validation fails and isValid is false.

🧠 Conceptual

expert

Which statement about Next.js schema definitions with Zod is correct?

Select the only true statement about using Zod schemas in Next.js for data validation.

A Zod schemas can be used both server-side and client-side for consistent validation.

B Zod schemas can only validate client-side data, not server-side.

C Zod automatically converts all input data types to strings during validation.

D Zod schemas require manual error handling for every validation failure.

💡 Hint

Think about where Next.js code runs and how Zod works.

Zod schemas are JavaScript objects and can be used anywhere JavaScript runs, including both server and client in Next.js, ensuring consistent validation.