Welcome to the frontend repository for the fintech app project! This project focuses on developing a user-friendly and visually appealing frontend interface using React. The goal is to provide a seamless experience for users, implementing various features and principles to enhance usability and functionality.
This project was bootstrapped with Create React App.
The application utilizes multiple route components to render two sections: the User section and the Admin section. This allows for efficient navigation and management of different user roles and functionalities.
The project employs a single page UI approach, incorporating a menu sidebar and dashboard. This layout provides a clear and organized structure for users to access various features and information easily.
To ensure secure access, the project incorporates a user registration and login authentication system. Protected routes are established, allowing only authenticated users to access certain sections or perform specific actions. Axios, a popular HTTP client library, is used for handling API requests and managing user authentication.
The application's structure is developed in alignment with the prototype design of the fintech product. This ensures consistency and maintains the intended user experience throughout the application.
Great emphasis is placed on providing the best possible styling to accurately represent the intended user experience design. The user interface is crafted with precision, focusing on aesthetics, usability, and intuitive interactions.
ReactJS is leveraged to enhance interactivity within the web application. Various components such as accordions, pagination, and other interactive elements are implemented to improve user engagement and navigation.
The site was built through a collaborative work of front end and back end. Api was provided from the backend for the purpose of the project
You can get A PREVIEW of the site by following the link below https://ethiope-fintech.vercel.app/login
email is black@gmail.com password is bbbb
To run the project locally, follow these steps:
Clone the repository to your local machine. Install the necessary dependencies using a package manager like npm or yarn. Start the development server. Open your web browser and navigate to the provided local server address.
The project's codebase is structured as follows:
- src
- components: Contains reusable React components used throughout the application.
- pages: Includes the main page components for different sections (User and Admin).
- routes: Defines the route configuration and protected routes.
- services: Handles API requests, including user authentication using Axios.
- styles: Contains styling files, including CSS or styled-component files.
- App.js: The main entry point of the React application.
- index.js: Renders the React application into the DOM.
- ...
Feel free to explore the codebase to gain a deeper understanding of the project's implementation.