Skip to content
Snippets Groups Projects
Commit cc6792e7 authored by Thibaut DE SAIVRE's avatar Thibaut DE SAIVRE
Browse files

everything until vscode settings

parent c2ae41c8
No related branches found
No related tags found
No related merge requests found
{
"recommendations": [
"dbaeumer.vscode-eslint", // LINTER : ESLint
"esbenp.prettier-vscode", // FORMATTER : prettier
"ecmel.vscode-html-css", // HTML / CSS language support
"sidthesloth.html5-boilerplate", // Boilerplate HTML5 template
"ritwickdey.LiveServer" // View HTML files directly in your browser with hot reload
]
}
{
// Generic settings :
"editor.formatOnSave": true, // Format files on save
"formatFiles.runOrganizeImports": true, // Sort imports when formatting
"editor.codeActionsOnSave": {
// Organize imports on save
"source.organizeImports": true
},
// Web dev
"javascript.updateImportsOnFileMove.enabled": "always", // Automatically update imports when moving a file
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
}
# Template Typescript Project
TODO : package manager, comment initialiser des projets (et ensuite juste copier la config eslint ou prettier, etc...)
[![Node.js Version](https://img.shields.io/badge/Node.js-20-brightgreen.svg)](https://nodejs.org/)
[![ESLint](https://img.shields.io/badge/Linter-ESLint-blue.svg)](https://eslint.org/)
[![Formatter-Prettier](https://img.shields.io/badge/Formatter-Prettier-yellow.svg)](https://prettier.io/)
npm, node, les autres commandes... Rmq : les deps eslint ?
## Node environment
[![Python Version](https://img.shields.io/badge/python-3.11-blue.svg)](https://www.python.org/downloads/release/python-311/)
[![Black](https://img.shields.io/badge/code%20style-black-000000.svg)](https://github.com/psf/black)
[![Ruff](https://img.shields.io/badge/linter-ruff-1a53f0.svg)](https://beta.ruff.rs/docs/)
Javascript code can run in 2 environments :
- Inside a web browser
- Using Node js
When developping websites or backend applications, we use Node js. You can download Node js on their [official website](https://nodejs.org/en).
### Package Manager
Node js dependencies are managed using a package manager (npm, yarn, pnpm...). The default package manager is `npm`.
It comes bundled with Node js.
### Why use (or not) typescript ?
TypeScript is a strongly typed superset of JavaScript. It is recommended to ALWAYS use TypeScript for medium to large projects, especially if multiple developers will be working on it.
However, for small html-css websites, using small JavaScript files may be the better option.
### How to initialize projects
This repo contains an example setup for a node js application. However, if you want to create a website or a node js application using specific frameworks, you may instead initialize your project using one of the following commands :
#### Websites
```bash
npm create vite@latest my-react-website -- --template react-ts # Create a vanilla React app using Typescript
npx create-next-app@latest # Create a Next js website. Be sure to use Typescript and ESLint in the given options !
npm create svelte@latest my-app # Create a Svelte app. Be sure to use Typescript, ESLint and Prettier in the given options !
```
#### Node js applications
```bash
npm i -g @nestjs/cli && nest new my-backend-app # Create a Nest js backend application
npm init adonis-ts-app@latest my-backend-app # Create an Adonis js backend application
```
#### Final recommendations
- Be sure to set `"strict": true` in your `tsconfig.json` file, else using TypeScript will not be as useful.
- The frameworks presented in the last 2 sections are recommended (and popular enough).
## VSCode Project Settings
TODO
In order to ensure that everyone uses the same linting and formatting settings,
we duplicate the relevant settings in [`.vscode/settings.json`](.vscode/settings.json).
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment