Skip to content

Commit b93c04f

Browse files
author
secus
committed
feat: Major UI/UX overhaul and system optimization
✨ New Features: - Complete DocumentationPage redesign with modern, professional interface - Comprehensive README with step-by-step setup instructions - Full mobile-first responsive design for all device sizes - Enhanced navigation with sticky header and mobile menu - Custom xs breakpoint support for extra small screens 🎨 UI/UX Improvements: - Modern gradient backgrounds and backdrop blur effects - Card-based layouts with shadows and smooth hover animations - Mobile-optimized typography and component sizing - Professional multi-column footer with gradient accents - Touch-friendly interactive elements and navigation 🧹 Code Cleanup & Optimization: - Removed all unnecessary debug logs from Rust backend - Eliminated console.log statements from frontend codebase - Optimized imports and removed unused dependencies - Improved code structure and maintainability - Enhanced error handling and validation 📱 Mobile Responsiveness: - Horizontal scrolling navigation for mobile devices - Responsive grid systems with mobile-first approach - Adaptive component sizing and spacing - Optimized touch targets and user interactions - Comprehensive breakpoint management (xs, sm, md, lg, xl) 📚 Documentation: - Complete setup guide with prerequisites and troubleshooting - Command reference table for development workflow - Project structure overview and organization - Step-by-step installation instructions 🔧 Technical Enhancements: - Improved webhook event handling system - Enhanced deployment worker with better error handling - Optimized database queries and API responses - Better authentication and middleware systems - Streamlined notification management
1 parent 17dc63e commit b93c04f

14 files changed

Lines changed: 823 additions & 278 deletions

File tree

README.md

Lines changed: 230 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,236 @@
2222

2323
---
2424

