https://github.com/fabiencrassat/cv-with-nuxt
The source code of my personal curriculum vitae site
https://github.com/fabiencrassat/cv-with-nuxt
curriculum curriculum-vitae cv nuxt nuxt-i18n nuxtjs
Last synced: about 1 month ago
JSON representation
The source code of my personal curriculum vitae site
- Host: GitHub
- URL: https://github.com/fabiencrassat/cv-with-nuxt
- Owner: fabiencrassat
- License: mit
- Created: 2020-04-27T15:31:24.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2024-10-21T06:07:52.000Z (7 months ago)
- Last Synced: 2024-10-21T12:41:29.817Z (7 months ago)
- Topics: curriculum, curriculum-vitae, cv, nuxt, nuxt-i18n, nuxtjs
- Language: Vue
- Homepage: http://cv.crassat.com
- Size: 35.1 MB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# fabiencrassat / My Curriculum Vitae with Nuxt
[](https://app.renovatebot.com/dashboard#github/fabiencrassat/cv-with-nuxt)
[](https://github.com/fabiencrassat/cv-with-nuxt/actions?query=workflow%3APipeline)
[](https://sonarcloud.io/dashboard?id=cv-with-nuxt)
[](https://sonarcloud.io/dashboard?id=cv-with-nuxt)
Welcome to the fabiencrassat's Curriculum Vitae source code - a development with the [NuxtJs][1] framework.
[1]: https://nuxtjs.org/
- [Prerequisites](#prerequisites)
- [Installation](#installation)
- [Structure](#structure)
- [Start like production](#start-like-production)
- [Before commit](#before-commit)
- [GitHub Workflow](#github-workflow)
- [Code Analysis](#code-analysis)
- [HTML validator](#html-validator)
- [SonarQube](#sonarqube)
- [SonarQube Installation \[Local Only\]](#sonarqube-installation-local-only)
- [SonarQube Usage \[Local Only\]](#sonarqube-usage-local-only)
- [Google Chrome Lighthouse](#google-chrome-lighthouse)
- [Lighthouse Server \[Local Only\]](#lighthouse-server-local-only)
- [Lighthouse Usage \[Local Only\]](#lighthouse-usage-local-only)
- [SVG images](#svg-images)
- [License](#license)
## Prerequisites
- [GIT](https://git-scm.com/)
- [NodeJS and NPM](https://nodejs.org/) Version 20
Or
- [GIT](https://git-scm.com/)
- [Podman](https://podman.io/)
## Installation
Clone the repository
```bash
git clone https://github.com/fabiencrassat/cv-with-nuxt.git
```
Then install the packages
```bash
cd cv-with-nuxt
yarn install --frozen-lockfile
# Or with Podman
podman run --interactive --name cv-with-nuxt-dev -p 3000:3000 --rm --tty --entrypoint /bin/sh --volume "$(pwd):/app" docker.io/node:20.16.0-alpine3.20
# After existing the container, the ports 8000 & 9000 are still in used "sudo netstat -tulpn" and need to be killed "kill -9 PID"
cd app
yarn install --frozen-lockfile
```
Run it!
```bash
# Start the development server on http://localhost:3000
yarn dev
```
Go to
## Structure
The product source code is structured with:
```text
.
├── config # Built and runtime configuration.
├── i18n # Nuxt i18n json files for translations.
├── lib # All codes used into the application but that **do not use nuxt and vue**.
├── scripts # All files called in the `package.json` script section.
└── src
├── assets # All static files that need to be served without i18n.
├── components # All codes imported in the `src/pages/` files, **using nuxt and vue**.
├── pages # All the application pages called with URL, served with **nuxt** and **i18n**.
├── public # All public files that can be link from the root website.
└── resources # All resources to build the curriculum vitae.
```
## Start like production
This site is a static website. So to replicate what is deployed on the website there are some things to do first.
```shell
# Build the application for production
yarn build:node_server
# Locally preview production build
yarn preview
```
And open the page:
## Before commit
### GitHub Workflow
To ensure the GitHub CI CD pipeline will stay green, launch the following command before committing and have no error.
```shell
yarn lint & yarn test:coverage
```
## Code Analysis
### HTML validator
```bash
yarn generate
yarn validate:html
```
### SonarQube
#### SonarQube Installation [Local Only]
If you want to know about your code analysis, you can use SonarQube for that. To do so:
Source:
#### SonarQube Usage [Local Only]
> Do the [SonarQube Installation](#sonarqube-installation-local-only) before starting any developments in order to know how it will change the metrics.
Each time you want to know about your quality code, launch a scan with the following
command in the root folder! And you will have your evolution ;)
```bash
# Start the server if needed
\StartSonar.bat
# Create coverage reports
yarn test:coverage
# Launch the scan
\sonar-scanner.bat;
```
### Google Chrome Lighthouse
#### Lighthouse Server [Local Only]
If you want to know about your code audit, you can use Google Chrome Lighthouse for that. To do so, use the docker image already published:
Source:
> The docker command is wrong for Windows, use instead:
>
> ```shell
> docker container run --publish 9001:9001 --mount source=lhci-data,target=/data --detach patrickhulce/lhci-server
> ```
It will create a container server you can access at .
Then initialize the project inside the server:
```shell
yarn lhci wizard
? Which wizard do you want to run? new-project
? What is the URL of your LHCI server? http://localhost:9001/
? What would you like to name the project? cv-with-nuxt
? Where is the project's code hosted? https://github.com/fabiencrassat/cv-with-nuxt
? What branch is considered the repo's trunk or main branch? master
Created project cv-with-nuxt (9461df84-ee42-4868-9061-62a8391c7fec)!
Use token xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx to add data.
Use admin token xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx to manage data. KEEP THIS SECRET!
```
Use the **LHCI server URL** and the **token xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx** in your `.env` file.
```properties
LHCI_SERVER_BASE_URL=http://localhost:9001
LHCI_TOKEN=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx
```
#### Lighthouse Usage [Local Only]
> Do the [Lighthouse Usage](#lighthouse-usage-local-only) before starting any developments in order to know how it will change the metrics.
Each time you want to know about your audit code, launch an audit with the following command in the root folder! And you will have your evolution ;)
> if needed, configure your `CHROME_PATH` in your `.env` file.
```shell
yarn generate
yarn start:static
```
And in another shell:
```shell
yarn validate:lighthouse
```
## SVG images
The SVG images library comes from
## License
MIT