Vous êtes nouveau sur Developpez.com ? Créez votre compte ou connectez-vous afin de pouvoir participer !

Vous devez avoir un compte Developpez.com et être connecté pour pouvoir participer aux discussions.

Vous n'avez pas encore de compte Developpez.com ? Créez-en un en quelques instants, c'est entièrement gratuit !

Si vous disposez déjà d'un compte et qu'il est bien activé, connectez-vous à l'aide du formulaire ci-dessous.

Identifiez-vous

Identifiant
Mot de passe

Mot de passe oublié ?

Créer un compte

L'inscription est gratuite et ne vous prendra que quelques instants !

Je m'inscris !

Apprendre à programmer avec le framework Angular : Vos premiers Components

Un tutoriel de William Koza

Le 13 décembre 2016 à 22:31, par wkoza

22 commentaires

0PARTAGES

Bonjour,

Voici un premier tutoriel avec mise en œuvre dans cette série. Dans ce cours nous allons apprendre à manipuler vos premiers components.

Suite au tutoriel présentant l'outil en ligne de commande Angular-CLI, vous allez apprendre dans ce cours à manipuler vos premiers components et entrevoir les liens qui peuvent exister entre eux.

Bonne lecture et bon codage !

Retrouvez les meilleurs cours et tutoriels pour apprendre le Javascript.

Vous avez lu gratuitement 108 articles depuis plus d'un an.
Soutenez le club developpez.com en souscrivant un abonnement pour que nous puissions continuer à vous proposer des publications.

Une erreur dans cette actualité ? Signalez-nous-la !

Votre nom : Votre e-mail :

Décrivez l'erreur que vous souhaitez porter à notre connaissance :

22 commentaires

Commenter Signaler un problème

dukoid

Membre expert

Le 15/12/2016 à 13:01

devDePassage, certes AngularJS a de grande qualité comme tu le soulignes si bien : la simplicité

MAIS parceque il y a toujours un mais. quand il s'agit de concevoir une grosse application, AngularJS est à la peine, c'est le bordel. ça se complique.
le tout objet permet une meilleure gestion de l'ensemble de la grosse application(qui a un volume et une multitude de services et de données différentes...)
oui Angular est du coup plus complexe.

comme je dis toujours, chaque framework à ses avantages et inconvénients... et réponds à des besoins différents.

wkoza

Membre éclairé

Le 23/12/2016 à 12:12

Bonjour Heliogabale,

Je comprends ta remarque. Ce n'est pas pour "se faire passer pour un développeur au fait des nouveautés", non. C'est juste une deformation de langage car ces termes sont très teintés de sens et parfois plus parlant. J'avoue que je ne suis pas fan du tout français mais je vais faire un effort. Pour le terme proxifier le back end, il faut comprendre mettre en place un système de proxy entre le front-end et le back-end afin de "rediriger" les requêtes vers un autre serveur. Cela permet notamment d'éviter les erreurs de cross-domain.

Heliogabale

Nouveau Candidat au Club

Le 23/12/2016 à 16:08

Merci de ta réponse, je comprend très bien.
Mais tu n'étais pas visé personnellement, ni le contenu de l'article.

Mais beaucoup d'articles deviennent souvent incompréhensibles à force de "compulsions syntaxiques".

A +

ascito

Membre éprouvé

Le 14/12/2016 à 2:55

pourquoi les "`"?

Code :

Sélectionner tout

1
2
3
4
5
6
7
8
9
10
11
12
import { Component } from '@angular/core';
 
@Component({
    selector: 'mon-premier-component',
    template: `
        <h2>Mon premier Component</h2>
        <img src="http://gabarit.developpez.be/images/logo.png" />
    `
})
export class MonPremierComponent  {
}

Watilin

Expert éminent

Le 14/12/2016 à 12:54

Envoyé par ascito

pourquoi les "`"?

Parce que ES6 : https://developer.mozilla.org/fr/doc...9raux_gabarits
C’est plus pratique pour les sauts de ligne. Les chaînes traditionnelles ne les supportent pas (SyntaxError: unterminated string literal) et on est obligé de recourir à des astuces moches :

Code :

Sélectionner tout

1
2
3
"Panda\
Poney\
Paprika"

Code :

Sélectionner tout

1
2
3
"Panda\n" +
"Poney\n" +
"Paprika"

NoSmoking

Modérateur

Le 17/12/2016 à 9:57

Bonjour,
<hs>
@devDePassage

que tu sois de passage ou autre, chasse le naturel il revient au galop ! (mais il boite toujours autant !!)

</hs>

Heliogabale

Nouveau Candidat au Club

Le 23/12/2016 à 11:22

