IONIC - 3.3 Introduction de projet to-do list

Bonjour à tous, on se retrouve dans cette vidéo d’introduction de projet concernant la réalisation d’une “to-do list” à réaliser avec IONIC. Donc dans cette vidéo on va voir ensemble ce dont on aura besoin pour la bonne conception de ce projet. Donc créer un projet IONIC, vous aurez besoin de votre terminal de commande et d’installer nodeJs au préalable, je vous ai mis le lien juste en face donc « https://nodejs.org/en/download/» et ensuite il vous faudra installer IONIC avec la commande « ionic start», par la suite vous pourrez nommer et lancer votre projet pour le launch avec la commande « ionic serve». Et dans un deuxième temps on a les composents IONIC, donc le composent se nomme en premier avec « ion» au début ensuite vous mettez un tiret et vous aurez directement le composant. Là par exemple, vous avez “ionic-card”, afin d’organiser les données d’une page, aussi vous avez “ion-button” donc pour l'insertion de boutons , “ion-title”, qui permet d’insérer un titre à votre toolbar et “ion-toolbar” qui permet de créer un ensemble de fonctionnalités avec ion-header, ion-content et ion-footer, c’est le contenu global de votre page. Vous aurez « ion-toolbar» et vous pourrez mettre directement vos balises et composants Ionic directement pour faire des fonctionnalités. Egalement consulter la documentation, cela ne sert à rien d’apprendre par coeur les différents composants mais il faut bien savoir les utiliser, et pour se faire rien de mieux que la documentation qui est très bien fournie et très explicite, je vous laisse la consulter je vous ai mis le lien juste en-dessous, vous avez une barre de recherche si vous avez par exemple un mot clé par exemple je vais mettre « toolbar» vous aurez directement la balise « ion-toolbar» qui sera affiché et aussi son explication, comment l’insérer avec les boot code. Donc pour créer des components, vous aurez besoin d’ion-list, créer une liste fonctionnelle. Donc ça, vous aurez directement la signification par exemple vous mettez, pareil, la documentation, vous tapez « ion-list» et vous aurez directement la fonctionnalité. Ca permet aussi de proposer une action ou une confirmation ou une notification à l'aide des alerts, et effectuer des modifications ou apporter des choix à l’utilisateur avec les modals, donc ça c'est les composents global, mais vous en avez des différents, vous en avez plusieurs, je vous laisse les consulter si besoin ,mais nous n’en aurons pas besoin pour ce projet. Et pour finir, nous avons l’incorporation du style grace au CSS cela nous permet d’avoir un affichage visuel assez ludique donc par exemple le padding, qui permet de faire des écarts de remplissage, le display qui permet de définir le type d’affichage, le font-size pour définir la taille de fonte du texte, le background-color pour la couleur de fond, le margin pour l’espacement entre les marges. Vous pouvez apporter les modifications et personnalisations que vous souhaitez mais attention à bien instaurer un style qui reste ludique et pas trop chargé, très important. Et voilà maintenant c’est parti, nous pouvons désormais commencer notre projet et pour se faire je vous invite à regarder la prochaine vidéo. A bientôt !