create-zs3-app 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +182 -0
- package/bin/cli.js +118 -0
- package/package.json +38 -0
- package/src/index.js +981 -0
- package/templates/backend-ts/.editorconfig +21 -0
- package/templates/backend-ts/.env.example +2 -0
- package/templates/backend-ts/.prettierignore +28 -0
- package/templates/backend-ts/.prettierrc +13 -0
- package/templates/backend-ts/README.md +55 -0
- package/templates/backend-ts/eslint.config.js +43 -0
- package/templates/backend-ts/package.json +35 -0
- package/templates/backend-ts/src/index.ts +7 -0
- package/templates/backend-ts/tsconfig.json +25 -0
- package/templates/backend-ts-express/.editorconfig +21 -0
- package/templates/backend-ts-express/.env.example +2 -0
- package/templates/backend-ts-express/.prettierignore +28 -0
- package/templates/backend-ts-express/.prettierrc +13 -0
- package/templates/backend-ts-express/README.md +59 -0
- package/templates/backend-ts-express/eslint.config.js +43 -0
- package/templates/backend-ts-express/package.json +37 -0
- package/templates/backend-ts-express/src/index.ts +17 -0
- package/templates/backend-ts-express/tsconfig.json +25 -0
- package/templates/backend-vanilla/.editorconfig +21 -0
- package/templates/backend-vanilla/.env.example +2 -0
- package/templates/backend-vanilla/.prettierignore +28 -0
- package/templates/backend-vanilla/.prettierrc +13 -0
- package/templates/backend-vanilla/README.md +46 -0
- package/templates/backend-vanilla/eslint.config.js +27 -0
- package/templates/backend-vanilla/package.json +29 -0
- package/templates/backend-vanilla/src/index.js +7 -0
- package/templates/backend-vanilla-express/.editorconfig +21 -0
- package/templates/backend-vanilla-express/.env.example +2 -0
- package/templates/backend-vanilla-express/.prettierignore +28 -0
- package/templates/backend-vanilla-express/.prettierrc +13 -0
- package/templates/backend-vanilla-express/README.md +50 -0
- package/templates/backend-vanilla-express/eslint.config.js +27 -0
- package/templates/backend-vanilla-express/package.json +30 -0
- package/templates/backend-vanilla-express/src/index.js +17 -0
- package/templates/frontend-ts/.editorconfig +27 -0
- package/templates/frontend-ts/.prettierignore +31 -0
- package/templates/frontend-ts/.prettierrc +13 -0
- package/templates/frontend-ts/README.md +51 -0
- package/templates/frontend-ts/eslint.config.js +43 -0
- package/templates/frontend-ts/index.html +12 -0
- package/templates/frontend-ts/package.json +32 -0
- package/templates/frontend-ts/src/main.ts +14 -0
- package/templates/frontend-ts/src/style.css +56 -0
- package/templates/frontend-ts/tsconfig.json +24 -0
- package/templates/frontend-ts/vite.config.ts +13 -0
- package/templates/frontend-ts-zs3/.editorconfig +27 -0
- package/templates/frontend-ts-zs3/.prettierignore +31 -0
- package/templates/frontend-ts-zs3/.prettierrc +13 -0
- package/templates/frontend-ts-zs3/README.md +51 -0
- package/templates/frontend-ts-zs3/eslint.config.js +43 -0
- package/templates/frontend-ts-zs3/index.html +12 -0
- package/templates/frontend-ts-zs3/package.json +34 -0
- package/templates/frontend-ts-zs3/src/main.ts +31 -0
- package/templates/frontend-ts-zs3/src/style.css +65 -0
- package/templates/frontend-ts-zs3/tsconfig.json +24 -0
- package/templates/frontend-ts-zs3/vite.config.ts +13 -0
- package/templates/frontend-vanilla/.editorconfig +27 -0
- package/templates/frontend-vanilla/.prettierignore +31 -0
- package/templates/frontend-vanilla/.prettierrc +13 -0
- package/templates/frontend-vanilla/README.md +50 -0
- package/templates/frontend-vanilla/eslint.config.js +27 -0
- package/templates/frontend-vanilla/index.html +12 -0
- package/templates/frontend-vanilla/package.json +28 -0
- package/templates/frontend-vanilla/src/main.js +13 -0
- package/templates/frontend-vanilla/src/style.css +56 -0
- package/templates/frontend-vanilla/vite.config.js +12 -0
- package/templates/frontend-vanilla-zs3/.editorconfig +27 -0
- package/templates/frontend-vanilla-zs3/.prettierignore +31 -0
- package/templates/frontend-vanilla-zs3/.prettierrc +13 -0
- package/templates/frontend-vanilla-zs3/README.md +50 -0
- package/templates/frontend-vanilla-zs3/eslint.config.js +27 -0
- package/templates/frontend-vanilla-zs3/index.html +12 -0
- package/templates/frontend-vanilla-zs3/package.json +30 -0
- package/templates/frontend-vanilla-zs3/src/main.js +31 -0
- package/templates/frontend-vanilla-zs3/src/style.css +65 -0
- package/templates/frontend-vanilla-zs3/vite.config.js +12 -0
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import eslint from '@eslint/js'
|
|
2
|
+
import prettierConfig from 'eslint-plugin-prettier/recommended'
|
|
3
|
+
import globals from 'globals'
|
|
4
|
+
import tseslint from 'typescript-eslint'
|
|
5
|
+
|
|
6
|
+
export default [
|
|
7
|
+
{ ignores: ['dist', 'node_modules', 'coverage', '*.js', '*.d.ts'] },
|
|
8
|
+
eslint.configs.recommended,
|
|
9
|
+
...tseslint.configs.recommendedTypeChecked,
|
|
10
|
+
{
|
|
11
|
+
// Configuració global per a tots els fitxers
|
|
12
|
+
languageOptions: {
|
|
13
|
+
globals: {
|
|
14
|
+
...globals.node,
|
|
15
|
+
...globals.jest,
|
|
16
|
+
},
|
|
17
|
+
parserOptions: {
|
|
18
|
+
project: true,
|
|
19
|
+
tsconfigRootDir: import.meta.dirname,
|
|
20
|
+
},
|
|
21
|
+
},
|
|
22
|
+
// Regles que vols aplicar
|
|
23
|
+
rules: {
|
|
24
|
+
'prettier/prettier': 'error',
|
|
25
|
+
semi: ['error', 'never'],
|
|
26
|
+
'@typescript-eslint/no-explicit-any': 'error',
|
|
27
|
+
'@typescript-eslint/explicit-function-return-type': 'warn',
|
|
28
|
+
'@typescript-eslint/explicit-module-boundary-types': 'warn',
|
|
29
|
+
'@typescript-eslint/no-unused-vars': [
|
|
30
|
+
'error',
|
|
31
|
+
{
|
|
32
|
+
argsIgnorePattern: '^_',
|
|
33
|
+
varsIgnorePattern: '^_',
|
|
34
|
+
},
|
|
35
|
+
],
|
|
36
|
+
'@typescript-eslint/no-floating-promises': 'error',
|
|
37
|
+
'@typescript-eslint/strict-boolean-expressions': 'off',
|
|
38
|
+
'@typescript-eslint/prefer-nullish-coalescing': 'warn',
|
|
39
|
+
'@typescript-eslint/prefer-optional-chain': 'warn',
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
prettierConfig, // Aquesta ha de ser l'última configuració per sobreescriure regles d'estil
|
|
43
|
+
]
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="ca">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Frontend Project</title>
|
|
7
|
+
</head>
|
|
8
|
+
<body>
|
|
9
|
+
<div id="app"></div>
|
|
10
|
+
<script type="module" src="/src/main.ts"></script>
|
|
11
|
+
</body>
|
|
12
|
+
</html>
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "frontend-project",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "Frontend project with TypeScript and zs3-ui-components",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"dev": "vite",
|
|
8
|
+
"build": "tsc && vite build",
|
|
9
|
+
"preview": "vite preview",
|
|
10
|
+
"lint": "eslint src",
|
|
11
|
+
"lint:fix": "eslint src --fix",
|
|
12
|
+
"format": "prettier --write \"src/**/*.{ts,tsx,css,html}\"",
|
|
13
|
+
"format:check": "prettier --check \"src/**/*.{ts,tsx,css,html}\"",
|
|
14
|
+
"type-check": "tsc --noEmit"
|
|
15
|
+
},
|
|
16
|
+
"keywords": [],
|
|
17
|
+
"author": "",
|
|
18
|
+
"license": "MIT",
|
|
19
|
+
"dependencies": {
|
|
20
|
+
"zs3-ui-components": "^1.1.0"
|
|
21
|
+
},
|
|
22
|
+
"devDependencies": {
|
|
23
|
+
"@eslint/js": "9.39.2",
|
|
24
|
+
"@types/node": "^20.10.0",
|
|
25
|
+
"eslint": "9.39.2",
|
|
26
|
+
"eslint-config-prettier": "^10.1.5",
|
|
27
|
+
"eslint-plugin-prettier": "^5.0.1",
|
|
28
|
+
"globals": "^16.1.0",
|
|
29
|
+
"prettier": "3.8.1",
|
|
30
|
+
"typescript": "5.9.3",
|
|
31
|
+
"typescript-eslint": "8.53.1",
|
|
32
|
+
"vite": "^5.0.8"
|
|
33
|
+
}
|
|
34
|
+
}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import 'zs3-ui-components'
|
|
2
|
+
import 'zs3-ui-components/css'
|
|
3
|
+
import './style.css'
|
|
4
|
+
import { initThemeSystem, $Notification } from 'zs3-ui-components'
|
|
5
|
+
|
|
6
|
+
initThemeSystem({ defaultTheme: 'light' })
|
|
7
|
+
|
|
8
|
+
const app = document.querySelector<HTMLDivElement>('#app')
|
|
9
|
+
|
|
10
|
+
if (app) {
|
|
11
|
+
app.innerHTML = `
|
|
12
|
+
<div class="container">
|
|
13
|
+
<h1>Frontend Project</h1>
|
|
14
|
+
<p>Projecte creat amb TypeScript, Vite i zs3-ui-components</p>
|
|
15
|
+
|
|
16
|
+
<div class="actions">
|
|
17
|
+
<zs3-button variant="primary" icon="star">Exemple</zs3-button>
|
|
18
|
+
<zs3-button variant="success" id="notify-btn" icon="bell">Notificació</zs3-button>
|
|
19
|
+
</div>
|
|
20
|
+
|
|
21
|
+
<zs3-select-theme zs3-position="position: fixed; top: 1rem; right: 1rem"></zs3-select-theme>
|
|
22
|
+
|
|
23
|
+
<p class="info">Edita <code>src/main.ts</code> per començar</p>
|
|
24
|
+
</div>
|
|
25
|
+
`
|
|
26
|
+
|
|
27
|
+
const notifyBtn = app.querySelector('#notify-btn')
|
|
28
|
+
notifyBtn?.addEventListener('zs3-click', () => {
|
|
29
|
+
$Notification.success('Tot funciona correctament!', { duration: 3000 })
|
|
30
|
+
})
|
|
31
|
+
}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
* {
|
|
2
|
+
margin: 0;
|
|
3
|
+
padding: 0;
|
|
4
|
+
box-sizing: border-box;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
body {
|
|
8
|
+
font-family: var(--zs3-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
|
|
9
|
+
'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif);
|
|
10
|
+
-webkit-font-smoothing: antialiased;
|
|
11
|
+
-moz-osx-font-smoothing: grayscale;
|
|
12
|
+
background: var(--zs3-bg-color, #ffffff);
|
|
13
|
+
color: var(--zs3-fg-color, #333);
|
|
14
|
+
min-height: 100vh;
|
|
15
|
+
display: flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
justify-content: center;
|
|
18
|
+
transition: background var(--zs3-transition-base, 250ms ease-in-out),
|
|
19
|
+
color var(--zs3-transition-base, 250ms ease-in-out);
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.container {
|
|
23
|
+
background: var(--zs3-bg-color, white);
|
|
24
|
+
border: 1px solid var(--zs3-border-color, #d1d5db);
|
|
25
|
+
padding: 3rem;
|
|
26
|
+
border-radius: var(--zs3-border-radius, 0.375rem);
|
|
27
|
+
box-shadow: var(--zs3-shadow-lg, 0 10px 15px -3px rgba(0, 0, 0, 0.1));
|
|
28
|
+
text-align: center;
|
|
29
|
+
max-width: 600px;
|
|
30
|
+
transition: border-color var(--zs3-transition-base, 250ms ease-in-out),
|
|
31
|
+
box-shadow var(--zs3-transition-base, 250ms ease-in-out);
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
h1 {
|
|
35
|
+
font-size: 2.5rem;
|
|
36
|
+
margin-bottom: 1rem;
|
|
37
|
+
color: var(--zs3-primary-color, #3b82f6);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
p {
|
|
41
|
+
font-size: 1.1rem;
|
|
42
|
+
color: var(--zs3-fg-color, #666);
|
|
43
|
+
margin-bottom: 0.5rem;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.actions {
|
|
47
|
+
display: flex;
|
|
48
|
+
gap: 1rem;
|
|
49
|
+
justify-content: center;
|
|
50
|
+
margin: 2rem 0;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.info {
|
|
54
|
+
margin-top: 2rem;
|
|
55
|
+
font-size: 0.95rem;
|
|
56
|
+
opacity: 0.7;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
code {
|
|
60
|
+
background: var(--zs3-border-color, #f4f4f4);
|
|
61
|
+
padding: 0.2rem 0.5rem;
|
|
62
|
+
border-radius: 0.3rem;
|
|
63
|
+
font-family: var(--zs3-font-family-mono, 'Courier New', monospace);
|
|
64
|
+
color: var(--zs3-primary-color, #667eea);
|
|
65
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2022",
|
|
4
|
+
"lib": ["ES2022", "DOM", "DOM.Iterable"],
|
|
5
|
+
"module": "ES2022",
|
|
6
|
+
"moduleResolution": "bundler",
|
|
7
|
+
"jsx": "preserve",
|
|
8
|
+
"strict": true,
|
|
9
|
+
"skipLibCheck": true,
|
|
10
|
+
"esModuleInterop": true,
|
|
11
|
+
"allowSyntheticDefaultImports": true,
|
|
12
|
+
"forceConsistentCasingInFileNames": true,
|
|
13
|
+
"resolveJsonModule": true,
|
|
14
|
+
"isolatedModules": true,
|
|
15
|
+
"noEmit": true,
|
|
16
|
+
"noUnusedLocals": true,
|
|
17
|
+
"noUnusedParameters": true,
|
|
18
|
+
"noImplicitReturns": true,
|
|
19
|
+
"noFallthroughCasesInSwitch": true,
|
|
20
|
+
"allowImportingTsExtensions": true
|
|
21
|
+
},
|
|
22
|
+
"include": ["src/**/*"],
|
|
23
|
+
"exclude": ["node_modules", "dist"]
|
|
24
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
# EditorConfig: https://editorconfig.org
|
|
2
|
+
|
|
3
|
+
root = true
|
|
4
|
+
|
|
5
|
+
[*]
|
|
6
|
+
charset = utf-8
|
|
7
|
+
end_of_line = lf
|
|
8
|
+
indent_style = space
|
|
9
|
+
indent_size = 2
|
|
10
|
+
insert_final_newline = true
|
|
11
|
+
trim_trailing_whitespace = true
|
|
12
|
+
max_line_length = 150
|
|
13
|
+
|
|
14
|
+
[*.md]
|
|
15
|
+
trim_trailing_whitespace = false
|
|
16
|
+
|
|
17
|
+
[*.json]
|
|
18
|
+
indent_size = 2
|
|
19
|
+
|
|
20
|
+
[*.{js,ts,jsx,tsx}]
|
|
21
|
+
indent_size = 2
|
|
22
|
+
|
|
23
|
+
[*.{css,scss,sass,less}]
|
|
24
|
+
indent_size = 2
|
|
25
|
+
|
|
26
|
+
[*.html]
|
|
27
|
+
indent_size = 2
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
# Dependencies
|
|
2
|
+
node_modules
|
|
3
|
+
|
|
4
|
+
# Build output
|
|
5
|
+
dist
|
|
6
|
+
build
|
|
7
|
+
coverage
|
|
8
|
+
|
|
9
|
+
# Lock files
|
|
10
|
+
package-lock.json
|
|
11
|
+
yarn.lock
|
|
12
|
+
pnpm-lock.yaml
|
|
13
|
+
|
|
14
|
+
# Logs
|
|
15
|
+
*.log
|
|
16
|
+
|
|
17
|
+
# Environment
|
|
18
|
+
.env
|
|
19
|
+
.env.*
|
|
20
|
+
|
|
21
|
+
# Cache
|
|
22
|
+
.cache
|
|
23
|
+
.eslintcache
|
|
24
|
+
.prettierrc.cache
|
|
25
|
+
|
|
26
|
+
# OS
|
|
27
|
+
.DS_Store
|
|
28
|
+
Thumbs.db
|
|
29
|
+
|
|
30
|
+
# Vite
|
|
31
|
+
.vite
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
{
|
|
2
|
+
"semi": false,
|
|
3
|
+
"trailingComma": "es5",
|
|
4
|
+
"singleQuote": true,
|
|
5
|
+
"printWidth": 150,
|
|
6
|
+
"tabWidth": 2,
|
|
7
|
+
"useTabs": false,
|
|
8
|
+
"arrowParens": "always",
|
|
9
|
+
"endOfLine": "lf",
|
|
10
|
+
"bracketSpacing": true,
|
|
11
|
+
"bracketSameLine": false,
|
|
12
|
+
"quoteProps": "as-needed"
|
|
13
|
+
}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
# Frontend Project
|
|
2
|
+
|
|
3
|
+
Frontend amb JavaScript i Vite.
|
|
4
|
+
|
|
5
|
+
## Requisits
|
|
6
|
+
|
|
7
|
+
- Node.js >= 18
|
|
8
|
+
- npm o yarn
|
|
9
|
+
|
|
10
|
+
## Instal·lació
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
npm install
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
## Scripts disponibles
|
|
17
|
+
|
|
18
|
+
- `npm run dev` - Inicia el servidor de desenvolupament amb hot reload
|
|
19
|
+
- `npm run build` - Compila el projecte per producció
|
|
20
|
+
- `npm run preview` - Previsualitza la build de producció
|
|
21
|
+
- `npm run lint` - Executa el linter
|
|
22
|
+
- `npm run lint:fix` - Corregeix automàticament els errors de linting
|
|
23
|
+
- `npm run format` - Formata el codi amb Prettier
|
|
24
|
+
- `npm run format:check` - Comprova el format del codi
|
|
25
|
+
|
|
26
|
+
## Estructura del projecte
|
|
27
|
+
|
|
28
|
+
```
|
|
29
|
+
src/
|
|
30
|
+
├── main.js # Punt d'entrada de l'aplicació
|
|
31
|
+
└── style.css # Estils globals
|
|
32
|
+
index.html # HTML principal
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
## Desenvolupament
|
|
36
|
+
|
|
37
|
+
```bash
|
|
38
|
+
npm run dev
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
El servidor s'executarà a `http://localhost:5173`
|
|
42
|
+
|
|
43
|
+
## Producció
|
|
44
|
+
|
|
45
|
+
```bash
|
|
46
|
+
npm run build
|
|
47
|
+
npm run preview
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Els fitxers compilats es generaran a la carpeta `dist/`
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import eslint from '@eslint/js'
|
|
2
|
+
import prettierConfig from 'eslint-plugin-prettier/recommended'
|
|
3
|
+
import globals from 'globals'
|
|
4
|
+
|
|
5
|
+
export default [
|
|
6
|
+
{ ignores: ['dist', 'node_modules', 'coverage'] },
|
|
7
|
+
eslint.configs.recommended,
|
|
8
|
+
{
|
|
9
|
+
languageOptions: {
|
|
10
|
+
globals: {
|
|
11
|
+
...globals.browser,
|
|
12
|
+
},
|
|
13
|
+
},
|
|
14
|
+
rules: {
|
|
15
|
+
'prettier/prettier': 'error',
|
|
16
|
+
semi: ['error', 'never'],
|
|
17
|
+
'no-unused-vars': [
|
|
18
|
+
'error',
|
|
19
|
+
{
|
|
20
|
+
argsIgnorePattern: '^_',
|
|
21
|
+
varsIgnorePattern: '^_',
|
|
22
|
+
},
|
|
23
|
+
],
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
prettierConfig,
|
|
27
|
+
]
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="ca">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Frontend Project</title>
|
|
7
|
+
</head>
|
|
8
|
+
<body>
|
|
9
|
+
<div id="app"></div>
|
|
10
|
+
<script type="module" src="/src/main.js"></script>
|
|
11
|
+
</body>
|
|
12
|
+
</html>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "frontend-project",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "Frontend project with Vanilla JavaScript",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"dev": "vite",
|
|
8
|
+
"build": "vite build",
|
|
9
|
+
"preview": "vite preview",
|
|
10
|
+
"lint": "eslint src",
|
|
11
|
+
"lint:fix": "eslint src --fix",
|
|
12
|
+
"format": "prettier --write \"src/**/*.{js,css,html}\"",
|
|
13
|
+
"format:check": "prettier --check \"src/**/*.{js,css,html}\""
|
|
14
|
+
},
|
|
15
|
+
"keywords": [],
|
|
16
|
+
"author": "",
|
|
17
|
+
"license": "MIT",
|
|
18
|
+
"dependencies": {},
|
|
19
|
+
"devDependencies": {
|
|
20
|
+
"@eslint/js": "9.39.2",
|
|
21
|
+
"eslint": "9.39.2",
|
|
22
|
+
"eslint-config-prettier": "^10.1.5",
|
|
23
|
+
"eslint-plugin-prettier": "^5.0.1",
|
|
24
|
+
"globals": "^16.1.0",
|
|
25
|
+
"prettier": "3.8.1",
|
|
26
|
+
"vite": "^5.0.8"
|
|
27
|
+
}
|
|
28
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import './style.css'
|
|
2
|
+
|
|
3
|
+
const app = document.querySelector('#app')
|
|
4
|
+
|
|
5
|
+
if (app) {
|
|
6
|
+
app.innerHTML = `
|
|
7
|
+
<div class="container">
|
|
8
|
+
<h1>Frontend Project</h1>
|
|
9
|
+
<p>Projecte creat amb JavaScript i Vite</p>
|
|
10
|
+
<p class="info">Edita <code>src/main.js</code> per començar</p>
|
|
11
|
+
</div>
|
|
12
|
+
`
|
|
13
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
* {
|
|
2
|
+
margin: 0;
|
|
3
|
+
padding: 0;
|
|
4
|
+
box-sizing: border-box;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
body {
|
|
8
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
|
|
9
|
+
'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
|
|
10
|
+
-webkit-font-smoothing: antialiased;
|
|
11
|
+
-moz-osx-font-smoothing: grayscale;
|
|
12
|
+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
13
|
+
min-height: 100vh;
|
|
14
|
+
display: flex;
|
|
15
|
+
align-items: center;
|
|
16
|
+
justify-content: center;
|
|
17
|
+
color: #333;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.container {
|
|
21
|
+
background: white;
|
|
22
|
+
padding: 3rem;
|
|
23
|
+
border-radius: 1rem;
|
|
24
|
+
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
|
25
|
+
text-align: center;
|
|
26
|
+
max-width: 600px;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
h1 {
|
|
30
|
+
font-size: 2.5rem;
|
|
31
|
+
margin-bottom: 1rem;
|
|
32
|
+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
33
|
+
-webkit-background-clip: text;
|
|
34
|
+
-webkit-text-fill-color: transparent;
|
|
35
|
+
background-clip: text;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
p {
|
|
39
|
+
font-size: 1.1rem;
|
|
40
|
+
color: #666;
|
|
41
|
+
margin-bottom: 0.5rem;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.info {
|
|
45
|
+
margin-top: 2rem;
|
|
46
|
+
font-size: 0.95rem;
|
|
47
|
+
color: #999;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
code {
|
|
51
|
+
background: #f4f4f4;
|
|
52
|
+
padding: 0.2rem 0.5rem;
|
|
53
|
+
border-radius: 0.3rem;
|
|
54
|
+
font-family: 'Courier New', monospace;
|
|
55
|
+
color: #667eea;
|
|
56
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
# EditorConfig: https://editorconfig.org
|
|
2
|
+
|
|
3
|
+
root = true
|
|
4
|
+
|
|
5
|
+
[*]
|
|
6
|
+
charset = utf-8
|
|
7
|
+
end_of_line = lf
|
|
8
|
+
indent_style = space
|
|
9
|
+
indent_size = 2
|
|
10
|
+
insert_final_newline = true
|
|
11
|
+
trim_trailing_whitespace = true
|
|
12
|
+
max_line_length = 150
|
|
13
|
+
|
|
14
|
+
[*.md]
|
|
15
|
+
trim_trailing_whitespace = false
|
|
16
|
+
|
|
17
|
+
[*.json]
|
|
18
|
+
indent_size = 2
|
|
19
|
+
|
|
20
|
+
[*.{js,ts,jsx,tsx}]
|
|
21
|
+
indent_size = 2
|
|
22
|
+
|
|
23
|
+
[*.{css,scss,sass,less}]
|
|
24
|
+
indent_size = 2
|
|
25
|
+
|
|
26
|
+
[*.html]
|
|
27
|
+
indent_size = 2
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
# Dependencies
|
|
2
|
+
node_modules
|
|
3
|
+
|
|
4
|
+
# Build output
|
|
5
|
+
dist
|
|
6
|
+
build
|
|
7
|
+
coverage
|
|
8
|
+
|
|
9
|
+
# Lock files
|
|
10
|
+
package-lock.json
|
|
11
|
+
yarn.lock
|
|
12
|
+
pnpm-lock.yaml
|
|
13
|
+
|
|
14
|
+
# Logs
|
|
15
|
+
*.log
|
|
16
|
+
|
|
17
|
+
# Environment
|
|
18
|
+
.env
|
|
19
|
+
.env.*
|
|
20
|
+
|
|
21
|
+
# Cache
|
|
22
|
+
.cache
|
|
23
|
+
.eslintcache
|
|
24
|
+
.prettierrc.cache
|
|
25
|
+
|
|
26
|
+
# OS
|
|
27
|
+
.DS_Store
|
|
28
|
+
Thumbs.db
|
|
29
|
+
|
|
30
|
+
# Vite
|
|
31
|
+
.vite
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
{
|
|
2
|
+
"semi": false,
|
|
3
|
+
"trailingComma": "es5",
|
|
4
|
+
"singleQuote": true,
|
|
5
|
+
"printWidth": 150,
|
|
6
|
+
"tabWidth": 4,
|
|
7
|
+
"useTabs": false,
|
|
8
|
+
"arrowParens": "always",
|
|
9
|
+
"endOfLine": "lf",
|
|
10
|
+
"bracketSpacing": true,
|
|
11
|
+
"bracketSameLine": false,
|
|
12
|
+
"quoteProps": "as-needed"
|
|
13
|
+
}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
# Frontend Project
|
|
2
|
+
|
|
3
|
+
Frontend amb JavaScript i Vite.
|
|
4
|
+
|
|
5
|
+
## Requisits
|
|
6
|
+
|
|
7
|
+
- Node.js >= 18
|
|
8
|
+
- npm o yarn
|
|
9
|
+
|
|
10
|
+
## Instal·lació
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
npm install
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
## Scripts disponibles
|
|
17
|
+
|
|
18
|
+
- `npm run dev` - Inicia el servidor de desenvolupament amb hot reload
|
|
19
|
+
- `npm run build` - Compila el projecte per producció
|
|
20
|
+
- `npm run preview` - Previsualitza la build de producció
|
|
21
|
+
- `npm run lint` - Executa el linter
|
|
22
|
+
- `npm run lint:fix` - Corregeix automàticament els errors de linting
|
|
23
|
+
- `npm run format` - Formata el codi amb Prettier
|
|
24
|
+
- `npm run format:check` - Comprova el format del codi
|
|
25
|
+
|
|
26
|
+
## Estructura del projecte
|
|
27
|
+
|
|
28
|
+
```
|
|
29
|
+
src/
|
|
30
|
+
├── main.js # Punt d'entrada de l'aplicació
|
|
31
|
+
└── style.css # Estils globals
|
|
32
|
+
index.html # HTML principal
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
## Desenvolupament
|
|
36
|
+
|
|
37
|
+
```bash
|
|
38
|
+
npm run dev
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
El servidor s'executarà a `http://localhost:5173`
|
|
42
|
+
|
|
43
|
+
## Producció
|
|
44
|
+
|
|
45
|
+
```bash
|
|
46
|
+
npm run build
|
|
47
|
+
npm run preview
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Els fitxers compilats es generaran a la carpeta `dist/`
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import eslint from '@eslint/js'
|
|
2
|
+
import prettierConfig from 'eslint-plugin-prettier/recommended'
|
|
3
|
+
import globals from 'globals'
|
|
4
|
+
|
|
5
|
+
export default [
|
|
6
|
+
{ ignores: ['dist', 'node_modules', 'coverage'] },
|
|
7
|
+
eslint.configs.recommended,
|
|
8
|
+
{
|
|
9
|
+
languageOptions: {
|
|
10
|
+
globals: {
|
|
11
|
+
...globals.browser,
|
|
12
|
+
},
|
|
13
|
+
},
|
|
14
|
+
rules: {
|
|
15
|
+
'prettier/prettier': 'error',
|
|
16
|
+
semi: ['error', 'never'],
|
|
17
|
+
'no-unused-vars': [
|
|
18
|
+
'error',
|
|
19
|
+
{
|
|
20
|
+
argsIgnorePattern: '^_',
|
|
21
|
+
varsIgnorePattern: '^_',
|
|
22
|
+
},
|
|
23
|
+
],
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
prettierConfig,
|
|
27
|
+
]
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="ca">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>Frontend Project</title>
|
|
7
|
+
</head>
|
|
8
|
+
<body>
|
|
9
|
+
<div id="app"></div>
|
|
10
|
+
<script type="module" src="/src/main.js"></script>
|
|
11
|
+
</body>
|
|
12
|
+
</html>
|