SkyLauncher is a modern, automated web application deployment system that enables you to deploy your React, Vite, or even simple HTML/CSS/JS projects with just a few clicks! Using a powerful combination of AWS Services and Redis, this platform handles everything from building the app to deploying it in the cloud, with real-time updates and secure access.
--> It has 2 more back-end Repo that contains 3 servers ( sky-v1server🚀 / sky-v2server 🚀 ) ...
The architecture is composed of both frontend and backend services, all hosted in AWS cloud. Below is a simplified diagram that showcases the different services and interactions within the system.
- 🌐 Simple and Fast Deployment: Deploy any GitHub repository in minutes.
- 🛠️ Automated Build & Deploy: Fully managed deployment pipeline.
- 📡 Real-Time Status Updates: Stay informed with real-time progress updates.
- 🔐 Secure Access: Only authorized users can deploy apps.
- 🧑💻 Supports Modern Frontend Frameworks: Perfect for React, Vite, and static HTML/CSS/JS applications.
- 📊 Scalable Architecture: Designed for multiple, concurrent deployments using AWS ECS and Redis.
- Next.js - A React framework for production-grade apps
- Tailwind CSS - Utility-first CSS framework
- Node.js - JavaScript runtime for backend logic
- Redis - Real-time caching and messaging
- Docker - containerizing apps
- AWS ECS - Elastic Container Service for scalable containerized applications
- AWS ECR - Elastic Container Registry for managing Docker images
- AWS S3 - Simple Storage Service for build artifacts and deployment files
- AWS SQS - Simple Queue Service for asynchronous task processing
SkyLauncher is powered by a microservices architecture to provide efficient and scalable deployment pipelines. Below is an overview of the services involved:
- Frontend Service: A Next.js application that serves the user interface for deploying apps. Users can:
- Enter GitHub repository URLs.
- Provide security keys for authentication.
- View real-time deployment statuses.
SkyLauncher operates with 3 key backend services that handle different parts of the deployment pipeline:
-
Request Handler Service:
- Validates incoming requests from the frontend.
- Performs security checks on user inputs.
- Routes requests to the appropriate backend services.
-
Upload Service:
- Clones the repository using the provided GitHub URL.
- Prepares the application for building.
- Uploads build files to AWS S3 for deployment.
-
Build-Deploy Service:
- Builds the app using environment variables.
- Deploys the built app to AWS ECS.
- Sends deployment status updates via AWS SQS to the frontend.
Each service operates independently and communicates using AWS SQS and Redis for message passing and event-driven execution.
SkyLauncher automates the entire deployment process, making it easy to deploy modern web apps:
- 🔗 Connect Your Repo: Enter your GitHub repository URL through the web interface.
- 🔐 Secure Your Deployment: Input your security key for authorized access.
- 📦 Build & Deploy: Behind the scenes, the system:
- Clones your repository.
- Builds the app using your stack (React/Vite/HTML).
- Uploads build files to AWS S3 and deploys via AWS ECS.
- 🌍 Get Your URL: Once deployed, the app is hosted live, and you can access it through a provided URL.
SkyLauncher consists of 23 microservices that manage various operations like API requests, repository handling, build processing, and deployment:
- Frontend Service: Serves the user interface and provides the user-facing features for deploying applications.
- API Service: The main entry point for all client requests.
- Request Handler: Manages and validates incoming requests, ensuring secure access.
- Upload Service: Responsible for cloning repositories and uploading files to AWS S3.
- Build-Deploy Service: Handles the building of applications and their deployment using AWS ECS.
This is a Next.js project bootstrapped with create-next-app.
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun devOpen http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.
API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.
The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.
This project uses next/font to automatically optimize and load Inter, a custom Google Font.
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.