Skip to content

yasxEd/Angularapp

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 

Repository files navigation

Compte rendu

1- Création d'un nouveau projet Angular nommé "Angularapp" en utilisant Angular CLI.
2- Affichage de la page de démarrage de l'application Angular.
1
3- Création d'un composant Angular appelé AppComponent avec un sélecteur app-root et un titre "enset123".
1
4- Affichage d'un titre de niveau 1 "Hello" suivi du contenu de la variable title du composant Angular.
1
5- Affichage du message Hello enset 123 dans l'application Angular.
1
6- Installation des packages Bootstrap et Bootstrap Icons dans le projet Node.js.
1
7- Affichage d'une barre de navigation horizontale avec trois boutons stylisés comme des onglets : "Home", "Products", et "New Products".
1
8- Affichage d'une barre de navigation horizontale avec trois boutons : un pour "Home", un pour "Products" et un pour "New Products". Les boutons sont stylisés pour avoir une bordure et un texte de couleur primaire, et ils ont une marge à gauche de 2 unités pour les espacer légèrement.
1
9- Illustration d'une barre de navigation horizontale Bootstrap avec des onglets. Chaque onglet comporte du texte et une icône de la bibliothèque d'icônes Bootstrap Icons, fournissant une indication visuelle du contenu ou de l'action associée.
1
10- Affichage d'une barre de navigation horizontale avec trois onglets : "Home" avec une icône de maison, "Products" avec une icône de flèche indiquant la direction, et "New Products" avec une icône de cercle plus indiquant l'ajout de nouveaux produits.
1
11- Utilisation des ces trois commandes avec Angular CLI (Command Line Interface) pour générer trois nouveaux composants Angular : "home", "products" et "new-product".
1
12- Affichage de la page "home" avec un message home works!.
1
13- Affichage de la page "home" avec la création d'une carte avec le titre "Home composent" à l'intérieur stylisée avec Bootstrap.
1
14- Affichage de la page "products" avec la création d'un tableau avec des en-têtes tels que : Name, Price et cheked qui est une case à cocher pour indiquer s'il est vérifié.
1
15- Installation localement du module npm "json-server" qui permet de créer facilement une API RESTful à partir d'un fichier JSON pour le développement et le test d'applications frontend.
1
16- Démarrage du serveur JSON en utilisant le fichier "db.json" comme base de données, écoutant les requêtes sur le port 8089.
1
17- Affichage de la liste des trois produits avec leurs informations tels que : (ID, NAME, PRICE et CHECKED).
1
18- Affichage de la page "products/2" qui contient id, name, price et checked.
1
19- Affichage de la page "products" qui contient Names, Price et checked des trois produits différents.
1
20- Génèration d'un service nommé "product" dans le répertoire "services".
1
21- Suppression du dernier produit et affichage d'un message pour sa confirmation.
1
22- Affichage d'un formulaire de saisie de produits avec les champs suivants : "Name" pour le nom du produit, "Price" pour son prix, et "Checked" avec une case à cocher pour indiquer s'il est vérifié. Un bouton "Save" sera également présent pour soumettre le formulaire.
1
23- Ajout du nouveau produit en saisissant le nom du produit, le prix et la case qui est cocher avec un bouton "Save".
1
24- Affichage d'un message pour la confirmation de l'ajout du nouveau produit.
1
25- Affichage de la page "products" qui contient le nom du produit, le prix, la case à cocher pour indiquer s'il est vérifié et un bouton de supprssion pour supprimer le produit correspondant.
1
26- Affichage de la page "products" qui contient le nom du produit, le prix, la case à cocher pour indiquer s'il est vérifié, un bouton de suppression pour supprimer le produit correspondant et un bouton de modification avec le chiffrement de la page.
1
27- Génèration d'un composant Angular appelé "edit-product", en créant automatiquement les fichiers nécessaires pour le composant dans la structure de votre projet Angular.
1
28- Modification du nouveau produit en saisissant les informations suivantes tels que : (Name, Price et la case à cocher) avec un bouton "Save" pour sauvegarger la modification.
1

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published