1. INSTALL NODEJS
First thing first, before we can install Ionic and Cordova we need to have Node.js.
Be sure to select an appropriate version based on your Windows platform (32-bit or 64-bit). During installation, remember the final location.
To check that everything is properly installed type in the command prompt:
Node -v
Then
Npm -v
You will get the versions installed on your machine.
2. INSTALL Ionic & CORDOVA
Now that Node.js is installed, you will install Ionic by running the package installation command via NPM.
Npm install -g ionic cordova
Now that you have the first elements of your development environment, you will create your very first project to get a quick overview of the possibilities offered by Ionic.
3. INSTALL Visual Studio code (it's a code editor and not Microsoft Visual Studio)
4. Create a project
To create a project use the command prompt by typing:
ionic start nomProjet --v2
And after it is created, put yourself in the project folder (in our case the project is named projectName and finally type the command code (code then space then point) so that the project opens with Visual studio code.
If the default template is not something you want to use, Ionic has some templates available:
• tabs: a simple 3 tab layout
• sidemenu: a layout with a swipable menu on the side
• blank: a bare starter with a single page
• super: starter project with over 14 ready to use page designs
• tutorial: a guided starter project
If you do not specify a template by executing "ionic start projectName --v2", the template tabs will be used.
If for example you type "ionic start nameProject tutorial --v2" the tutorial model will be the project template:
·
- Start will tell the CLI to create a new application.
- · MyIonic2Project will be the name of the directory and the name of the application for your project.
- · Tutorial will be the startup template for your project.
- · --v2 tells the CLI that you want a 3.0 project.
To get a quick overview of your application in the browser, use the serve command.
Cd myProject /
Ionic serve
or
Ionic serve --lab
The first command will open the application in your web browser defined by default for your OS, the second will open the application in your browser but with the display as it will be on iOS and on Android.
0 comments: