---
# System prepended metadata

title: Angular Projet News API
tags: [' angular', frontend, ' javascript']

---

---
title: Angular Projet News API
tags: frontend, angular, javascript
robots: noindex, nofollow
author: Julien Noyer
---

# ANGULAR Projet News app

*One framework. Mobile & desktop*

![](https://i.imgur.com/a4Zjbvv.png)

Ce projet de fin de cursus est prévu pour valider les compétences acquises après plusieurs sessions de cours sur les notions de programmation avec [Angular](https://angular.io/). Le principe de cette application est d'utiliser l'api https://newsapi.org pour développer un système de recherche d'articlee et de gestion de sources favorite.

Pour réaliser cette application vous disposez des éléments suivants : 

- **Version Native** : https://bit.ly/3fQcAOv
- **Documentation de l'API** : https://bit.ly/2WzkjJ8
- **Documentation NEWSapiORG** : https://bit.ly/2zEDpEG
- **Design (optionnel)** : https://bit.ly/3dOoI0I

<br><br>

## Prérequis

Avant de vous lancer dans le développement de cette application il est conseiller de bien lire toutes les **"User Stories"** pour bien définir les fonctionnalités à développer et imaginer éventuellement en ajouter d'autres mais le système de notation n'est pas bassé sur la quantitté de code développé mais sur sa qualité.

Pour pouvoir utiliser l'API développé pour ce projet vous devez disposez d'un Token utilisateur généré sur newsapi.org. **Vous devez donc vous inscrire ssur le site newsapi.org**, en version gratuite, avant de commencer à développer l'application Angular.

Les techniques que vous devrez utiliser pour développer votre application ont été aborder en cours, tous le code que vous aveze déjà produit doit vous permettre de mener à bien ce nouveau projet. Pour vous aider à rafraichir votre mémoire vous avez accès au support suivant : 

- **Développer une application Angular** https://bit.ly/3fNRksB

Pour finir, le développement avec [Angular](https://angular.io/) est simplifier avec l'utilisation du [CLI](https://cli.angular.io), il vous est donc conseiller de l'installer sur votre machine : 

```
sudo npm i -g @angular/cli
```

---

<br><br><br><br>

# Présentation du projet

*Rester informé avec newsapi.org*

![](https://i.imgur.com/ozdFr89.png)

## Définition des "User Stories" de base

Les "User Stories" sont définies dans l'ordre des fonctionnalités que vous devez intégrer dans votre application. Elles vous permettent dee vous organiser dans le mise en place de votre code.

- En tant qu'utilisateur non connecté je peux sélectionner une source et afficher les 10 dernièrs articles
- En tant qu'utilisateur non connecté je peux sélectionner une source et définir un mot-clef et afficher les 10 dernièrs articles
- En tant qu'utilisateur connecté je peux ajouter des sources en favoris (une par une)
- En tant qu'utilisateur connecté je peux supprimer des favoris (un par un)
- En tant qu'utilisateur connecté je peux voir ma liste de favoris
- En tant qu'utilisateur connecté quand je clique sur un favoris je vous la liste des derniers articles de la source
- En tant qu'utilisateur non connecté ma dernière recherche s'affiche automatiquement quand j'actualise la page

---

<br><br><br><br>

# Critères dévaluation et rendu

*Principe de notation de votre rendu*

![](https://i.imgur.com/waRrKdO.png)

<br>

Un travail bien fait sera toujours valorisé face à un travail vite fait, les critères d'évaluations sont les suivants :

* __5pts :__ Bonnes pratiques (indentation, commentaire, factorisation, ...)
* __5pts :__ Gestion des composants
* __5pts :__ Gestion des services
* __5pts :__ Gestion des utilisateurs connectés/déconnectés
* __5pts (option) :__ Investissement

Votre investissement dans le projet est une variable d'ajustement de votre note globale, c'est à dire que ces 5 points seront ajouter à votre note mais que la note finale ne peut dépasser 20/20.

<br>

Pour la **livraison de votre rendu** il vous est demandé de fournir un lien vers un répertoire GitHub/GitLab en remplissant le formulaire suivant : 

- https://forms.gle/qwWkxws5yqnJbPe38