marine-small

byHemant Pande

Build a small but complete full-stack web application called **Mini Expense Tracker**. The purpose of this project is to create a simple application where a user can record and manage their daily expenses. Focus on making the application fully functional rather than adding unnecessary features. ### 1. Frontend Create a clean, modern, and responsive web interface. The application should have: * A dashboard displaying: * Total expenses * Number of transactions * Highest expense * An expense list showing all recorded expenses. * An "Add Expense" button that opens a form. * Each expense should contain: * Expense title * Amount * Category * Date * Optional note * Categories should include: * Food * Travel * Shopping * Bills * Other * Each expense should have Edit and Delete actions. * Add a simple category filter so the user can view expenses from a selected category. * Display a simple summary of expenses by category. * The UI must work properly on both desktop and mobile screens. * Include proper loading, empty-state, and error-state messages. ### 2. Backend Create a backend API for the application. Implement REST APIs for: * Getting all expenses * Getting a single expense * Creating an expense * Updating an expense * Deleting an expense Use appropriate HTTP methods such as GET, POST, PUT/PATCH, and DELETE. The backend should: * Validate incoming data. * Reject invalid amounts or missing required fields. * Return appropriate HTTP status codes. * Handle errors properly. * Keep the backend code organized into logical files such as routes, controllers, and database/model-related files where appropriate. ### 3. Database Use a lightweight local database such as **SQLite**. Create an expenses table containing: * id * title * amount * category * date * note * created_at The application should automatically create/initialize the database when required. Add a few sample expenses so that the dashboard is not empty when the application is first launched. ### 4. Frontend–Backend Integration The frontend must communicate with the backend through the REST API. Do not use hardcoded expense data for the main functionality. When a user: * Adds an expense → save it to the database. * Edits an expense → update the database. * Deletes an expense → remove it from the database. * Refreshes the page → previously stored expenses should still appear. ### 5. Project Structure Keep the project simple and organized. Separate the frontend and backend appropriately and use reusable components where useful. Do not introduce unnecessary libraries, authentication systems, payment systems, cloud services, or other advanced features. ### 6. Final Requirements The final application should be runnable locally. Provide: 1. Complete source code. 2. Required package/dependency files. 3. Database setup. 4. Clear instructions for installing dependencies. 5. Clear instructions for starting both frontend and backend. 6. Any environment variables that are required. 7. A brief explanation of the architecture and API endpoints. Prioritize **working functionality, clean code, proper frontend-backend integration, database persistence, responsive UI, and good error handling** over adding extra features. Do not over-engineer the project. Keep it small enough to understand and run easily.