Getting Started

Relevant source files

The following files were used as context for generating this wiki page:

• backend/server.py
• frontend/src/App.js
• frontend/src/App.css
• frontend/package.json
• frontend/README.md
• backend_test.py

NEXUS is a comprehensive digital account and trial tracking system featuring a cyberpunk-inspired aesthetic. The system is architected as a decoupled full-stack application with a FastAPI backend and a React-based frontend. It provides users with a centralized "Command Center" to manage accounts, monitor free trials, and track digital security scores.

The primary goal of NEXUS is to simplify the management of various online subscriptions and trials while maintaining a high level of security through JWT-based authentication. Users can perform full CRUD (Create, Read, Update, Delete) operations on accounts, email addresses, and trial periods.

Sources: backend/server.py:20-23, frontend/src/App.js:14-17, test_result.md:120-125

Backend Architecture

The backend is built using FastAPI and integrates with MongoDB (via the Motor driver) for persistent data storage. It utilizes Pydantic for data validation and schema definition, ensuring type safety and consistent API responses.

Data Models and Schemas

The system defines several core entities to manage user data:

Entity	Description	Key Fields
User	Represents a system user	username, email, hashed_password
Account	Online platform credentials	platform_name, username, email_used, monthly_cost
Email	Managed email addresses	email_address, provider, purpose, security_status
Trial	Subscription trial tracking	platform, start_date, end_date, is_cancelled

Sources: backend/server.py:73-159

Authentication System

Authentication is handled via JWT (JSON Web Tokens). The backend includes helper functions for password hashing using bcrypt and token generation/verification using PyJWT.

Frontend Architecture

The frontend is a React application bootstrapped with Create React App. It utilizes a centralized AuthProvider to manage authentication state across the application.

Component Structure

• AuthProvider: A Context API wrapper that manages the user state, token persistence in localStorage, and axios authorization headers.
• MainApp: The authenticated layout containing the Sidebar navigation and the main content area.
• ProtectedRoute: A higher-order component that redirects unauthenticated users to the /login route.

Sources: frontend/src/App.js:10-90, frontend/src/App.js:840-880

Visual Identity

The interface employs a "Cyberpunk-meets-luxury" aesthetic. This is achieved through:

• Glassmorphism: Using backdrop-filter: blur(20px) and semi-transparent backgrounds.
• Particle Animations: A custom canvas-based background component.
• Color Palette: Electric blue (#00D4FF), vibrant purple, and neon green accents.

Sources: frontend/src/App.css:5-50, frontend/src/App.js:94-145

Local Development Setup

To begin development, ensure you have the necessary environments for both the backend (Python 3.8+) and frontend (Node.js/npm).

Backend Setup

1. Install dependencies: pip install -r backend/requirements.txt.
2. Configure .env with MONGO_URL, DB_NAME, and JWT_SECRET_KEY.
3. Start the server: uvicorn server:app --reload.

Frontend Setup

1. Install dependencies: npm install or yarn install.
2. Configure .env with REACT_APP_BACKEND_URL.
3. Run the development server: npm start.

Command	Description
npm start	Runs the app in development mode at http://localhost:3000
npm test	Launches the test runner
npm run build	Bundles the app for production

Sources: frontend/README.md:10-40, frontend/package.json:60-65

API Reference

All API endpoints are prefixed with /api. Protected routes require a Bearer <token> in the Authorization header.

Core Endpoints

Method	Endpoint	Description
POST	/register	Create a new user account
POST	/login	Authenticate and receive a JWT
GET	/dashboard/stats	Retrieve overview metrics for the current user
GET	/accounts	List all accounts associated with the user
POST	/trials	Log a new subscription trial

Sources: backend/server.py:22-25, backend/server.py:385-410

Testing

The project includes a comprehensive testing suite in backend_test.py that validates the integrity of the JWT system and CRUD operations.

Conclusion

NEXUS provides a robust foundation for digital life management. Its decoupled architecture allows for independent scaling of the backend API and the React frontend. By leveraging modern technologies like FastAPI and glassmorphic CSS, it delivers a high-performance experience with a distinct visual style. Developers can extend the system by adding new platform categories or integrating more complex security scoring algorithms within the DashboardStats logic.