Urbanzulu commited on
Commit
ce2a833
·
verified ·
1 Parent(s): 56a9e3a

needs configuration details for the local download and install

Browse files
Files changed (3) hide show
  1. index.html +1 -1
  2. installation.html +310 -0
  3. workspaces.html +1 -2
index.html CHANGED
@@ -37,10 +37,10 @@
37
  </div>
38
  <div class="hidden md:flex space-x-6">
39
  <a href="workspaces.html" class="text-gray-300 hover:text-white transition-colors">Workspaces</a>
40
- <a href="launch.html" class="text-red-400 hover:text-red-300 transition-colors">Launch Locally</a>
41
  <a href="templates.html" class="text-gray-300 hover:text-white transition-colors">Templates</a>
42
  <a href="deployments.html" class="text-gray-300 hover:text-white transition-colors">Deployments</a>
43
  <a href="documentation.html" class="text-gray-300 hover:text-white transition-colors">Documentation</a>
 
44
  <a href="admin-login.html" class="text-gray-300 hover:text-white transition-colors">Admin</a>
45
  </div>
46
  </div>
 
37
  </div>
38
  <div class="hidden md:flex space-x-6">
39
  <a href="workspaces.html" class="text-gray-300 hover:text-white transition-colors">Workspaces</a>
 
40
  <a href="templates.html" class="text-gray-300 hover:text-white transition-colors">Templates</a>
41
  <a href="deployments.html" class="text-gray-300 hover:text-white transition-colors">Deployments</a>
42
  <a href="documentation.html" class="text-gray-300 hover:text-white transition-colors">Documentation</a>
43
+ <a href="installation.html" class="text-red-400 hover:text-red-300 transition-colors">Installation</a>
44
  <a href="admin-login.html" class="text-gray-300 hover:text-white transition-colors">Admin</a>
45
  </div>
46
  </div>
