Notes de cours
Class notes frontend
- Cours
- Établissement
good and easy (good and easy)
[Montrer plus]
Vendeur
S'abonner
medted1206
Aperçu du contenu
C12 : Développer en Front-end1-Comprendre les concepts de base du web front-end
1. Fondamentaux des sites web statiques
Un site Web statique consiste en une série de fichiers HTML, chacun représentant une page
physique d'un site Web. Sur les sites statiques, chaque page est un fichier HTML distinct. Lorsque
vous visitez la page d'accueil, vous ne visualisez que le fichier de la page d'accueil réelle.
2. Différence entre front End et back end :
Front-end:
Le front-end est construit à l'aide d'une combinaison de technologies telles que le langage
de balisage hypertexte (HTML), JavaScript et les feuilles de style en cascade (CSS).
Back-end :
Le back-end, également appelé côté serveur, se compose du serveur qui fournit les données
à la demande, de l'application qui les canalise et de la base de données qui organise les
informations.
3. Présentation des Frameworks front end :
Framework :
En gros, il s’agit d’une boîte à outils couplée à une bibliothèque pour programmeur
informatique. Il permet d’aider les programmeurs dans leur travail en leur proposant des morceaux
de code pour mettre en place des fonctionnalités couramment demandées pour des applications.
Par exemple, le multilinguisme, la gestion de la sécurité, la modularité (c’est-à-dire la possibilité
pour l’utilisateur de personnaliser son interface).
Avantages d’un Framework :
Les développeurs se concentrent uniquement sur la partie métier puisque toutes les
couches techniques sont déjà intégrées dans le Framework.
L’architecture permet la séparation des couches techniques logiques afin de faciliter le
développement en équipe, la maintenance et l’évolution.
La maintenance et l’évolution du Framework sont gérées par l’organisme fondateur.
Les Framework front-end:
React : c’est une librairie java script pour créer des interfaces utilisateur frontend, certaine
personne l’appelle Framework, en général il ne faut pas prendre la tête avec est ce que React est
une bibliothèque ou Framework, bref React c’est un utilitaire qui va nous aider à développer des
interfaces utilisateur plus rapidement et facilement.
ANGULAR : angular est une plate-forme et un Framework permettant de créer des applications
clientes single page à l'aide de HTML et de TypeScript.
VUE JS : vue est un Framework JavaScript pour la construction d'interfaces utilisateur.
4. Les aspects avancés de JavaScript :
Le développement Frontend avec React nécessite une bonne maitrise de java script ES6.
, Les classes d’objets en ES6 :
Les classes sont des modèles pour créer des objets. Ils encapsulent les données avec du code pour
travailler sur ces données.
Création d’une classe :
Class Etudiant{constructor(nom,age){ this.nom=nom; this.age=age } }
Création d’objets :
Class Etudiant{ constructor(nom,age){ this.nom=nom; this.age=age } }
let et1= new Etudiant("Rami",23)
let et2= new Etudiant("Karimi",21)
Création de méthode:
class Etudiant{ constructor(nom,age){ this.nom=nom; this.age=age }
info(){ return `Etudiant nom:${this.nom} a pour age:${this.age}` } }
Appel de la méthode:
let et1= new Etudiant("Rami",23);
console.log(et1.info());
let et2= new Etudiant("Karimi",21) ;
console.log(et2.info());
Héritage de classe :
L’héritage de classe permet de créer une nouvelle classe à partir d’une classe déjà existante.
exemple:
class Stagiaire extends Etudiant {constructor(nom,age,stage){ super(nom,age); this.stage=stage; }
Info () {return `${super.info ()} stage: ${this. Stage} `}
Modules :
Un module c’est un fichier Java Script, qui contient les mots clés export default ou export elles les
valeurs, classes, et fonctions qu’on veut exporter.
Template literals :
const salutation="salut " const nom="Rami" //avec template literal console.log(`${salutation} $
{nom}`) //est identique a
console.log (salutation+" "+nom)
L'opérateur conditionnel ternaire :
L'opérateur conditionnel (ternaire) est un opérateur JavaScript qui prend trois opérandes : une
condition suivie d'un point d'interrogation (?), puis une expression à exécuter si la condition est
vraie suivie de deux points (:), et enfin l'expression à exécuter si la condition est fausse.
exemple:
let isMember=true; let remise=isMember==true?0.2:0.1
console.log ("remise:",remise)
Object destructing :
La syntaxe d'affectation de déstructuration est une expression JavaScript qui permet de
décompresser des valeurs de tableaux, ou des propriétés d'objets, dans des variables distinctes.
Exemple :
const personne={ nom:"fatihi", age:23, adresse:{rue:14,ville:"casa"} }
const {nom,age,adresse:{rue},adresse:{ville}}=personne
console.log(nom,age,rue,ville)
Les avantages d'acheter des résumés chez Stuvia:
Qualité garantie par les avis des clients
Les clients de Stuvia ont évalués plus de 700 000 résumés. C'est comme ça que vous savez que vous achetez les meilleurs documents.
L’achat facile et rapide
Vous pouvez payer rapidement avec iDeal, carte de crédit ou Stuvia-crédit pour les résumés. Il n'y a pas d'adhésion nécessaire.
Focus sur l’essentiel
Vos camarades écrivent eux-mêmes les notes d’étude, c’est pourquoi les documents sont toujours fiables et à jour. Cela garantit que vous arrivez rapidement au coeur du matériel.
Foire aux questions
Qu'est-ce que j'obtiens en achetant ce document ?
Vous obtenez un PDF, disponible immédiatement après votre achat. Le document acheté est accessible à tout moment, n'importe où et indéfiniment via votre profil.
Garantie de remboursement : comment ça marche ?
Notre garantie de satisfaction garantit que vous trouverez toujours un document d'étude qui vous convient. Vous remplissez un formulaire et notre équipe du service client s'occupe du reste.
Auprès de qui est-ce que j'achète ce résumé ?
Stuvia est une place de marché. Alors, vous n'achetez donc pas ce document chez nous, mais auprès du vendeur medted1206. Stuvia facilite les paiements au vendeur.
Est-ce que j'aurai un abonnement?
Non, vous n'achetez ce résumé que pour €8,23. Vous n'êtes lié à rien après votre achat.
Peut-on faire confiance à Stuvia ?
4.6 étoiles sur Google & Trustpilot (+1000 avis)
80364 résumés ont été vendus ces 30 derniers jours
Fondée en 2010, la référence pour acheter des résumés depuis déjà 14 ans