In this lesson, we are going to demonstrate how easy it is to copy existing Angular code into an Ionic app. It is literally as simple as removing unnecessary code from the Ionic app and pasting in the guts of our Angular application. Along the way, we will update some dependencies and discover a gotcha for including assets from a CDN.
So we'll hop into source, we'll go and copy the app directory, the assets directory, and the data directory. We'll paste them into the www directory and you can see that they are now here. Now we're going to copy the index.html file from eggly and we're just going to replace the index.html from eggly-ionic. Now we need to update these assets and the first place we're going to start is with angular-ui-router. So we're going to go to cdnjs.com and we will pull the appropriate reference from the cdn, we'll hop back into our source code and replace it.
The next thing we're going to do is update these versions of angular-load-jquery to the latest. We'll just copy these, we're going to replace them, and the upside of this is that we are replacing protocol agnostic references to be specifically pointing to HTTPS. We are also going to update the bootstrap css 2.2 HTTPS as well. This is important when you are working on a mobile device.
So now we have simply taken the index.html, pasted it in and updated our source files. Now we're going to run ionic serve from the command line, and now you can see eggly running within eggly-ionic, and so this is the power of Ionic leveraging Angular application within its framework.