installation.html ADDED
@@ -0,0 +1,310 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en" class="dark">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Installation Guide | CodeForge-AI</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <script src="https://unpkg.com/feather-icons"></script>
11
+ <script>
12
+ tailwind.config = {
13
+ darkMode: 'class',
14
+ theme: {
15
+ extend: {
16
+ colors: {
17
+ primary: '#ef4444',
18
+ secondary: '#6b7280'
19
+ }
20
+ }
21
+ }
22
+ }
23
+ </script>
24
+ </head>
25
+ <body class="bg-gray-900 text-white min-h-screen">
26
+ <!-- Navigation -->
27
+ <nav class="bg-gray-800 border-b border-red-500/20 sticky top-0 z-50">
28
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
29
+ <div class="flex justify-between items-center h-16">
30
+ <div class="flex items-center space-x-4">
31
+ <div class="flex items-center space-x-2">
32
+ <div class="w-8 h-8 bg-red-500 rounded-lg flex items-center justify-center">
33
+ <i data-feather="code" class="w-4 h-4"></i>
34
+ </div>
35
+ <span class="text-xl font-bold text-white">CodeForge-AI</span>
36
+ </div>
37
+ <div class="hidden md:flex space-x-6">
38
+ <a href="workspaces.html" class="text-gray-300 hover:text-white transition-colors">Workspaces</a>
39
+ <a href="templates.html" class="text-gray-300 hover:text-white transition-colors">Templates</a>
40
+ <a href="deployments.html" class="text-gray-300 hover:text-white transition-colors">Deployments</a>
41
+ <a href="documentation.html" class="text-gray-300 hover:text-white transition-colors">Documentation</a>
42
+ <a href="installation.html" class="text-red-400 hover:text-red-300 transition-colors">Installation</a>
43
+ <a href="admin-login.html" class="text-gray-300 hover:text-white transition-colors">Admin</a>
44
+ </div>
45
+ </div>
46
+ <div class="flex items-center space-x-4">
47
+ <a href="workspaces.html" class="bg-red-500 hover:bg-red-600 px-4 py-2 rounded-lg text-white font-medium transition-colors">
48
+ Start Coding
49
+ </a>
50
+ <a href="admin-login.html" class="bg-purple-500 hover:bg-purple-600 px-4 py-2 rounded-lg text-white font-medium transition-colors">
51
+ Admin Panel
52
+ </a>
53
+ <button class="text-gray-300 hover:text-white transition-colors">
54
+ <i data-feather="user" class="w-5 h-5"></i>
55
+ </button>
56
+ </div>
57
+ </div>
58
+ </div>
59
+ </nav>
60
+
61
+ <!-- Installation Guide -->
62
+ <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
63
+ <div class="text-center mb-12">
64
+ <h1 class="text-4xl md:text-5xl font-bold text-white mb-4">Local Installation Guide</h1>
65
+ <p class="text-xl text-gray-300 max-w-3xl mx-auto">
66
+ Step-by-step instructions to download and install CodeForge-AI on your local machine
67
+ </p>
68
+ </div>
69
+
70
+ <!-- System Requirements -->
71
+ <div class="bg-gray-800 rounded-2xl p-8 border border-red-500/20 mb-8">
72
+ <h2 class="text-2xl font-bold text-white mb-6">System Requirements</h2>
73
+ <div class="grid md:grid-cols-2 gap-6">
74
+ <div>
75
+ <h3 class="text-lg font-semibold text-red-400 mb-4">Minimum Requirements</h3>
76
+ <ul class="space-y-2 text-gray-300">
77
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>Docker 20.10+</li>
78
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>4GB RAM</li>
79
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>2 CPU cores</li>
80
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>10GB free disk space</li>
81
+ </ul>
82
+ </div>
83
+ <div>
84
+ <h3 class="text-lg font-semibold text-red-400 mb-4">Recommended</h3>
85
+ <ul class="space-y-2 text-gray-300">
86
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>Docker 24.0+</li>
87
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>8GB RAM</li>
88
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>4 CPU cores</li>
89
+ <li><i data-feather="check" class="w-4 h-4 text-green-400 inline mr-2"></i>20GB free disk space</li>
90
+ </ul>
91
+ </div>
92
+ </div>
93
+ </div>
94
+
95
+ <!-- Download Section -->
96
+ <div class="bg-gray-800 rounded-2xl p-8 border border-red-500/20 mb-8">
97
+ <h2 class="text-2xl font-bold text-white mb-6">Download</h2>
98
+ <div class="grid md:grid-cols-3 gap-6 mb-8">
99
+ <div class="text-center">
100
+ <div class="w-16 h-16 bg-red-500 rounded-2xl flex items-center justify-center mx-auto mb-4">
101
+ <i data-feather="download" class="w-8 h-8"></i>
102
+ </div>
103
+ <h3 class="text-lg font-semibold text-white mb-2">Docker Compose</div>
104
+ <p class="text-gray-400 text-sm mb-4">Complete setup with all dependencies</p>
105
+ <a href="#" class="bg-red-500 hover:bg-red-600 px-6 py-3 rounded-xl text-white font-medium transition-colors inline-block">
106
+ Download
107
+ </a>
108
+ </div>
109
+ <div class="text-center">
110
+ <div class="w-16 h-16 bg-red-500 rounded-2xl flex items-center justify-center mx-auto mb-4">
111
+ <i data-feather="github" class="w-8 h-8"></i>
112
+ </div>
113
+ <h3 class="text-lg font-semibold text-white mb-2">Source Code</div>
114
+ <p class="text-gray-400 text-sm mb-4">Build from source for customization</p>
115
+ <a href="#" class="bg-red-500 hover:bg-red-600 px-6 py-3 rounded-xl text-white font-medium transition-colors inline-block">
116
+ GitHub
117
+ </a>
118
+ </div>
119
+ <div class="text-center">
120
+ <div class="w-16 h-16 bg-red-500 rounded-2xl flex items-center justify-center mx-auto mb-4">
121
+ <i data-feather="package" class="w-8 h-8"></i>
122
+ </div>
123
+ <h3 class="text-lg font-semibold text-white mb-2">Binary Release</div>
124
+ <p class="text-gray-400 text-sm mb-4">Pre-built binaries for quick setup</p>
125
+ <a href="#" class="bg-red-500 hover:bg-red-600 px-6 py-3 rounded-xl text-white font-medium transition-colors inline-block">
126
+ Download
127
+ </a>
128
+ </div>
129
+ </div>
130
+ </div>
131
+
132
+ <!-- Installation Steps -->
133
+ <div class="bg-gray-800 rounded-2xl p-8 border border-red-500/20">
134
+ <h2 class="text-2xl font-bold text-white mb-6">Installation Steps</h2>
135
+
136
+ <!-- Step 1 -->
137
+ <div class="mb-8">
138
+ <div class="flex items-center mb-4">
139
+ <div class="w-8 h-8 bg-red-500 rounded-full flex items-center justify-center mr-4">
140
+ <span class="text-white font-bold">1</span>
141
+ </div>
142
+ <h3 class="text-xl font-semibold text-white mb-3">Download the Package</div>
143
+ <div class="bg-gray-900 rounded-xl p-4 mb-4">
144
+ <code class="text-green-400">curl -L https://codeforge-ai.com/download/docker-compose.yml -o docker-compose.yml</code>
145
+ </div>
146
+ <p class="text-gray-300">Download the latest Docker Compose configuration file.</p>
147
+ </div>
148
+
149
+ <!-- Step 2 -->
150
+ <div class="mb-8">
151
+ <div class="flex items-center mb-4">
152
+ <div class="w-8 h-8 bg-red-500 rounded-full flex items-center justify-center mr-4">
153
+ <span class="text-white font-bold">2</span>
154
+ </div>
155
+ <h3 class="text-xl font-semibold text-white mb-3">Configure Environment</div>
156
+ <div class="bg-gray-900 rounded-xl p-4 mb-4">
157
+ <code class="text-green-400">cp .env.example .env</code>
158
+ </div>
159
+ <p class="text-gray-300">Copy the environment configuration file and update with your settings.</p>
160
+ </div>
161
+
162
+ <!-- Step 3 -->
163
+ <div class="mb-8">
164
+ <div class="flex items-center mb-4">
165
+ <div class="w-8 h-8 bg-red-500 rounded-full flex items-center justify-center mr-4">
166
+ <span class="text-white font-bold">3</span>
167
+ </div>
168
+ <h3 class="text-xl font-semibold text-white mb-3">Start Services</div>
169
+ <div class="bg-gray-900 rounded-xl p-4 mb-4">
170
+ <code class="text-green-400">docker-compose up -d</code>
171
+ </div>
172
+ <p class="text-gray-300">Launch all CodeForge-AI services in detached mode.</p>
173
+ </div>
174
+
175
+ <!-- Step 4 -->
176
+ <div class="mb-8">
177
+ <div class="flex items-center mb-4">
178
+ <div class="w-8 h-8 bg-red-500 rounded-full flex items-center justify-center mr-4">
179
+ <span class="text-white font-bold">4</span>
180
+ </div>
181
+ <h3 class="text-xl font-semibold text-white mb-3">Verify Installation</div>
182
+ <div class="bg-gray-900 rounded-xl p-4 mb-4">
183
+ <code class="text-green-400">docker-compose ps</code>
184
+ </div>
185
+ <p class="text-gray-300">Check that all services are running correctly.</p>
186
+ </div>
187
+
188
+ <!-- Step 5 -->
189
+ <div class="mb-8">
190
+ <div class="flex items-center mb-4">
191
+ <div class="w-8 h-8 bg-red-500 rounded-full flex items-center justify-center mr-4">
192
+ <span class="text-white font-bold">5</span>
193
+ </div>
194
+ <h3 class="text-xl font-semibold text-white mb-3">Access Dashboard</div>
195
+ <div class="bg-gray-900 rounded-xl p-4 mb-4">
196
+ <code class="text-green-400">http://localhost:8080</code>
197
+ </div>
198
+ <p class="text-gray-300">Open your browser and navigate to the local dashboard.</p>
199
+ </div>
200
+ </div>
201
+
202
+ <!-- Configuration Details -->
203
+ <div class="bg-gray-800 rounded-2xl p-8 border border-red-500/20 mt-8">
204
+ <h2 class="text-2xl font-bold text-white mb-6">Configuration Details</h2>
205
+
206
+ <div class="grid md:grid-cols-2 gap-6">
207
+ <div>
208
+ <h3 class="text-lg font-semibold text-red-400 mb-4">Environment Variables</h3>
209
+ <div class="bg-gray-900 rounded-xl p-4">
210
+ <code class="text-gray-300 block mb-2">API_PORT=8080</code>
211
+ <code class="text-gray-300 block mb-2">DATABASE_URL=postgresql://user:pass@db:5432/codeforge</code>
212
+ <code class="text-gray-300 block mb-2">REDIS_URL=redis://redis:6379</code>
213
+ <code class="text-gray-300 block">JWT_SECRET=your-secret-key</code>
214
+ </div>
215
+ </div>
216
+ <div>
217
+ <h3 class="text-lg font-semibold text-red-400 mb-4">Services</h3>
218
+ <ul class="space-y-2 text-gray-300">
219
+ <li><i data-feather="server" class="w-4 h-4 text-green-400 inline mr-2"></i>API Server (Port 8080)</li>
220
+ <li><i data-feather="database" class="w-4 h-4 text-green-400 inline mr-2"></i>PostgreSQL Database</li>
221
+ <li><i data-feather="cpu" class="w-4 h-4 text-green-400 inline mr-2"></i>Redis Cache</li>
222
+ <li><i data-feather="box" class="w-4 h-4 text-green-400 inline mr-2"></i>Docker Engine</li>
223
+ </ul>
224
+ </div>
225
+ </div>
226
+ </div>
227
+
228
+ <!-- Troubleshooting -->
229
+ <div class="bg-gray-800 rounded-2xl p-8 border border-red-500/20 mt-8">
230
+ <h2 class="text-2xl font-bold text-white mb-6">Troubleshooting</h2>
231
+ <div class="space-y-4">
232
+ <div>
233
+ <h4 class="text-red-400 font-semibold mb-2">Port Conflicts</h4>
234
+ <p class="text-gray-300">If port 8080 is already in use, modify the API_PORT in your .env file.</p>
235
+ </div>
236
+ <div>
237
+ <h4 class="text-red-400 font-semibold mb-2">Docker Issues</h4>
238
+ <p class="text-gray-300">Ensure Docker is running and you have sufficient permissions.</p>
239
+ </div>
240
+ <div>
241
+ <h4 class="text-red-400 font-semibold mb-2">Memory Limits</h4>
242
+ <p class="text-gray-300">Increase Docker memory allocation if containers fail to start.</p>
243
+ </div>
244
+ </div>
245
+ </div>
246
+ </div>
247
+ </div>
248
+
249
+ <!-- Footer -->
250
+ <footer class="bg-gray-800 border-t border-gray-700 py-12 mt-12">
251
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
252
+ <div class="grid md:grid-cols-4 gap-8">
253
+ <div>
254
+ <div class="flex items-center space-x-2 mb-4">
255
+ <div class="w-8 h-8 bg-red-500 rounded-lg flex items-center justify-center">
256
+ <i data-feather="code" class="w-4 h-4"></i>
257
+ </div>
258
+ <span class="text-xl font-bold text-white">CodeForge-AI</span>
259
+ </div>
260
+ <p class="text-gray-400 text-sm">
261
+ The autonomous development platform for modern developers.
262
+ </p>
263
+ </div>
264
+ <div>
265
+ <h4 class="text-white font-semibold mb-4">Product</h4>
266
+ <ul class="space-y-2 text-sm text-gray-400">
267
+ <li><a href="features.html" class="hover:text-red-400 transition-colors">Features</a></li>
268
+ <li><a href="pricing.html" class="hover:text-red-400 transition-colors">Pricing</a></li>
269
+ <li><a href="documentation.html" class="hover:text-red-400 transition-colors">Documentation</a></li>
270
+ <li><a href="installation.html" class="hover:text-red-400 transition-colors">Installation</a></li>
271
+ </ul>
272
+ </div>
273
+ <div>
274
+ <h4 class="text-white font-semibold mb-4">Company</h4>
275
+ <ul class="space-y-2 text-sm text-gray-400">
276
+ <li><a href="about.html" class="hover:text-red-400 transition-colors">About</a></li>
277
+ <li><a href="blog.html" class="hover:text-red-400 transition-colors">Blog</a></li>
278
+ <li><a href="careers.html" class="hover:text-red-400 transition-colors">Careers</a></li>
279
+ <li><a href="contact.html" class="hover:text-red-400 transition-colors">Contact</a></li>
280
+ </ul>
281
+ </div>
282
+ <div>
283
+ <h4 class="text-white font-semibold mb-4">Connect</h4>
284
+ <div class="flex space-x-4">
285
+ <a href="#" class="text-gray-400 hover:text-red-400 transition-colors">
286
+ <i data-feather="github" class="w-5 h-5"></i>
287
+ </a>
288
+ <a href="#" class="text-gray-400 hover:text-red-400 transition-colors">
289
+ <i data-feather="twitter" class="w-5 h-5"></i>
290
+ </a>
291
+ <a href="#" class="text-gray-400 hover:text-red-400 transition-colors">
292
+ <i data-feather="linkedin" class="w-5 h-5"></i>
293
+ </a>
294
+ <a href="#" class="text-gray-400 hover:text-red-400 transition-colors">
295
+ <i data-feather="discord" class="w-5 h-5"></i>
296
+ </a>
297
+ </div>
298
+ </div>
299
+ </div>
300
+ <div class="border-t border-gray-700 mt-8 pt-8 text-center text-sm text-gray-400">
301
+ <p>&copy; 2024 CodeForge-AI. All rights reserved. Built with security and performance in mind.</p>
302
+ </div>
303
+ </div>
304
+
305
+ <script>
306
+ // Initialize Feather Icons
307
+ feather.replace();
308
+ </script>
309
+ </body>
310
+ </html>
workspaces.html CHANGED
@@ -38,13 +38,12 @@
38
  </div>
