An open API service indexing awesome lists of open source software.

https://github.com/developersajadur/pxlhut-job-task

A simple and elegant multi-step form built with Next.js 14 (App Router), React Hook Form, Zod Schema Validation, React Query, and Tailwind CSS v4.
https://github.com/developersajadur/pxlhut-job-task

javascript nextjs reacthookform reactjs tailwindcss typescript zod-validation

Last synced: 7 months ago
JSON representation

A simple and elegant multi-step form built with Next.js 14 (App Router), React Hook Form, Zod Schema Validation, React Query, and Tailwind CSS v4.

Awesome Lists containing this project

README

          

# Multi-Step Form — Next.js + React Hook Form + Zod + React Query

A simple and elegant multi-step form built with **Next.js 14 (App Router)**, **React Hook Form**, **Zod Schema Validation**, **React Query**, and **Tailwind CSS v4**.

---

## 🚀 Features

- Multi-step form with client-side validation.
- Schema validation using **Zod**.
- API request simulation using **React Query** `useMutation`.
- **Tailwind CSS v4** with a clean, responsive design.
- Toast notifications using **Sonner**.

---

## 📦 Technologies

- Next.js 14
- React 18
- Tailwind CSS v4
- React Hook Form
- Zod
- React Query
- Sonner (for toast notifications)

---

## 🧑‍💻 Getting Started

Follow these steps to run the project locally:

---

### 1️⃣ Clone the Repository

```bash
git clone https://github.com/developersajadur/Pxlhut-Job-Task.git
cd Pxlhut-Job-Task

```

## 2️⃣ Install Dependencies

Make sure you have **Node.js 18+**, **typescript** installed.

Then install the dependencies:

```bash
npm install
```

## 3️⃣ Run the Development Server

```bash
npm run dev
```