+
+ Create Project
+
+
+
);
};
-```
-By following these guidelines, you can effectively build and manage forms in our application,
-ensuring a smooth user experience and robust form handling.
\ No newline at end of file
+export default CreateProjectPage;
+```
\ No newline at end of file
diff --git a/docs/web/overview.mdx b/docs/web/overview.mdx
index b9fac8b5a..31fc16dda 100644
--- a/docs/web/overview.mdx
+++ b/docs/web/overview.mdx
@@ -7,21 +7,22 @@ It's crafted using a selection of advanced technologies and tools, making it a r
The core technologies include:
-- [Next.js](https://nextjs.org/): A React framework that supports features like server-side rendering, static site generation and routing.
+- [Next.js](https://nextjs.org/) (Pages Router): A React framework that supports features like server-side rendering, static site generation and routing.
- [TanStack Query](https://tanstack.com/query): A library for managing data fetching, caching, and updating in React apps.
-- [React Hook Form](https://react-hook-form.com/) + [Zod](https://zod.dev/): Efficient form management and schema validation tools.
-- [Mantine UI](https://mantine.dev/) + [Tabler](https://tabler-icons.io/): UI components and icons for responsive and accessible web interfaces.
+- [React Hook Form](https://react-hook-form.com/) + [Zod 4](https://zod.dev/): Efficient form management and schema validation tools.
+- [Tailwind CSS 4](https://tailwindcss.com/) + [shadcn/ui](https://ui.shadcn.com/): Utility-first CSS framework with accessible, customizable UI components.
+- [lucide-react](https://lucide.dev/): Beautiful & consistent icon set.
- [Typescript](https://www.typescriptlang.org/): JavaScript with syntax for types, enhancing scalability and maintainability.
## Web Starter Documentation Sections
Explore the following sections for detailed information on different aspects of the Web Starter:
-- [Styling](/web/styling): Focuses on the styling approach used in the application, detailing how to work with Mantine UI to create visually appealing interfaces.
+- [Styling](/web/styling): Focuses on the styling approach using Tailwind CSS 4 and shadcn/ui, with `cn()` for conditional class merging and CSS variables for theming.
- [Routing](/web/routing): Covers the routing mechanism within the application, explaining how to organize navigation flow.
-- [Calling API](/web/calling-api): Dedicated to API interactions, this section explains how to effectively make requests to back-end services, manage responses, and handle errors using the provided API service utilities.
-- [Forms](/web/forms): Discusses form management, highlighting the integration of React Hook Form and Zod for efficient form creation, validation, and handling user inputs.
-- [Services](/web/services): Describes the various service layers used in the application, such as the API, socket, and analytics services, providing examples of how to implement and utilize these services for different functionalities.
+- [Calling API](/web/calling-api): Dedicated to API interactions using the auto-generated typed API client, with `useApiQuery` and `useApiMutation` hooks for data fetching and mutations.
+- [Forms](/web/forms): Discusses form management, highlighting the integration of React Hook Form and Zod 4 with `useApiForm` for automatic schema resolution.
+- [Services](/web/services): Describes the various service layers used in the application, such as the API client, socket, and analytics services.
- [Environment Variables](/web/environment-variables): Guides on managing environment-specific configurations, explaining the use of different `.env` files for development, staging, and production environments, and the importance of securing sensitive data.
## React TypeScript Cheatsheet
diff --git a/docs/web/routing.mdx b/docs/web/routing.mdx
index fa89c9e27..72ae8f64f 100644
--- a/docs/web/routing.mdx
+++ b/docs/web/routing.mdx
@@ -4,10 +4,9 @@ title: "Routing"
Our application's routing is powered by [Next.js Pages router](https://nextjs.org/docs/pages), which is a standard for handling routes in Next.js applications.
-## Configuration in `routes.ts`
+## Page Configuration with `