nicolas.marsal
4 years ago
24 changed files with 7561 additions and 0 deletions
@ -0,0 +1,12 @@ |
|||||||
|
/* eslint-env node */ |
||||||
|
require("@rushstack/eslint-patch/modern-module-resolution"); |
||||||
|
|
||||||
|
module.exports = { |
||||||
|
root: true, |
||||||
|
extends: [ |
||||||
|
"plugin:vue/vue3-essential", |
||||||
|
"eslint:recommended", |
||||||
|
"@vue/eslint-config-typescript/recommended", |
||||||
|
"@vue/eslint-config-prettier", |
||||||
|
], |
||||||
|
}; |
||||||
@ -0,0 +1,28 @@ |
|||||||
|
# Logs |
||||||
|
logs |
||||||
|
*.log |
||||||
|
npm-debug.log* |
||||||
|
yarn-debug.log* |
||||||
|
yarn-error.log* |
||||||
|
pnpm-debug.log* |
||||||
|
lerna-debug.log* |
||||||
|
|
||||||
|
node_modules |
||||||
|
.DS_Store |
||||||
|
dist |
||||||
|
dist-ssr |
||||||
|
coverage |
||||||
|
*.local |
||||||
|
|
||||||
|
/cypress/videos/ |
||||||
|
/cypress/screenshots/ |
||||||
|
|
||||||
|
# Editor directories and files |
||||||
|
.vscode/* |
||||||
|
!.vscode/extensions.json |
||||||
|
.idea |
||||||
|
*.suo |
||||||
|
*.ntvs* |
||||||
|
*.njsproj |
||||||
|
*.sln |
||||||
|
*.sw? |
||||||
@ -0,0 +1,46 @@ |
|||||||
|
# Nicolas Marsal's CV |
||||||
|
|
||||||
|
This template should help get you started developing with Vue 3 in Vite. |
||||||
|
|
||||||
|
## Recommended IDE Setup |
||||||
|
|
||||||
|
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin). |
||||||
|
|
||||||
|
## Type Support for `.vue` Imports in TS |
||||||
|
|
||||||
|
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types. |
||||||
|
|
||||||
|
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps: |
||||||
|
|
||||||
|
1. Disable the built-in TypeScript Extension |
||||||
|
1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette |
||||||
|
2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)` |
||||||
|
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette. |
||||||
|
|
||||||
|
## Customize configuration |
||||||
|
|
||||||
|
See [Vite Configuration Reference](https://vitejs.dev/config/). |
||||||
|
|
||||||
|
## Project Setup |
||||||
|
|
||||||
|
```sh |
||||||
|
npm install |
||||||
|
``` |
||||||
|
|
||||||
|
### Compile and Hot-Reload for Development |
||||||
|
|
||||||
|
```sh |
||||||
|
npm run dev |
||||||
|
``` |
||||||
|
|
||||||
|
### Type-Check, Compile and Minify for Production |
||||||
|
|
||||||
|
```sh |
||||||
|
npm run build |
||||||
|
``` |
||||||
|
|
||||||
|
### Lint with [ESLint](https://eslint.org/) |
||||||
|
|
||||||
|
```sh |
||||||
|
npm run lint |
||||||
|
``` |
||||||
@ -0,0 +1,13 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en"> |
||||||
|
<head> |
||||||
|
<meta charset="UTF-8" /> |
||||||
|
<link rel="icon" href="/favicon.ico" /> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
||||||
|
<title>Vite App</title> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<div id="app"></div> |
||||||
|
<script type="module" src="/src/main.ts"></script> |
||||||
|
</body> |
||||||
|
</html> |
||||||
@ -0,0 +1,32 @@ |
|||||||
|
{ |
||||||
|
"name": "marsal.cv", |
||||||
|
"version": "0.0.0", |
||||||
|
"scripts": { |
||||||
|
"dev": "vite", |
||||||
|
"build": "run-p type-check build-only", |
||||||
|
"preview": "vite preview --port 4173", |
||||||
|
"build-only": "vite build", |
||||||
|
"type-check": "vue-tsc --noEmit", |
||||||
|
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore" |
||||||
|
}, |
||||||
|
"dependencies": { |
||||||
|
"pinia": "^2.0.14", |
||||||
|
"vue": "^3.2.37" |
||||||
|
}, |
||||||
|
"devDependencies": { |
||||||
|
"@rushstack/eslint-patch": "^1.1.0", |
||||||
|
"@types/node": "^16.11.43", |
||||||
|
"@vitejs/plugin-vue": "^2.3.3", |
||||||
|
"@vitejs/plugin-vue-jsx": "^1.3.10", |
||||||
|
"@vue/eslint-config-prettier": "^7.0.0", |
||||||
|
"@vue/eslint-config-typescript": "^11.0.0", |
||||||
|
"@vue/tsconfig": "^0.1.3", |
||||||
|
"eslint": "^8.5.0", |
||||||
|
"eslint-plugin-vue": "^9.0.0", |
||||||
|
"npm-run-all": "^4.1.5", |
||||||
|
"prettier": "^2.5.1", |
||||||
|
"typescript": "~4.7.4", |
||||||
|
"vite": "^2.9.14", |
||||||
|
"vue-tsc": "^0.38.4" |
||||||
|
} |
||||||
|
} |
||||||
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,51 @@ |
|||||||
|
<script setup lang="ts"> |
||||||
|
import FirstNameAndLastName from "@/components/informations/FirstNameAndLastName.vue"; |
||||||
|
import MyInformations from "@/components/informations/MyInformations.vue"; |
||||||
|
import MyEducation from "@/components/education/MyEducation.vue"; |
||||||
|
import MyLanguages from "@/components/informations/MyLanguages.vue"; |
||||||
|
import MyHobbies from "@/components/informations/MyHobbies.vue"; |
||||||
|
import MySkills from "@/components/skills/MySkills.vue"; |
||||||
|
import MyExperiences from "@/components/experiences/MyExperiences.vue"; |
||||||
|
</script> |
||||||
|
|
||||||
|
<template> |
||||||
|
<div class="main"> |
||||||
|
<div class="left"> |
||||||
|
<FirstNameAndLastName /> |
||||||
|
<MyInformations /> |
||||||
|
<MyEducation /> |
||||||
|
<MyLanguages /> |
||||||
|
<MyHobbies /> |
||||||
|
</div> |
||||||
|
<div class="right"> |
||||||
|
<MySkills /> |
||||||
|
<MyExperiences /> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
.main { |
||||||
|
display: flex; |
||||||
|
flex-direction: row; |
||||||
|
width: 1024px; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
|
||||||
|
.left { |
||||||
|
margin: 8px; |
||||||
|
flex-grow: 0.3; |
||||||
|
flex-shrink: 0; |
||||||
|
border-right: 1px solid gray; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
|
||||||
|
.right { |
||||||
|
flex-grow: 0.7; |
||||||
|
flex-shrink: 0; |
||||||
|
margin: 8px; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,5 @@ |
|||||||
|
#app { |
||||||
|
display: flex; |
||||||
|
flex-direction: row; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
@ -0,0 +1,32 @@ |
|||||||
|
<script setup lang="ts"> |
||||||
|
defineProps<{ |
||||||
|
title: string; |
||||||
|
}>(); |
||||||
|
</script> |
||||||
|
|
||||||
|
<template> |
||||||
|
<div class="wrapper"> |
||||||
|
<div class="title"> |
||||||
|
{{ title }} |
||||||
|
</div> |
||||||
|
<div class="body"> |
||||||
|
<slot></slot> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
|
||||||
|
<style scoped> |
||||||
|
.wrapper{ |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
.title { |
||||||
|
font-size: 18px; |
||||||
|
font-weight: bolder; |
||||||
|
font-variant: titling-caps; |
||||||
|
} |
||||||
|
.body { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,15 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
My Education |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "MyEducation" |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,22 @@ |
|||||||
|
<script setup lang="ts"> |
||||||
|
import RightSection from "@/components/common/RightSection.vue"; |
||||||
|
</script> |
||||||
|
|
||||||
|
<template> |
||||||
|
<RightSection title="Experiences"> |
||||||
|
{{ message }} |
||||||
|
</RightSection> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script lang="ts"> |
||||||
|
export default { |
||||||
|
name: "MyExperiences", |
||||||
|
data: () => { |
||||||
|
return { |
||||||
|
message: "Here are my experiences", |
||||||
|
}; |
||||||
|
}, |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped></style> |
||||||
@ -0,0 +1,18 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
{{ firstName }} {{ lastName }} ! |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
firstName: "Nicolas", |
||||||
|
lastName: "Marsal", |
||||||
|
}; |
||||||
|
}, |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped></style> |
||||||
@ -0,0 +1,15 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
My Hobbies |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "MyHobbies" |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,15 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
My Informations |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "MyInformations" |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,15 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
My Languages |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "MyLanguages" |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,15 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
Words Cloud ! |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "WordsCloud" |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,20 @@ |
|||||||
|
<script setup lang="ts"> |
||||||
|
import RightSection from "@/components/common/RightSection.vue"; |
||||||
|
</script> |
||||||
|
|
||||||
|
<template> |
||||||
|
<RightSection title="Skills"> |
||||||
|
Here are my skills |
||||||
|
</RightSection> |
||||||
|
</template> |
||||||
|
|
||||||
|
|
||||||
|
<script lang="ts"> |
||||||
|
export default { |
||||||
|
name: "MySkills" |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,11 @@ |
|||||||
|
import { createApp } from "vue"; |
||||||
|
import { createPinia } from "pinia"; |
||||||
|
import App from "./App.vue"; |
||||||
|
|
||||||
|
import "./assets/main.css"; |
||||||
|
|
||||||
|
const app = createApp(App); |
||||||
|
|
||||||
|
app.use(createPinia()); |
||||||
|
|
||||||
|
app.mount("#app"); |
||||||
@ -0,0 +1,16 @@ |
|||||||
|
import { defineStore } from "pinia"; |
||||||
|
|
||||||
|
export const useCounterStore = defineStore({ |
||||||
|
id: "counter", |
||||||
|
state: () => ({ |
||||||
|
counter: 0, |
||||||
|
}), |
||||||
|
getters: { |
||||||
|
doubleCount: (state) => state.counter * 2, |
||||||
|
}, |
||||||
|
actions: { |
||||||
|
increment() { |
||||||
|
this.counter++; |
||||||
|
}, |
||||||
|
}, |
||||||
|
}); |
||||||
@ -0,0 +1,8 @@ |
|||||||
|
{ |
||||||
|
"extends": "@vue/tsconfig/tsconfig.node.json", |
||||||
|
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*"], |
||||||
|
"compilerOptions": { |
||||||
|
"composite": true, |
||||||
|
"types": ["node"] |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,16 @@ |
|||||||
|
{ |
||||||
|
"extends": "@vue/tsconfig/tsconfig.web.json", |
||||||
|
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"], |
||||||
|
"compilerOptions": { |
||||||
|
"baseUrl": ".", |
||||||
|
"paths": { |
||||||
|
"@/*": ["./src/*"] |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
"references": [ |
||||||
|
{ |
||||||
|
"path": "./tsconfig.config.json" |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
@ -0,0 +1,15 @@ |
|||||||
|
import { fileURLToPath, URL } from "url"; |
||||||
|
|
||||||
|
import { defineConfig } from "vite"; |
||||||
|
import vue from "@vitejs/plugin-vue"; |
||||||
|
import vueJsx from "@vitejs/plugin-vue-jsx"; |
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({ |
||||||
|
plugins: [vue(), vueJsx()], |
||||||
|
resolve: { |
||||||
|
alias: { |
||||||
|
"@": fileURLToPath(new URL("./src", import.meta.url)), |
||||||
|
}, |
||||||
|
}, |
||||||
|
}); |
||||||
Loading…
Reference in new issue