Create a mobile app in angular and run it on your android phone with cordova
Developing apps with Apache Cordova and web technologies leads to lower development and maintenance costs. With a single source version it is possible to create apps for Android, iOS and Windows.
Cordova brings great productivity gains for app development
If you have the Cordova development under control, then the productivity gain for the app development is enormous. Maintaining a single code base and creating apps for all platforms is cool!
If the app is well designed, the same code base can also be used for a web app that is distributed via a web server.
Lets begin :
Setup
- Install angular cli
2. Download android studio to simply install the SDK and tools
3. Download Cordova via → npm install -g cordova
Setup done.
Creation
- Create a angular app → ng new PROJECTNAME
- Create in the same folder a cordova project → cordova create cordova
- then a add a platfrom by running this in your cordova folder → cordova platform add android
Your structure should look like this
4. Go into the main.ts and make sure that we use cordova correctly on prod. mode.
5. Change the base path of your index.html in your angular project
5. Open the package.json of your cordova project and create a new script that let us run the project in your device
6. Open the package.json of your angular project and change or create a new script to build your project directly into the www folder and run it after that:
7. Now we make our phone ready for running by getting developer state and enable USB debugging:
- Settings → About phone → Build number → Tap it 7 times
- Settings → Developer Options → USB Debugging enable.
8. Connect your phone with your computer via USB.
9. Execute in your Angular project → npm run start
And we are done !
I uploaded the code on Github : https://github.com/DomEscobar/Angular-Cordova-Boilerplate
