Skip to content

Commit 098b8d3

Browse files
authored
Merge pull request #13 from Abhishek88788/feature/1-create-index-page-react
Feature/1 create index page react
2 parents 8994537 + 9063183 commit 098b8d3

89 files changed

Lines changed: 13377 additions & 0 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

index-page/.gitignore

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

index-page/README.md

Lines changed: 282 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,282 @@
1+
# Index Page - React Implementation
2+
3+
> 🚀 **First Version / Prototype**
4+
> This is the initial React implementation for [Issue #1: Create index.html](https://github.com/AryanVBW/Kali-Linux-for-Android/issues/1)
5+
6+
<div align="center">
7+
8+
![Version](https://img.shields.io/badge/version-1.0.0-blue)
9+
![Status](https://img.shields.io/badge/status-prototype-orange)
10+
11+
</div>
12+
13+
---
14+
15+
## 🛠️ Tech Stack
16+
17+
<div align="center">
18+
19+
<table>
20+
<tr>
21+
<td align="center" width="100">
22+
<img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/react/react-original.svg" width="60" height="60" alt="React" />
23+
<br><sub>React</sub>
24+
</td>
25+
<td align="center" width="100">
26+
<img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/typescript/typescript-original.svg" width="60" height="60" alt="TypeScript" />
27+
<br><sub>TypeScript</sub>
28+
</td>
29+
<td align="center" width="100">
30+
<img src="https://vitejs.dev/logo.svg" width="60" height="60" alt="Vite" />
31+
<br><sub>Vite</sub>
32+
</td>
33+
<td align="center" width="100">
34+
<img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/tailwindcss/tailwindcss-original.svg" width="60" height="60" alt="Tailwind" />
35+
<br><sub>Tailwind</sub>
36+
</td>
37+
</tr>
38+
<tr>
39+
<td align="center" width="100">
40+
<img src="https://ui.shadcn.com/apple-touch-icon.png" width="60" height="60" alt="Shadcn" />
41+
<br><sub>Shadcn/ui</sub>
42+
</td>
43+
<td align="center" width="100">
44+
<img src="https://avatars.githubusercontent.com/u/75042455?s=200&v=4" width="60" height="60" alt="Radix UI" />
45+
<br><sub>Radix UI</sub>
46+
</td>
47+
<td align="center" width="100">
48+
<img src="https://react-hook-form.com/images/logo/react-hook-form-logo-only.png" width="60" height="60" alt="React Hook Form" />
49+
<br><sub>Hook Form</sub>
50+
</td>
51+
<td align="center" width="100">
52+
<img src="https://zod.dev/_next/image?url=%2Flogo%2Flogo-glow.png&w=640&q=100" width="60" height="60" alt="Zod" />
53+
<br><sub>Zod</sub>
54+
</td>
55+
</tr>
56+
<tr>
57+
<td align="center" width="100">
58+
<img src="https://avatars.githubusercontent.com/u/72518640?s=200&v=4" width="60" height="60" alt="TanStack Query" />
59+
<br><sub>TanStack</sub>
60+
</td>
61+
<td align="center" width="100">
62+
<img src="https://avatars.githubusercontent.com/u/2386673?s=200&v=4" width="60" height="60" alt="GSAP" />
63+
<br><sub>GSAP</sub>
64+
</td>
65+
<td align="center" width="100">
66+
<img src="https://lucide.dev/logo.light.svg" width="60" height="60" alt="Lucide" />
67+
<br><sub>Lucide</sub>
68+
</td>
69+
<td align="center" width="100">
70+
<img src="https://api.logo.com/api/v2/images?design=lg_eEP7IzkMfgpFktNQkQ&u=1757874178859&width=1600&height=900&margins=300&fit=contain&format=webp&quality=60&tightBounds=true" width="60" height="60" alt="Recharts" />
71+
<br><sub>Recharts</sub>
72+
</td>
73+
</tr>
74+
</table>
75+
76+
</div>
77+
78+
---
79+
80+
## 📦 Installation Guide
81+
82+
### Prerequisites
83+
84+
<div align="center">
85+
86+
<table>
87+
<tr>
88+
<td align="center" width="200">
89+
<img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/nodejs/nodejs-original.svg" width="80" height="80" alt="Node.js" />
90+
<br><br>
91+
<b>Node.js</b>
92+
<br>
93+
<sub>Version 18 or higher</sub>
94+
<br><br>
95+
<a href="https://nodejs.org/">Download Here</a>
96+
</td>
97+
<td align="center" width="200">
98+
<img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/npm/npm-original-wordmark.svg" width="80" height="80" alt="npm" />
99+
<br><br>
100+
<b>npm</b>
101+
<br>
102+
<sub>Version 9 or higher</sub>
103+
<br><br>
104+
<sub>(Comes with Node.js)</sub>
105+
</td>
106+
<td align="center" width="200">
107+
<img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/git/git-original.svg" width="80" height="80" alt="Git" />
108+
<br><br>
109+
<b>Git</b>
110+
<br>
111+
<sub>Latest version</sub>
112+
<br><br>
113+
<a href="https://git-scm.com/">Download Here</a>
114+
</td>
115+
</tr>
116+
</table>
117+
118+
</div>
119+
120+
### Check Your Installation
121+
122+
```bash
123+
# Verify Node.js is installed
124+
node --version
125+
# Expected output: v18.x.x or higher
126+
127+
# Verify npm is installed
128+
npm --version
129+
# Expected output: 9.x.x or higher
130+
131+
# Verify Git is installed
132+
git --version
133+
# Expected output: git version 2.x.x
134+
```
135+
136+
---
137+
138+
### Step 1️⃣: Navigate to Project Directory
139+
140+
```bash
141+
# Open terminal and navigate to the project folder
142+
cd Kali-Linux-for-Android/index-page
143+
```
144+
145+
<div align="center">
146+
<img src="https://img.shields.io/badge/Current_Directory-index--page-blue?style=for-the-badge" alt="Directory" />
147+
</div>
148+
149+
---
150+
151+
### Step 2️⃣: Install Dependencies
152+
153+
```bash
154+
# Install all required packages
155+
npm install
156+
```
157+
158+
<div align="center">
159+
160+
**⏳ Installation in Progress...**
161+
162+
This will download and install **60+ packages**
163+
164+
Expected time: **2-5 minutes** (depending on your internet speed)
165+
166+
</div>
167+
168+
#### What's Being Installed?
169+
170+
- ✅ React & React DOM
171+
- ✅ TypeScript & Type Definitions
172+
- ✅ Vite Build Tool
173+
- ✅ Tailwind CSS & Plugins
174+
- ✅ Shadcn/ui Components
175+
- ✅ Radix UI Primitives
176+
- ✅ Form Libraries (React Hook Form, Zod)
177+
- ✅ State Management (TanStack Query)
178+
- ✅ Animation Libraries (GSAP)
179+
- ✅ Icons & UI Utilities
180+
181+
#### Success Output
182+
183+
```bash
184+
added 1247 packages, and audited 1248 packages in 3m
185+
186+
found 0 vulnerabilities
187+
```
188+
189+
---
190+
191+
### Step 3️⃣: Start Development Server
192+
193+
```bash
194+
# Start the local development server
195+
npm run dev
196+
```
197+
198+
#### Success Output
199+
200+
```bash
201+
VITE v5.4.19 ready in 342 ms
202+
203+
➜ Local: http://localhost:8080/
204+
➜ Network: http://192.168.56.1:8080/
205+
➜ Network: http://172.16.2.10:8080/
206+
➜ press h + enter to show help
207+
```
208+
209+
<div align="center">
210+
211+
### 🎉 Success! Your app is running!
212+
213+
**Open your browser and visit:**
214+
215+
## 🌐 [`http://localhost:8080`](http://localhost:8080)
216+
217+
<img src="https://img.shields.io/badge/Status-Running-success?style=for-the-badge&logo=vercel" alt="Running" />
218+
219+
</div>
220+
221+
---
222+
223+
### Step 4️⃣: Making Changes
224+
225+
The development server supports **Hot Module Replacement (HMR)**
226+
227+
**This means:**
228+
- ✨ Save any file → See changes instantly
229+
- 🚫 No manual refresh needed
230+
- ⚡ Lightning-fast updates
231+
232+
```bash
233+
# Keep the terminal running
234+
# Edit files in your code editor (VS Code, etc.)
235+
# Changes appear automatically in browser!
236+
```
237+
238+
---
239+
240+
### Step 5️⃣: Stop the Server
241+
242+
```bash
243+
# Press Ctrl + C in terminal to stop
244+
# Or close the terminal window
245+
```
246+
247+
---
248+
249+
## 🎯 Issue Reference
250+
251+
**Resolves:** [#1 - Create index.html for this Repository](https://github.com/AryanVBW/Kali-Linux-for-Android/issues/1)
252+
253+
**Original Discussion:**
254+
- [@AryanVBW](https://github.com/AryanVBW) - Project Owner
255+
- [@Abhishek88788](https://github.com/Abhishek88788) - Contributor
256+
257+
---
258+
259+
## 👨‍💻 Developer
260+
261+
<div align="center">
262+
263+
<a href="https://github.com/Abhishek88788">
264+
<img src="https://github.com/Abhishek88788.png" width="120" height="120" style="border-radius: 50%; border: 3px solid #0366d6;" alt="Abhishek88788" />
265+
</a>
266+
267+
<br><br>
268+
269+
### Abhishek Kumar
270+
271+
[![GitHub](https://img.shields.io/badge/GitHub-Abhishek88788-181717?style=for-the-badge&logo=github)](https://github.com/Abhishek88788)
272+
[![Profile](https://img.shields.io/badge/View_Profile-0366d6?style=for-the-badge&logo=github)](https://github.com/Abhishek88788)
273+
274+
</div>
275+
276+
---
277+
278+
<div align="center">
279+
280+
**Made with ❤️ for** [Kali Linux for Android](https://github.com/AryanVBW/Kali-Linux-for-Android)
281+
282+
</div>

index-page/components.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema.json",
3+
"style": "default",
4+
"rsc": false,
5+
"tsx": true,
6+
"tailwind": {
7+
"config": "tailwind.config.ts",
8+
"css": "src/index.css",
9+
"baseColor": "slate",
10+
"cssVariables": true,
11+
"prefix": ""
12+
},
13+
"aliases": {
14+
"components": "@/components",
15+
"utils": "@/lib/utils",
16+
"ui": "@/components/ui",
17+
"lib": "@/lib",
18+
"hooks": "@/hooks"
19+
}
20+
}

index-page/eslint.config.js

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import js from "@eslint/js";
2+
import globals from "globals";
3+
import reactHooks from "eslint-plugin-react-hooks";
4+
import reactRefresh from "eslint-plugin-react-refresh";
5+
import tseslint from "typescript-eslint";
6+
7+
export default tseslint.config(
8+
{ ignores: ["dist"] },
9+
{
10+
extends: [js.configs.recommended, ...tseslint.configs.recommended],
11+
files: ["**/*.{ts,tsx}"],
12+
languageOptions: {
13+
ecmaVersion: 2020,
14+
globals: globals.browser,
15+
},
16+
plugins: {
17+
"react-hooks": reactHooks,
18+
"react-refresh": reactRefresh,
19+
},
20+
rules: {
21+
...reactHooks.configs.recommended.rules,
22+
"react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
23+
"@typescript-eslint/no-unused-vars": "off",
24+
},
25+
},
26+
);

index-page/index.html

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" href="/favicon.ico" type="image/x-icon">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>LinuxDroid - Run Linux on Android</title>
8+
<meta name="description" content="The ultimate penetration testing OS, now in your pocket. Run Kali Linux and other distributions on Android with LinuxDroid." />
9+
<meta name="author" content="LinuxDroid" />
10+
<link rel="preconnect" href="https://fonts.googleapis.com">
11+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
12+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
13+
14+
<meta property="og:title" content="LinuxDroid - Run Linux on Android" />
15+
<meta property="og:description" content="The ultimate penetration testing OS, now in your pocket. Run Kali Linux and other distributions on Android with LinuxDroid." />
16+
<meta property="og:type" content="website" />
17+
18+
</head>
19+
20+
<body>
21+
<div id="root"></div>
22+
<script type="module" src="/src/main.tsx"></script>
23+
</body>
24+
</html>

0 commit comments

Comments
 (0)