Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/charlenry/charleshenrisaintmars_9_18082022

Projet Billed - Il s'agit de la partie front-end d'une application permettant de gérer des notes de frais des employés.
https://github.com/charlenry/charleshenrisaintmars_9_18082022

api-sqlite bdd bootstrap4 chrome-debugger end-to-end-testing integration-testing jasmine jest tdd unit-testing

Last synced: 1 day ago
JSON representation

Projet Billed - Il s'agit de la partie front-end d'une application permettant de gérer des notes de frais des employés.

Awesome Lists containing this project

README

        

## Le projet Billed
Dans le contexte, Billed est une entreprise qui produit des solutions Saas destinées aux équipes de ressources humaines. Dans ce projet, il s'agit de la partie frontend d'une application permettant de `gérer des notes de frais`. D'une part, il y a une interface pour les employés qui leur permet d'avoir un historique de leurs notes de frais, et de créer de nouvelles notes de frais. D'autre part, il y a une interface pour les administrateurs qui leur permet de valider ou de refuser ou de mettre en attente les notes de frais des employés.

Je dois fiabiliser la partie frontend par la correction de bugs et la réalisation de tests unitaires, de tests d'intégration et de tests End-to-End manuels. Je dois aussi élaborer le plan des tests manuels End-to-End. La partie backend est fournie sur Github avec les instructions d'installation.

## L'architecture du projet
La partie frontend est connectée à un service API backend que vous devez aussi lancer en local.

Le projet backend se trouve ici: https://github.com/charlenry/Billed-app-FR-Back

Pour lancer le backend, ouvrir une invite de commande dans le dossier du backend et taper : `npm install` puis `npm run run:dev`. L'API est accessible sur le port 5678 en local, c'est à dire `http://localhost:5678`. Si vous êtes sous Windows et qu'il y a le message d'erreur `"NODE_ENV is not recognized as an internal or external command"`, veuillez lancer la commande `npm install -g win-node-env`. Puis relancer `npm run run:dev`.

## Organiser l'installation de l'application
Pour une bonne organisation, vous pouvez **créer un dossier Billed-app** dans lequel vous allez cloner la partie backend et par la suite, la partie frontend:

Clonez le projet backend dans le dossier Billed-app :
```
$ git clone https://github.com/charlenry/Billed-app-FR-Back.git
```

```
Billed-app/
- Billed-app-FR-Back
```

Clonez le projet frontend dans le dossier Billed-app :
```
$ git clone https://github.com/charlenry/CharlesHenriSaintMars_9_18082022.git
```

```
Billed-app/
- Billed-app-FR-Back
- CharlesHenriSaintMars_9_18082022
```
Renommez le dossier `CharlesHenriSaintMars_9_18082022` en `Billed-app-FR-Front`.
Une version plus récente du backend se trouve dans le dossier `Back-End` du frontend. Vous pouvez décompresser le fichier `Billed-app-FR-Back.7z` qui s'y trouve. Puis remplacez le dossier `Billed-app-FR-Back` par le dossier décompressé.

En fin de compte, vous devriez avoir la structure de dossiers suivante :
```
Billed-app/
- Billed-app-FR-Back
- Billed-app-FR-Front
```

## Comment lancer l'application en local ?

### étape 1 - Lancer le backend

Suivez les indications dans le README du projet backend et/ou aller à la section **L'architecture du projet** ci-dessus.

### étape 2 - Lancer le frontend

Allez au repo cloné :
```
$ cd Billed-app-FR-Front
```

Installez les packages npm (décrits dans `package.json`) :
```
$ npm install
```

Installez live-server pour lancer un serveur local :
```
$ npm install -g live-server
```

Lancez l'application :
```
$ live-server
```

Puis allez à l'adresse : `http://127.0.0.1:8080/`

## Comment lancer tous les tests en local avec Jest ?

```
$ npm run test
```

## Comment lancer un seul test ?

Installez jest-cli :

```
$npm i -g jest-cli
$jest src/__tests__/your_test_file.js
```

## Comment voir la couverture de test ?

`http://127.0.0.1:8080/coverage/lcov-report/`

## Comptes et utilisateurs

Vous pouvez vous connecter en utilisant les comptes:

### administrateur
```
utilisateur : [email protected]
mot de passe : admin
```
### employé
```
utilisateur : [email protected]
mot de passe : employee
```