Getting Started

Baseel Assessment : Tasks:

Task 1: Create a Next.js Application Create a new Next.js application with the following requirements:

• Setup a basic Next.js project structure.Create two pages: Home and About.Add a navigation menu to navigate between the Home and About pages.

Task 2: Fetch Data from an API Integrate API data fetching into your Next.js application:

• Fetch and display a list of users from the JSONPlaceholder API (https://jsonplaceholder.typicode.com/users).Display the user's name, email, and website in a styled list on the Home page.Ensure that the data is fetched and displayed server-side.

Task 3: Dynamic Routing Implement dynamic routing in your Next.js application:

• Create a dynamic route for individual user profiles.Clicking on a user's name from the user list should navigate to their profile page.Display the user's details (name, email, website) on their profile page.

Task 4: Form Submission Implement a simple form submission feature:

• Create a contact form with fields for name, email, and message on the About page.Implement client-side form validation to ensure all fields are filled out correctly.Upon form submission, log the form data to the console.

Task 5: Styling and Layout Enhance the visual appearance of your Next.js application:

• Use CSS modules or styled-components to style your components.Ensure that the application is responsive and looks good on both desktop and mobile devices.

Used:

• Next js
• TypeScript
• Eslint
• Styled Components
• React-toastify

Before start the project run below the command on Development in root folder:

    npm install 

    npm run dev

On productions

    npm run build 

    npm start 

Eslint

    npm lint

Live URL : https://baseel-nextjs-assessment-1gaj.vercel.app/