Welcome to my submission for the YouApp Frontend Developer recruitment test. This project is structured and developed using Next.js 13 with Atomic Design methodology.

1. Introduction
2. Atomic Design Methodology
3. Getting Started
4. Tasks
5. Deployment

This project showcases a frontend implementation for YouApp using the principles of Atomic Design. Atomic Design is a methodology for creating design systems that decompose the user interface into smaller, reusable components.

Atomic Design divides the UI into five distinct levels:

1. Atoms: Basic building blocks of matter, such as buttons, inputs, labels.
2. Molecules: Groups of atoms bonded together, e.g., a form label, input, and button.
3. Organisms: Complex UI components composed of molecules and atoms, e.g., a header or a card.
4. Templates: Page-level objects that place components into a layout and articulate the design's content structure.
5. Pages: Specific instances of templates that show what a UI looks like with real content.

This is a Next.js project bootstrapped with create-next-app.

First, run the development server:

yarn dev

Open http://localhost:3000 with your browser to see the result.

Create Mobile Webapp in Nextjs - Open the figma link below:

• ✔️ Create using Nextjs 13 with app router based on design.
• ✔️ Implement tailwind css custom and modular configuration
• ✔️ Usage of good design patterns & react architecture patterns.
• ✔️ Build and Connect with API

Open https://youapp-fe.vercel.app with your browser to see the result.