IONIC - 3.3 Project to-do list introduction

Click here for more videos available on our youtube channel !

Hello everyone, we find ourselves in this project introduction video concerning the creation of a “to-do list” to be carried out with IONIC. So in this video we will see together what we will need for the good design of this project. So create an IONIC project, you will need your command terminal and install nodeJs beforehand, I put the link right in front of you so "https://nodejs.org/en/download/" and then you will need to install IONIC with the "ionic start" command, then you can name and launch your project for launch with the "ionic serve" command. And secondly we have the IONIC compounds, so the compound is named first with "ion" at the beginning then you put a dash and you will have the component directly. There for example, you have “ionic-card”, in order to organize the data of a page, also you have “ion-button” so for the insertion of buttons, “ion-title”, which allows you to insert a title to your toolbar and “ion-toolbar” which allows you to create a set of features with ion-header, ion-content and ion-footer, this is the overall content of your page. You will have "ion-toolbar" and you can put directly your Ionic tags and components directly to make features. Also consult the documentation, it is useless to learn the different components by heart but you have to know how to use them, and to do nothing better than the documentation which is very well provided and very explicit, I let you consult it I put the link just below, you have a search bar if you have for example a keyword for example I will put "toolbar" you will directly have the tag "ion-toolbar" which will be displayed and also its explanation, how to insert it with the boot code. So to create components you will need ion-list, create a functional list. So that, you will directly have the meaning for example you put, same, the documentation, you type "ion-list" and you will have the functionality directly. It also allows to propose an action or a confirmation or a notification using alerts, and making changes or giving the user choices with modals, so that's the global components, but you have different ones, you have several, I let you consult them if necessary, but we will not need them for this project. And finally, we have the incorporation of the style thanks to the CSS this allows us to have a rather playful visual display so for example the padding, which allows to make gaps in filling, the display which allows to define the type of display, the font-size to define the font size of the text, the background-color for the background color, the margin for the spacing between the margins. You can make changes and customizations you want but be careful to establish a style that remains playful and not too busy, very important. And here we go, we can now start our project and to do so I invite you to watch the next video. See you soon !