25+
## 🚀 Quick Start Guide
26+
27+
### Prerequisites
28+
29+
Before getting started, ensure you have the following installed:
30+
31+
- **Docker** - For containerization
32+
- **Docker Compose** - For managing multi-container applications
33+
- **Minikube** - Local Kubernetes cluster
34+
- **kubectl** - Kubernetes command-line tool
35+
- **Node.js** (v16+) - For the frontend application
36+
- **Rust** (latest stable) - For the backend
37+
- **PostgreSQL** - Database (can be run via Docker Compose)
38+
- **Redis** - For caching (can be run via Docker Compose)
39+
40+
### Installation & Setup
41+
42+
#### Step 1: Clone the Repository
43+
44+
```bash
45+
git clone https://github.com/secus217/Open-Container-Engine.git
46+
cd Open-Container-Engine
47+
```
48+
49+
#### Step 2: Initial Setup
50+
51+
Run the setup script to install dependencies and configure the environment:
52+
53+
```bash
54+
./setup.sh setup
55+
```
56+
57+
This command will:
58+
- Install required system dependencies
59+
- Set up Rust toolchain
60+
- Install Node.js dependencies for the frontend
61+
- Configure Docker and Docker Compose
62+
- Set up PostgreSQL and Redis via Docker Compose
63+
- Initialize the database schema
64+
65+
#### Step 3: Configure Kubernetes
66+
67+
Create the Kubernetes configuration file by copying from the test template:
68+
69+
```bash
70+
cp k8sConfigTest.yaml k8sConfig.yaml
71+
```
72+
73+
Edit `k8sConfig.yaml` and replace the paths with your actual system paths:
74+
75+
```yaml
76+
apiVersion: v1
77+
clusters:
78+
- cluster:
79+
certificate-authority: /home/YOUR_USERNAME/.minikube/ca.crt
80+
server: https://192.168.49.2:8443
81+
name: minikube
82+
contexts:
83+
- context:
84+
cluster: minikube
85+
namespace: default
86+
user: minikube
87+
name: minikube
88+
current-context: minikube
89+
kind: Config
90+
users:
91+
- name: minikube
92+
user:
93+
client-certificate: /home/YOUR_USERNAME/.minikube/profiles/minikube/client.crt
94+
client-key: /home/YOUR_USERNAME/.minikube/profiles/minikube/client.key
95+
```
96+
97+
#### Step 4: Environment Configuration
98+
99+
Create your local environment configuration:
100+
101+
```bash
102+
cp .env.development .env.local
103+
```
104+
105+
Edit `.env.local` to match your local setup:
106+
107+
```bash
108+
# Development environment configuration for Container Engine
109+
DATABASE_URL=postgresql://postgres:password@localhost:5432/container_engine
110+
REDIS_URL=redis://localhost:6379
111+
PORT=3000
112+
JWT_SECRET=your-secure-jwt-secret-for-development
113+
JWT_EXPIRES_IN=3600
114+
API_KEY_PREFIX=ce_dev_
115+
KUBERNETES_NAMESPACE=container-engine-dev
116+
DOMAIN_SUFFIX=.local.dev
117+
MAILTRAP_SMTP_HOST=your_host
118+
MAILTRAP_SMTP_PORT=587
119+
MAILTRAP_USERNAME=your_mailtrap_username
120+
MAILTRAP_PASSWORD=your_mailtrap_password
121+
EMAIL_FROM=noreply@containerengine.local
122+
EMAIL_FROM_NAME=Container Engine Dev
123+
RUST_LOG=container_engine=debug,tower_http=debug
124+
KUBECONFIG_PATH=./k8sConfig.yaml
125+
```
126+
127+
#### Step 5: Start Minikube & Enable Ingress
128+
129+
Start your local Kubernetes cluster:
130+
131+
```bash
132+
# Start Minikube
133+
minikube start
134+
135+
# Enable the ingress addon
136+
minikube addons enable ingress
137+
138+
# Verify Minikube is running
139+
minikube status
140+
```
141+
142+
#### Step 6: Run the Development Environment
143+
144+
Start all services in development mode:
145+
146+
```bash
147+
./setup.sh dev
148+
```
149+
150+
This command will:
151+
- Start PostgreSQL and Redis containers
152+
- Run database migrations
153+
- Start the Rust backend server
154+
- Start the React frontend development server
155+
- Set up Kubernetes resources
156+
- Open your browser to `http://localhost:3000`
157+
158+
### 🎯 Accessing the Application
159+
160+
Once the setup is complete, you can access:
161+
162+
- **Frontend Application**: http://localhost:3000
163+
- **Backend API**: http://localhost:8080
164+
- **API Documentation**: http://localhost:8080/docs
165+
- **Database**: localhost:5432 (postgres/password)
166+
- **Redis**: localhost:6379
167+
168+
### 🔧 Development Commands
169+
170+
| Command | Description |
171+
|---------|-------------|
172+
| `./setup.sh setup` | Initial project setup and dependency installation |
173+
| `./setup.sh dev` | Start development environment |
174+
| `./setup.sh build` | Build the project for production |
175+
| `./setup.sh test` | Run all tests |
176+
| `./setup.sh clean` | Clean build artifacts and docker containers |
177+
| `./setup.sh logs` | View application logs |
178+
179+
### 🐛 Troubleshooting
180+
181+
#### Common Issues
182+
183+
**1. Minikube not starting:**
184+
```bash
185+
# Reset Minikube if it fails to start
186+
minikube delete
187+
minikube start --driver=docker
188+
```
189+
190+
**2. Port already in use:**
191+
```bash
192+
# Check which process is using port 3000 or 8080
193+
sudo lsof -i :3000
194+
sudo lsof -i :8080
195+
196+
# Kill the process if needed
197+
sudo kill -9 <PID>
198+
```
199+
200+
**3. Database connection errors:**
201+
```bash
202+
# Restart PostgreSQL container
203+
docker-compose restart postgres
204+
205+
# Check database logs
206+
docker-compose logs postgres
207+
```
208+
209+
**4. Kubernetes configuration issues:**
210+
```bash
211+
# Verify Minikube status
212+
minikube status
213+
214+
# Check Kubernetes cluster info
215+
kubectl cluster-info
216+
217+
# Verify ingress is enabled
218+
minikube addons list | grep ingress
219+
```
220+
221+
**5. Frontend build errors:**
222+
```bash
223+
# Clear npm cache and reinstall
224+
cd apps/container-engine-frontend
225+
rm -rf node_modules package-lock.json
226+
npm install
227+
```
228+
229+
#### Getting Help
230+
231+
- Check the [Issues](https://github.com/secus217/Open-Container-Engine/issues) page for known problems
232+
- Review application logs: `./setup.sh logs`
233+
- Ensure all prerequisites are correctly installed
234+
- Verify that all ports (3000, 8080, 5432, 6379) are available
235+
236+
### 📁 Project Structure
237+
238+
```
239+
Open-Container-Engine/
240+
├── apps/
241+
│ └── container-engine-frontend/ # React frontend application
242+
├── src/ # Rust backend source code
243+
├── migrations/ # Database migration files
244+
├── tests/ # Integration tests
245+
├── scripts/ # Setup and utility scripts
246+
├── k8sConfig.yaml # Kubernetes configuration
247+
├── .env.local # Local environment variables
248+
├── docker-compose.yml # Docker services configuration
249+
├── setup.sh # Main setup script
250+
└── README.md # This file
251+
```
252+
253+
---
254+
25255
## Introduction
26256

27257
**Container Engine** is an open-source alternative to Google Cloud Run, built with Rust and the Axum framework. This revolutionary service empowers developers to effortlessly deploy containerized applications to the internet with unprecedented simplicity and speed. By intelligently abstracting away the complexity of Kubernetes infrastructure, Container Engine creates a seamless deployment experience that lets you focus entirely on your code and business logic, not on managing infrastructure.

apps/container-engine-frontend/src/index.css

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,19 @@
11
@import "tailwindcss";
22

3+
/* Custom xs breakpoint for extra small screens (480px) */
4+
@media (min-width: 480px) {
5+
.xs\:grid-cols-2 {
6+
grid-template-columns: repeat(2, minmax(0, 1fr));
7+
}
8+
.xs\:w-auto {
9+
width: auto;
10+
}
11+
.xs\:text-3xl {
12+
font-size: 1.875rem;
13+
line-height: 2.25rem;
14+
}
15+
}
16+
317
/* Custom animations for magical effects */
418
@keyframes blob {
519
0% {

0 commit comments

Comments
 (0)