This is a sample Next.js project demonstrating a basic layout for a web application. The application includes a header component, client-side navigation, and authentication using local storage.
You can access the live demo of this project here.
- Header Component: The application includes a header component that displays a company logo and user email.
- Client-side Navigation: It utilizes client-side navigation using the
useRouter
hook from Next.js to navigate between pages. - Authentication: The application checks for a token in local storage. If no token is found, it redirects the user to the login page.
- The
RootLayout
component is the main layout used across the application. - It checks for the presence of a token in local storage. If no token is found, it redirects the user to the login page.
- The header includes the company logo on the left and the user's email on the right.
- The header is clickable, and when clicked, it navigates the user to the "/packages" page.
- The header component is a part of the
RootLayout
component. - It displays the company logo and the user's email.
- The company logo is clickable, and when clicked, it navigates the user to the "/packages" page.
- It uses the
UserOutlined
icon from Ant Design for the user icon.
- Navigation is handled using the
useRouter
hook from Next.js. - Clicking on the company logo or the header component triggers navigation to the "/packages" page.
- Authentication is implemented by checking for the presence of a token in local storage.
- If no token is found, the user is redirected to the "/login" page.
To run this project locally:
- Clone this repository.
- Navigate to the project directory.
- Run
npm install
to install dependencies. - Run
npm run dev
to start the development server. - Open http://localhost:3000 in your browser to view the application.
- Next.js
- React
- Ant Design
This project is licensed under the MIT License. See the LICENSE file for details.