Contacts Management Application - Frontend

This is the frontend code for a contacts management application, built using React.js, Redux, and TypeScript. It allows users to manage their contacts by adding, viewing, updating, and deleting contact details.

Project Structure

The frontend codebase is organized into several directories:

• src/components: Contains reusable React components used throughout the application.
• src/pages: Contains page-level components responsible for rendering different pages of the application, such as the "Add Contacts" page and the "All Contacts" page.
• src/redux: Contains the Redux store setup, including reducers, actions, and slices for managing application state.
• src/utils: Contains utility functions used across the application.

Setup

To set up and run the frontend code:

1. Clone the repository to your local machine.
2. Run npm install to install dependencies.
3. Run npm start to start the development server.
4. Access the application in your browser at http://localhost:5173.

Dependencies

The frontend code utilizes the following dependencies:

• React.js: JavaScript library for building user interfaces.
• Redux: State management library for managing application state.
• Redux Toolkit: Provides utilities for efficient Redux development, including simplified Redux setup.
• React Router: Routing library for navigation within the application.
• Styled Components: Library for styling React components using tagged template literals.
• Axios: HTTP client for making requests to the backend API.
• React Query: Library for data fetching and caching, used for API data fetching.
• Ant Design: styling and model and dashbord layout.
• framer-motion: styling animation.

Development Environment

The frontend code is developed using:

• Visual Studio Code: Code editor for writing and debugging code.
• ESLint: JavaScript linting tool for maintaining code quality and consistency.
• Prettier: Code formatter for ensuring consistent code style.
• TypeScript: Superset of JavaScript that adds static typing and improves code quality and readability.

Contributors

• Rian Islam

License

This project is licensed under the MIT License. Feel free to use and modify the code according to your needs.