eagle-application

byRaja Babu

Create a complete full-stack AI SaaS web application named Darkflux SR. Build both backend and frontend in one system. The project must be production-ready, clean, and scalable. --- STACK Frontend: - single-file HTML CSS JavaScript - GitHub Pages compatible - mobile responsive - premium dark SaaS design Backend: - Node.js - Express.js - production-ready REST API - deployable on Vercel AI model: deepseek/deepseek-v3.2 --- BACKEND REQUIREMENTS Base URL: https://earn-money-more-ubas.vercel.app Create full backend system with routes: 1) AUTH SYSTEM --- POST /api/auth/register POST /api/auth/verify-code POST /api/auth/login GET /api/auth/google GET /api/auth/github GET /api/auth/apple Features: - email signup - OTP code verification - login - JWT token - Google login - GitHub login - Apple login - verified users only Use Supabase Auth or secure JWT system. --- 2) AI ROADMAP API --- POST /api/generate-plan Payload: { "userId": "string", "plan": "free|pro|premium", "dream": "string", "skill": "string", "timePerDay": "number", "budget": "number", "interest": "string" } Use AI model: deepseek/deepseek-v3.2 Return: { "planName": "string", "dailyLimit": "number", "remainingLimit": "number", "aiRoadmap": "string" } --- 3) PLAN SYSTEM --- FREE price $0 daily limit 3 PRO price $29 validity 49 days PREMIUM price $103 validity 1 year unlimited Track limits securely in backend. --- FRONTEND REQUIREMENTS Build simple premium AI SaaS UI. Design: - dark mode - clean modern style - ChatGPT inspired - futuristic but simple - rounded cards - soft shadows - smooth animations Brand: Darkflux SR --- HOME PAGE Hero: Build Your Dream with AI Button: Start Building IMPORTANT: On click open authentication modal --- AUTH MODAL Tabs: - sign in - sign up - verify code Connect directly to backend auth routes. Include social login buttons: - Google - GitHub - Apple --- AI CHATBOARD After successful login: open full AI chatboard dark ChatGPT style message bubbles input send button send button connects to: /api/generate-plan show AI roadmap response --- PRICING show all 3 plans selected plan updates backend payload --- TECHNICAL frontend and backend code must be fully connected all buttons fully working production-ready code clean folder structure comments required mobile responsive deploy-ready

No preview

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document

System Requirements Document (SRD)

Project Name: eagle-application

1. Introduction

The eagle-application is a full-stack AI SaaS web application designed to provide users with a seamless and scalable platform for generating AI-driven roadmaps. This document outlines the system requirements for the project, ensuring it is production-ready, clean, and scalable. The application will feature a premium dark-mode design, robust backend functionality, and mobile responsiveness, tailored to meet the needs of users in Nepal (NP) and beyond.

2. System Overview

The eagle-application will integrate a modern frontend and a powerful backend to deliver a cohesive user experience. The frontend will feature a futuristic, dark-mode design inspired by ChatGPT, while the backend will provide secure authentication, AI roadmap generation, and plan management. The system will leverage state-of-the-art AI models and technologies to ensure high performance and scalability.

Key features include:

  • A clean, modern, and mobile-responsive UI.
  • Secure authentication with social login options.
  • AI-driven roadmap generation tailored to user inputs.
  • Flexible pricing plans with usage tracking.
  • Deployment-ready code for both frontend and backend.
Page 1 of 7

3. Functional Requirements

As User:

  • I should be able to register using email and verify my account with an OTP code.
  • I should be able to log in using email or social login options (Google, GitHub, Apple).
  • I should be able to generate an AI roadmap by providing details like my dream, skills, time availability, budget, and interests.
  • I should be able to view and select pricing plans (Free, Pro, Premium).
  • I should be able to track my daily usage limits based on my selected plan.

As Admin:

  • I should be able to manage user accounts and verify their status.
  • I should be able to monitor plan usage and enforce limits.

4. User Personas

1. Regular User

  • Description: Individuals seeking AI-generated roadmaps to achieve their goals.
  • Needs: Easy registration, secure login, and access to AI-generated plans.
  • Technical Proficiency: Moderate.
Page 2 of 7

2. Admin

  • Description: System administrators managing user accounts and monitoring usage.
  • Needs: Tools to manage users and enforce plan limits.
  • Technical Proficiency: High.

5. Visuals Colors and Theme

The eagle-application will feature a unique dark-mode color palette to create a premium and futuristic aesthetic:

  • Background: #121212
  • Surface: #1E1E1E
  • Text: #E0E0E0
  • Accent: #FF6F61
  • Muted: #757575

This palette ensures readability and a modern look while maintaining a professional tone.

6. Signature Design Concept

Page 3 of 7

Interactive AI Galaxy Landing Page

The homepage of the eagle-application will feature an interactive galaxy map where each star represents a feature or section of the application.

  • Visuals: A dark, starry background with glowing stars that pulse gently.
  • Interaction: Hovering over a star reveals a tooltip with the feature name (e.g., "AI Roadmap Generator"). Clicking on a star zooms into that section with a smooth transition.
  • Animations: Subtle parallax effects as the user moves their cursor, creating a sense of depth.
  • Micro-interactions: Stars twinkle and emit a soft glow when hovered over.
  • Color Shifts: The galaxy background subtly changes hues (e.g., from deep blue to purple) based on the time of day.

This design will captivate users and make the application instantly memorable.

Page 4 of 7

7. Non-Functional Requirements

  • Performance: The system must handle up to 10,000 concurrent users with minimal latency.
  • Scalability: The backend must be scalable to accommodate future growth.
  • Security: All user data must be encrypted, and authentication must use secure protocols (e.g., JWT).
  • Availability: The system must have 99.9% uptime.
  • Localization: Default settings will cater to Nepal (NP), including timezone and currency.

8. Tech Stack

Frontend

  • React for Web
  • React Native for Mobile

Backend

  • Python
  • FastAPI

Database

  • MySQL (with Alembic for migrations)
Page 5 of 7

AI Models

  • GPT 5.4 for user-friendly responses

AI Tools

  • Langchain
  • Litellm for LLM Routing

Orchestration

  • Docker and docker-compose for local development
  • Kubernetes for server-side orchestration

9. Assumptions and Constraints

  • The application will primarily serve users in Nepal (NP).
  • The system will use MySQL as the primary database for relational data.
  • The AI roadmap generation will rely on GPT 5.4 for optimal performance.
  • Deployment will be on cloud platforms (e.g., Vercel for backend).
Page 6 of 7

10. Glossary

  • JWT: JSON Web Token, a secure method for transmitting information between parties.
  • AI Roadmap: A personalized plan generated by the AI based on user inputs.
  • Frontend: The user-facing part of the application.
  • Backend: The server-side part of the application.
  • Docker: A platform for developing, shipping, and running applications in containers.
  • Kubernetes: A system for automating deployment, scaling, and management of containerized applications.
Page 7 of 7

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

No user flows yet.

The User Flow Agent will generate per-persona navigation diagrams after SRD updates.

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

No user flows yet.

The User Flow Agent will generate per-persona navigation diagrams after SRD updates.