Skip to content

Commit bff628c

Browse files
authored
feat: updated web interface with the actual content which need to show
1 parent b82f0fe commit bff628c

11 files changed

Lines changed: 1595 additions & 350 deletions

File tree

apps/web/README.md

Lines changed: 19 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,73 +1,32 @@
1-
# React + TypeScript + Vite
1+
# DevCard Web Platform
22

3-
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
3+
This is the informational web platform for DevCard, built with React, TypeScript, and Vite.
4+
It serves as the main landing page to guide users and contributors to our community, github repository, and mobile app.
45

5-
Currently, two official plugins are available:
6+
## Running Locally
67

7-
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
8-
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)
8+
To run the web application locally:
99

10-
## React Compiler
11-
12-
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
13-
14-
## Expanding the ESLint configuration
10+
```bash
11+
npm run dev
12+
```
1513

16-
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
14+
## Testing
1715

18-
```js
19-
export default defineConfig([
20-
globalIgnores(['dist']),
21-
{
22-
files: ['**/*.{ts,tsx}'],
23-
extends: [
24-
// Other configs...
16+
This project uses Vitest and React Testing Library for testing.
2517

26-
// Remove tseslint.configs.recommended and replace with this
27-
tseslint.configs.recommendedTypeChecked,
28-
// Alternatively, use this for stricter rules
29-
tseslint.configs.strictTypeChecked,
30-
// Optionally, add this for stylistic rules
31-
tseslint.configs.stylisticTypeChecked,
18+
To run the tests:
3219

33-
// Other configs...
34-
],
35-
languageOptions: {
36-
parserOptions: {
37-
project: ['./tsconfig.node.json', './tsconfig.app.json'],
38-
tsconfigRootDir: import.meta.dirname,
39-
},
40-
// other options...
41-
},
42-
},
43-
])
20+
```bash
21+
npm run test
4422
```
4523

46-
You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
24+
## Contributing
25+
26+
The web app is a simple, clean, and informative landing page. If you'd like to add sections or improve the UI, make sure you maintain the minimal and professional design aesthetic.
4727

48-
```js
49-
// eslint.config.js
50-
import reactX from 'eslint-plugin-react-x'
51-
import reactDom from 'eslint-plugin-react-dom'
28+
If you are developing a production application, you can build it with:
5229

53-
export default defineConfig([
54-
globalIgnores(['dist']),
55-
{
56-
files: ['**/*.{ts,tsx}'],
57-
extends: [
58-
// Other configs...
59-
// Enable lint rules for React
60-
reactX.configs['recommended-typescript'],
61-
// Enable lint rules for React DOM
62-
reactDom.configs.recommended,
63-
],
64-
languageOptions: {
65-
parserOptions: {
66-
project: ['./tsconfig.node.json', './tsconfig.app.json'],
67-
tsconfigRootDir: import.meta.dirname,
68-
},
69-
// other options...
70-
},
71-
},
72-
])
30+
```bash
31+
npm run build
7332
```

apps/web/index.html

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,20 @@
11
<!doctype html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22><text y=%2224%22 font-size=%2224%22>⚡</text></svg>" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<meta name="theme-color" content="#0f0f1a" />
8-
<meta name="description" content="One Tap. Every Profile. Every Platform. Open Source Developer Profile Exchange Platform." />
9-
<title>DevCard — Developer Profile Exchange</title>
10-
</head>
11-
<body>
12-
<div id="root"></div>
13-
<script type="module" src="/src/main.tsx"></script>
14-
</body>
15-
</html>
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<link rel="icon"
7+
href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22><text y=%2224%22 font-size=%2224%22>⚡</text></svg>" />
8+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
9+
<meta name="theme-color" content="#0f0f1a" />
10+
<meta name="description"
11+
content="One Tap. Every Profile. Every Platform. Open Source Developer Profile Exchange Platform." />
12+
<title>DevCard - Developer Profile Exchange</title>
13+
</head>
14+
15+
<body>
16+
<div id="root"></div>
17+
<script type="module" src="/src/main.tsx"></script>
18+
</body>
19+
20+
</html>

0 commit comments

Comments
 (0)