Delete index2.html
Browse files- index2.html +0 -299
index2.html
DELETED
@@ -1,299 +0,0 @@
|
|
1 |
-
<!DOCTYPE html>
|
2 |
-
<html lang="en">
|
3 |
-
<head>
|
4 |
-
<meta charset="UTF-8">
|
5 |
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
6 |
-
<title>Ali Brown | PyFundaments</title>
|
7 |
-
<script src="https://cdn.tailwindcss.com"></script>
|
8 |
-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
9 |
-
<script>
|
10 |
-
tailwind.config = {
|
11 |
-
theme: {
|
12 |
-
extend: {
|
13 |
-
colors: {
|
14 |
-
'hf-purple': '#FFD700',
|
15 |
-
'hf-dark': '#0F172A',
|
16 |
-
'hf-light': '#F8FAFC',
|
17 |
-
'hf-accent': '#7C3AED',
|
18 |
-
},
|
19 |
-
fontFamily: {
|
20 |
-
sans: ['Inter', 'sans-serif'],
|
21 |
-
},
|
22 |
-
animation: {
|
23 |
-
'float': 'float 6s ease-in-out infinite',
|
24 |
-
'gradient': 'gradient 8s ease infinite',
|
25 |
-
},
|
26 |
-
keyframes: {
|
27 |
-
float: {
|
28 |
-
'0%, 100%': { transform: 'translateY(0)' },
|
29 |
-
'50%': { transform: 'translateY(-10px)' },
|
30 |
-
},
|
31 |
-
gradient: {
|
32 |
-
'0%, 100%': { 'background-position': '0% 50%' },
|
33 |
-
'50%': { 'background-position': '100% 50%' },
|
34 |
-
}
|
35 |
-
}
|
36 |
-
}
|
37 |
-
}
|
38 |
-
}
|
39 |
-
</script>
|
40 |
-
<style>
|
41 |
-
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
|
42 |
-
body {
|
43 |
-
font-family: 'Inter', sans-serif;
|
44 |
-
background-color: #0F172A;
|
45 |
-
color: #F8FAFC;
|
46 |
-
}
|
47 |
-
|
48 |
-
.gradient-bg {
|
49 |
-
background: linear-gradient(-45deg, #0F172A, #1E293B, #334155, #475569);
|
50 |
-
background-size: 400% 400%;
|
51 |
-
animation: gradient 15s ease infinite;
|
52 |
-
}
|
53 |
-
|
54 |
-
.card-hover {
|
55 |
-
transition: all 0.3s ease;
|
56 |
-
}
|
57 |
-
|
58 |
-
.card-hover:hover {
|
59 |
-
transform: translateY(-5px);
|
60 |
-
box-shadow: 0 10px 25px rgba(124, 58, 237, 0.3);
|
61 |
-
}
|
62 |
-
|
63 |
-
.social-icon {
|
64 |
-
transition: all 0.3s ease;
|
65 |
-
}
|
66 |
-
|
67 |
-
.social-icon:hover {
|
68 |
-
transform: scale(1.2);
|
69 |
-
color: #FFD700;
|
70 |
-
}
|
71 |
-
|
72 |
-
.nav-link {
|
73 |
-
position: relative;
|
74 |
-
}
|
75 |
-
|
76 |
-
.nav-link::after {
|
77 |
-
content: '';
|
78 |
-
position: absolute;
|
79 |
-
width: 0;
|
80 |
-
height: 2px;
|
81 |
-
bottom: -2px;
|
82 |
-
left: 0;
|
83 |
-
background-color: #FFD700;
|
84 |
-
transition: width 0.3s ease;
|
85 |
-
}
|
86 |
-
|
87 |
-
.nav-link:hover::after {
|
88 |
-
width: 100%;
|
89 |
-
}
|
90 |
-
|
91 |
-
.app-card {
|
92 |
-
background: rgba(30, 41, 59, 0.7);
|
93 |
-
backdrop-filter: blur(10px);
|
94 |
-
border: 1px solid rgba(255, 255, 255, 0.1);
|
95 |
-
}
|
96 |
-
</style>
|
97 |
-
</head>
|
98 |
-
<body class="min-h-screen gradient-bg">
|
99 |
-
<nav class="bg-hf-dark/80 backdrop-blur-md border-b border-gray-800 fixed w-full z-50">
|
100 |
-
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
101 |
-
<div class="flex items-center justify-between h-16">
|
102 |
-
<div class="flex items-center">
|
103 |
-
<div class="flex-shrink-0">
|
104 |
-
<span class="text-hf-purple font-bold text-xl">Ali Brown</span>
|
105 |
-
</div>
|
106 |
-
<div class="hidden md:block">
|
107 |
-
<div class="ml-10 flex items-baseline space-x-4">
|
108 |
-
<a href="index.html#home" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Home</a>
|
109 |
-
<a href="index.html#projects" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Projects</a>
|
110 |
-
<a href="index.html#about" class="nav-link text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">About</a>
|
111 |
-
</div>
|
112 |
-
</div>
|
113 |
-
</div>
|
114 |
-
<div class="hidden md:block">
|
115 |
-
<div class="ml-4 flex items-center md:ml-6">
|
116 |
-
<a href="https://huggingface.co/AliBrown" target="_blank" class="bg-hf-purple hover:bg-yellow-500 text-hf-dark px-4 py-2 rounded-md text-sm font-medium flex items-center">
|
117 |
-
<i class="fas fa-robot mr-2"></i> Visit Hugging Face
|
118 |
-
</a>
|
119 |
-
</div>
|
120 |
-
</div>
|
121 |
-
<div class="-mr-2 flex md:hidden">
|
122 |
-
<button type="button" id="mobile-menu-button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none">
|
123 |
-
<span class="sr-only">Open main menu</span>
|
124 |
-
<i class="fas fa-bars"></i>
|
125 |
-
</button>
|
126 |
-
</div>
|
127 |
-
</div>
|
128 |
-
</div>
|
129 |
-
|
130 |
-
<div class="hidden md:hidden" id="mobile-menu">
|
131 |
-
<div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
|
132 |
-
<a href="index.html#home" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Home</a>
|
133 |
-
<a href="index.html#projects" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Projects</a>
|
134 |
-
<a href="index.html#about" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">About</a>
|
135 |
-
<a href="https://huggingface.co/AliBrown" target="_blank" class="bg-hf-purple hover:bg-yellow-500 text-hf-dark block px-3 py-2 rounded-md text-base font-medium flex items-center justify-center">
|
136 |
-
<i class="fas fa-robot mr-2"></i> Visit Hugging Face
|
137 |
-
</a>
|
138 |
-
</div>
|
139 |
-
</div>
|
140 |
-
</nav>
|
141 |
-
|
142 |
-
<main class="pt-32 pb-20 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto">
|
143 |
-
<section class="mb-16">
|
144 |
-
<h1 class="text-4xl md:text-5xl font-bold mb-4">
|
145 |
-
<span class="text-hf-purple">PyFundaments:</span> A Secure Python Micro-Framework
|
146 |
-
</h1>
|
147 |
-
<p class="text-lg text-gray-300 max-w-4xl">
|
148 |
-
PyFundaments is not a monolithic framework, but a meticulously crafted, modular foundation for Python applications. It was developed with a **"security-first" mindset**, aiming to provide every application with a stable, secure, and clean fundament. The architecture is designed to be flexible, adapting to the needs of various projects—be it a simple Discord bot, a complex ML pipeline, or a full-fledged web application.
|
149 |
-
</p>
|
150 |
-
</section>
|
151 |
-
|
152 |
-
<section class="mb-16">
|
153 |
-
<h2 class="text-3xl md:text-4xl font-bold mb-8">Core Principles</h2>
|
154 |
-
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
|
155 |
-
<div class="app-card rounded-xl p-6 h-full card-hover flex flex-col">
|
156 |
-
<div class="flex items-center mb-4">
|
157 |
-
<div class="bg-hf-purple/20 p-3 rounded-lg">
|
158 |
-
<i class="fas fa-shield-halved text-hf-purple text-2xl"></i>
|
159 |
-
</div>
|
160 |
-
<h3 class="text-xl font-semibold ml-4">Security by Design</h3>
|
161 |
-
</div>
|
162 |
-
<p class="text-gray-400">Every application starts on a verified, secure base, minimizing vulnerabilities from the ground up.</p>
|
163 |
-
</div>
|
164 |
-
<div class="app-card rounded-xl p-6 h-full card-hover flex flex-col">
|
165 |
-
<div class="flex items-center mb-4">
|
166 |
-
<div class="bg-hf-purple/20 p-3 rounded-lg">
|
167 |
-
<i class="fas fa-cubes text-hf-purple text-2xl"></i>
|
168 |
-
</div>
|
169 |
-
<h3 class="text-xl font-semibold ml-4">Modular Architecture</h3>
|
170 |
-
</div>
|
171 |
-
<p class="text-gray-400">Services are initialized only as needed, ensuring a lean and efficient execution tailored to the project.</p>
|
172 |
-
</div>
|
173 |
-
<div class="app-card rounded-xl p-6 h-full card-hover flex flex-col">
|
174 |
-
<div class="flex items-center mb-4">
|
175 |
-
<div class="bg-hf-purple/20 p-3 rounded-lg">
|
176 |
-
<i class="fas fa-link-slash text-hf-purple text-2xl"></i>
|
177 |
-
</div>
|
178 |
-
<h3 class="text-xl font-semibold ml-4">Clear Separation</h3>
|
179 |
-
</div>
|
180 |
-
<p class="text-gray-400">A clean divide between business logic and infrastructure, handled by `main.py` and `app.py`.</p>
|
181 |
-
</div>
|
182 |
-
<div class="app-card rounded-xl p-6 h-full card-hover flex flex-col">
|
183 |
-
<div class="flex items-center mb-4">
|
184 |
-
<div class="bg-hf-purple/20 p-3 rounded-lg">
|
185 |
-
<i class="fas fa-gear text-hf-purple text-2xl"></i>
|
186 |
-
</div>
|
187 |
-
<h3 class="text-xl font-semibold ml-4">Flexibility</h3>
|
188 |
-
</div>
|
189 |
-
<p class="text-gray-400">Conditional loading of services via the `.env` file allows projects to use only what they need.</p>
|
190 |
-
</div>
|
191 |
-
</div>
|
192 |
-
</section>
|
193 |
-
|
194 |
-
<section class="mb-16">
|
195 |
-
<h2 class="text-3xl md:text-4xl font-bold mb-8">How It Works</h2>
|
196 |
-
<div class="app-card rounded-xl p-8">
|
197 |
-
<p class="text-gray-400 mb-6">
|
198 |
-
The heart of the framework is `main.py`. It serves as the first line of defense, ensuring all necessary components are in place. It validates your configuration, initializes required services (like PostgreSQL database connections, encryption, or user management), and makes them available to your application. Services for which no configuration is found are gracefully skipped.
|
199 |
-
</p>
|
200 |
-
<div class="bg-hf-dark/80 p-6 rounded-lg border border-gray-700 space-y-4">
|
201 |
-
<div>
|
202 |
-
<h4 class="text-hf-purple font-medium mb-2">Installation</h4>
|
203 |
-
<pre class="text-gray-300 bg-gray-900 rounded-lg p-3"><code>pip install -r requirements.txt</code></pre>
|
204 |
-
</div>
|
205 |
-
<div>
|
206 |
-
<h4 class="text-hf-purple font-medium mb-2">Execution</h4>
|
207 |
-
<pre class="text-gray-300 bg-gray-900 rounded-lg p-3"><code>python main.py</code></pre>
|
208 |
-
</div>
|
209 |
-
</div>
|
210 |
-
</div>
|
211 |
-
</section>
|
212 |
-
|
213 |
-
<section class="mb-16">
|
214 |
-
<h2 class="text-3xl md:text-4xl font-bold mb-8">Key Modules</h2>
|
215 |
-
<div class="app-card rounded-xl p-8">
|
216 |
-
<p class="text-gray-400 mb-6">
|
217 |
-
PyFundaments includes a suite of security-critical modules, all housed within the `fundaments/` directory. Each module has a specific role in securing your application.
|
218 |
-
</p>
|
219 |
-
<div class="overflow-x-auto">
|
220 |
-
<table class="min-w-full text-left">
|
221 |
-
<thead class="border-b-2 border-gray-700">
|
222 |
-
<tr>
|
223 |
-
<th class="py-3 px-4 font-semibold text-hf-purple">Module</th>
|
224 |
-
<th class="py-3 px-4 font-semibold text-hf-purple">Description</th>
|
225 |
-
</tr>
|
226 |
-
</thead>
|
227 |
-
<tbody>
|
228 |
-
<tr class="border-b border-gray-800">
|
229 |
-
<td class="py-4 px-4 text-gray-300">`access_control.py`</td>
|
230 |
-
<td class="py-4 px-4 text-gray-400">Role-based access management for your application.</td>
|
231 |
-
</tr>
|
232 |
-
<tr class="border-b border-gray-800">
|
233 |
-
<td class="py-4 px-4 text-gray-300">`encryption.py`</td>
|
234 |
-
<td class="py-4 px-4 text-gray-400">Robust cryptographic routines for data security.</td>
|
235 |
-
</tr>
|
236 |
-
<tr class="border-b border-gray-800">
|
237 |
-
<td class="py-4 px-4 text-gray-300">`postgresql.py`</td>
|
238 |
-
<td class="py-4 px-4 text-gray-400">Secure, asynchronous database access.</td>
|
239 |
-
</tr>
|
240 |
-
<tr class="border-b border-gray-800">
|
241 |
-
<td class="py-4 px-4 text-gray-300">`security.py`</td>
|
242 |
-
<td class="py-4 px-4 text-gray-400">The central layer for orchestrating security measures.</td>
|
243 |
-
</tr>
|
244 |
-
<tr>
|
245 |
-
<td class="py-4 px-4 text-gray-300">`user_handler.py`</td>
|
246 |
-
<td class="py-4 px-4 text-gray-400">Module for managing authentication and identities.</td>
|
247 |
-
</tr>
|
248 |
-
</tbody>
|
249 |
-
</table>
|
250 |
-
</div>
|
251 |
-
</div>
|
252 |
-
</section>
|
253 |
-
|
254 |
-
<section class="mb-16">
|
255 |
-
<h2 class="text-3xl md:text-4xl font-bold mb-8">License and Ethics</h2>
|
256 |
-
<div class="app-card rounded-xl p-8">
|
257 |
-
<p class="text-gray-400 mb-4">
|
258 |
-
PyFundaments is released under the Apache 2.0 License. It's crucial to note that the project includes a **mandatory ethical use policy**. Its use is strictly prohibited for any purposes that promote hatred, facilitate illegal activities, or spread malicious content.
|
259 |
-
</p>
|
260 |
-
<p class="text-gray-400">
|
261 |
-
Give a ⭐ if you find the structure helpful!
|
262 |
-
</p>
|
263 |
-
</div>
|
264 |
-
</section>
|
265 |
-
</main>
|
266 |
-
|
267 |
-
<footer class="bg-hf-dark/50 border-t border-gray-800 py-10">
|
268 |
-
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
269 |
-
<div class="flex flex-col md:flex-row justify-between items-center">
|
270 |
-
<div class="mb-6 md:mb-0">
|
271 |
-
<span class="text-hf-purple font-bold text-xl">Ali Brown aka Volkan Sah</span>
|
272 |
-
<p class="text-gray-400 mt-2">Building the future, securely.</p>
|
273 |
-
</div>
|
274 |
-
<div class="flex flex-wrap justify-center gap-6">
|
275 |
-
<a href="index.html#home" class="text-gray-400 hover:text-hf-purple">Home</a>
|
276 |
-
<a href="index.html#projects" class="text-gray-400 hover:text-hf-purple">Projects</a>
|
277 |
-
<a href="index.html#about" class="text-gray-400 hover:text-hf-purple">About</a>
|
278 |
-
</div>
|
279 |
-
</div>
|
280 |
-
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-gray-500 text-sm">
|
281 |
-
<p>© 2025 Ali Brown aka Volkan Sah Portfolio. All rights reserved.</p>
|
282 |
-
</div>
|
283 |
-
</div>
|
284 |
-
</footer>
|
285 |
-
|
286 |
-
<script>
|
287 |
-
document.addEventListener('DOMContentLoaded', function () {
|
288 |
-
// Mobile menu toggle
|
289 |
-
const mobileMenuButton = document.getElementById('mobile-menu-button');
|
290 |
-
const mobileMenu = document.getElementById('mobile-menu');
|
291 |
-
if (mobileMenuButton) {
|
292 |
-
mobileMenuButton.addEventListener('click', () => {
|
293 |
-
mobileMenu.classList.toggle('hidden');
|
294 |
-
});
|
295 |
-
}
|
296 |
-
});
|
297 |
-
</script>
|
298 |
-
</body>
|
299 |
-
</html>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|