CampusCoin is a financial literacy app designed to help university students manage their finances effectively. The app allows users to track their expenses, set financial goals, and learn about financial management through interactive features. The purpose of the project is to promote financial literacy among students and provide them with tools to manage their money wisely.
In today's fast-paced world, managing finances is a crucial skill, especially for university students who are often managing their own money for the first time. CampusCoin is designed to address this need by providing an easy-to-use platform that combines educational resources with practical tools for financial management. With CampusCoin, students can:
-Track their spending and categorize expenses.
-Set and achieve financial goals.
-Learn about budgeting, saving, and investing through interactive tutorials.
-Receive personalized financial advice and tips.
-Engage with a community of peers to share financial strategies and experiences.
CampusCoin aims to empower students with the knowledge and skills they need to make informed financial decisions, ultimately leading to better financial health and stability.
- Features
- Technologies Used
- Getting Started
- Usage Instructions
- Project Structure
- API Endpoints
- Additional Sections
- Contributing
- License
- Acknowledgment
- User Registration and Login
- Password Reset via Email
- Dashboard with Financial Data Visualization
- Expense Tracking by Category
- Top Expenses Visualization
- Net Amount and Cashflow Charts
- Weekly Expenses Breakdown
- Logout Functionality
- React.js for the frontend
- Node.js and Express.js for the backend
- MongoDB for the database
- Chart.js for data visualization
- Axios for HTTP requests
- CSS for styling
- Node.js
- MongoDB database set up
- React.js
- Axios
- Multer
- JSON Web Tokens (JWT)
- npm
- Chart.js
-
Clone the repository:
git clone https://github.com/your-username/campus-coin.git cd campus-coin
-
Install backend dependencies:
cd backend npm install
-
Install frontend dependencies:
cd ../frontend npm install
-
Environment Variables Create a .env file in the backend directory and add the following:
- JWT_SECRET=1f16c1a9346cddaa758861ac2eaf0c5657b4657f46b54add213a6cf949aca4da
- EMAIL_USER=[email protected]
- EMAIL_PASS=mpdyovsznraqtlyo
-
Start the backend server:
cd backend run dev
The backend server will run on
http://localhost:3000
. -
Start the frontend development server:
cd ../frontend npm start
The frontend server will run on
http://localhost:3001
.
-
Sign Up -Navigate to 'frontend\src\components\Signup.js' and create a new account.
-
Login -Navigate to 'frontend\src\components\Login.js' and log in with your credentials.
-
Profile Management -Navigate to 'frontend\src\components\ProfilePage.js' -Upload and update profile pictures on the profile page. -View and edit personal information.
-
Admin Dashboard -Access the admin dashboard to manage users at 'frontend\src\components\Admin.js'.
-
Logout:
- Use the Logout button in the dashboard header to log out of the application.
Sign Up
-*Input*: User credentials (email, password, etc.)
-*Output*: JWT token, user profile details
Profile Picture Upload
-*Input*: Image file
-*Output*: URL of the uploaded image
The project is divided into two main parts: the backend and the frontend.
-Backend
'server.js':Entry point for the backend server.
'routes/': Contains route handlers for authentication, user management, etc.
'models/': Contains Mongoose models for user data.
'middleware/':Contains middleware for authentication and authorization.
FrontEnd
'src/components/': Contains React components for various pages and features.
'src/App.js': Main application component where routes are defined.
'src/index.js': Entry point for the frontend application.
Folder Structure
CampusCoin/
├── backend/ # Backend directory containing server-side code
│ ├── config/ # Configuration files
│ │ └── db.js # Database connection configuration
│ ├── controllers/ # Controllers to handle business logic
│ │ ├── authController.js # Handles authentication logic
│ │ ├── adminController.js # Handles admin-related logic
│ │ └── ... # Other controllers as needed
│ ├── middleware/ # Middleware for handling requests
│ │ ├── authMiddleware.js # Middleware for authentication
│ │ ├── adminMiddleware.js # Middleware for admin authorization
│ │ └── ... # Other middleware as needed
│ ├── models/ # Database models
│ │ └── User.js # User model schema
│ ├── routes/ # Route handlers
│ │ ├── auth.js # Authentication routes
│ │ ├── admin.js # Admin-related routes
│ │ └── ... # Other routes as needed
│ ├── uploads/ # Directory for uploaded files
│ ├── .env # Environment variables
│ ├── index.js # Entry point for the backend server
│ └── package.json # Backend dependencies and scripts
├── frontend/ # Frontend directory containing client-side code
│ ├── public/ # Publicly accessible files
│ │ └── index.html # Main HTML file
│ ├── src/ # Source files for the frontend
│ │ ├── components/ # React components
│ │ │ ├── ProfilePage.js # Component for the profile page
│ │ │ ├── Login.js # Component for login
│ │ │ ├── Admin.js # Component for admin dashboard
│ │ │ └── ... # Other components as needed
│ │ ├── css/ # CSS files for styling
│ │ │ ├── ProfilePage.css # CSS for the profile page
│ │ │ └── ... # Other CSS files as needed
│ │ ├── App.js # Main App component
│ │ └── index.js # Entry point for the React application
│ ├── .env # Environment variables
│ └── package.json # Frontend dependencies and scripts
└── README.md # Documentation for the project
POST /api/auth/signup
- User registrationPOST /api/auth/login
- User loginPOST /api/auth/forgot-password
- Request password resetPOST /api/auth/reset-password
- Reset passwordGET /api/financial-data
- Fetch financial data for the dashboard
-Solovea Mutei(Project Lead)
-Esli Mose
Status: Ongoing
-Profile image upload may fail if the server is not configured correctly. -The admin panel lacks some advanced features like bulk user actions. -Entering of Financial Data still has some errors we are working on
Contributions are welcome! Please fork the repository and create a pull request with your changes. Ensure that your code follows the project's coding standards and includes appropriate tests.
This project is licensed under the MIT License.
- Thanks to the open-source community for their invaluable resources and tools.
For any issues or feature requests, please open an issue on the GitHub repository.