Ce qui m'énerve du plus en dans les article c'est ce genre de choses : "Proxyfier le back end" (personnellement je ne comprend pas ce langage

) ou encore "Builder un projet" (là, j'ai compris mais ..... il existe déjà un mot en français).

Tout ça dans quel but, se faire passer pour un développeur au fait des nouveautés ?

Moi je zappe directement à l'article suivant.

z3bulon

Membre à l'essai

Le 30/12/2016 à 21:16

Bonjour,
Merci pour cette mise en bouche sur Angular : vivement la suite... 🙌

Le 14/12/2016 à 21:48

C'est pas mal, j'attends le reste pour me convaincre de passer de angularjs à angular 2.0 (Ce qui risque d'être très difficile... Pas fan des syntaxes relouds dans le html... AngularJs, c'est de la balle, c'est magique et "cil-fa", c'est le rêve de tout informaticien ...

Suffit de voir un débutant s'extasier devant le 2 way binding, un truc génial de chez génial, trop souvent dénigré par les aigris !

Angular 2 par contre... hem

cac*... , les génies de microsoft sont passés par là pour dire "Angularjs ? c'est trop facile, on veut du truc style java ou symphony, avec des classes et une syntaxe incompréhensible et alambiquée, pour que les gens mettent 3 plombes à réaliser leurs projets, comme dans l'ancien temps, avec 30 % de réussite de projets...."

Allez je reste avec mon angularJS pour encore 5 ans et bye bye, et bientôt j'engrangerais le fric, avec le brave et vaillant format MVC qui lui est compréhensible de tous, et les modèles de données JSON qui sont clairs, eux !

Signé : Un réfractaire, amateur d'angularJS, JS comme JAVASCRIPT 5.0, et fan du MODELE VUE CONTROLEUR en JS ! vive le ng-repeat et les controleurs et les vues ,non merci aux nouveaux trucs que l'on ne comprends pas. Le typage de variables,

: heeerk pas question !

Si c'est pour faire du "java-like", alors autant faire du Primefaces, ça ca déchire oui, et c'est logique et pas de syntaxe trop lourde avec de bons exemples !

Quand à react... Peuh, regarder ça 2 minutes c'est déjà se faire mal aux yeux ! On ne comprends rien, ce n'est pas logique. AngularJS, lui est structuré, logique, et "the best" !

-> Vous êtes un génie, un développeur de ouf, un crack, un "padawan"

: go angular 2 ou react ou full php : je vous en prie codez des trucs incompréhensibles et géniaux encore et encore, mais pour vous et seulement pour vous même, ne venez pas pleurer .... avec vos trucs ensuite pour collaborer .

->Vous êtes un honnête homme, dans la moyenne du peuple, avec une intelligence normale, mais inventif, go ANGULARJS

, et là on vous comprendra, parce que c'est facile, et votre productivité sera +200% et votre taux de collaboration pourra grimper en flêche ! Et encore, sans parler de l'incroyable 3 ways binding de firebase avec la lib angularfire qui révolutionne tout (malheureusement la bdd est chez google heeeerk!!!)

Le 19/12/2016 à 20:29

Envoyé par dukoid

devDePassage
le tout objet permet une meilleure gestion de l'ensemble de la grosse application(qui a un volume et une multitude de services et de données différentes...)
.

AngularJs c'est déjà du tout objet, sauf que ce sont des objets JSON faciles à gérer, pas de lourds objets PHP on l'on ne comprends pas la syntaxe et ou l'on se perds, et qu'on ne peux pas visionner dans Firebug . Php est très bon pour une chose : requêter les bases de données avec PDO, renvoyer des objets JSON à AngularJs avec json_encode, point ...

, en un mot, une bonne mule qui rends les requêtes SQL bien claires et le CRUD clair à gérer. Mais je suis d'accord que faire une appli en full php avec un bon framework php doit être bien pour ceux qui maitrisent... Moi j'aime angularJs parce que c'est plus simple pour moi, c'est bien structuré et la syntaxe est claire (sauf les directives, je ne comprends toujours pas trop) ! Dans ma petite carrière, c'est la structure la plus flexible et ordonnée que je n'ai jamais vu, la seule structure qui me permet de partir relativement confiant sur un projet humble bureautique.
Sans compter les tas d'exemples de code sur internet, et les nombreux modules additionels...

Quel autre langage permet il de récupérer l'intégralité des valeurs d'un formulaire, y compris des valeurs provenant de sliders, de graphiques et tous les champs imaginables dans UN SEUL OBJET : en écrivant $scope.monFormulaire ={}; j'ai déjà setté mon formulaire, puis c'est ma vue qui va le remplir AUTOMATIQUEMENT grace à un ng-model="monFormulaire.nom" affecté à un champs input par exemple! https://docs.angularjs.org/api/ng/directive/input

je peux même le recharger à loisir à partir du back end en 2 temps trois mouvements HI HI HI, tout automatique avec une requête $http ou un service !

Je peux même rajouter des truc dans l'objet à loisir, on s'en fout ça marche encore ca déchire mec, le back end s'en fout si il y a trop de données dans le JSON, ça marche encore mecton !!!! Le JSON ! Le code est incroyablement clair ! Et non, pas besoin de getters, pas besoin de setters, pas besoin de classes, pas besoin de typer les variables, tout marche comme ça, c'est juste magiiiique !

Pendant ce temps, ou voit les javascriptiens se galérer avec des tonnes de document.shit.get.value(bigshit) je sais pas quoi trop lourds sur chaque variable, c'est même pas dynamique, c'est statique hi hi hi! HI HI HI le temps qu'ils perdent HI HI HI! Et nous on place tout dans un seul objet et hop c'est fini, direction le back end hi hi hi, rien à faire good bye, on se fait une cigarette electronique pendant que les autres mulent encore pendant 5 heures avec leurs technos ! AngularJs is the best framewoooooork !!

Dont trust latests things !!!

Commenter Signaler un problème

Identifiez-vous

Créer un compte

Apprendre à programmer avec le framework Angular : Vos premiers Components Un tutoriel de William Koza

Apprendre à programmer avec le framework Angular : Vos premiers Components

Un tutoriel de William Koza