39
  <div class="hidden md:flex space-x-6">
40
  <a href="workspaces.html" class="text-red-400 hover:text-red-300 transition-colors">Workspaces</a>
41
- <a href="launch.html" class="text-gray-300 hover:text-white transition-colors">Launch Locally</a>
42
  <a href="templates.html" class="text-gray-300 hover:text-white transition-colors">Templates</a>
43
  <a href="deployments.html" class="text-gray-300 hover:text-white transition-colors">Deployments</a>
44
  <a href="documentation.html" class="text-gray-300 hover:text-white transition-colors">Documentation</a>
45
  <a href="admin-login.html" class="text-gray-300 hover:text-white transition-colors">Admin</a>
46
  </div>
47
- </div>
48
  <div class="flex items-center space-x-4">
49
  <a href="login.html" class="bg-gray-700 hover:bg-gray-600 px-4 py-2 rounded-lg text-white font-medium transition-colors">
50
  Sign In
 
38
  </div>
39
  <div class="hidden md:flex space-x-6">
40
  <a href="workspaces.html" class="text-red-400 hover:text-red-300 transition-colors">Workspaces</a>
 
41
  <a href="templates.html" class="text-gray-300 hover:text-white transition-colors">Templates</a>
42
  <a href="deployments.html" class="text-gray-300 hover:text-white transition-colors">Deployments</a>
43
  <a href="documentation.html" class="text-gray-300 hover:text-white transition-colors">Documentation</a>
44
  <a href="admin-login.html" class="text-gray-300 hover:text-white transition-colors">Admin</a>
45
  </div>
46
+ </div>
47
  <div class="flex items-center space-x-4">
48
  <a href="login.html" class="bg-gray-700 hover:bg-gray-600 px-4 py-2 rounded-lg text-white font-medium transition-colors">
49
  Sign In