Here’s a quick run down of how they work together. They are all such versatile tools that everyone uses them differently so don’t feel bad if you don’t get it right off the bat haha. It’s a lot.
NPM is a package manager for node (node package manager). Ionic has their own package of code, bower, and gulp too. They’re tools that utilize the Node platform. Packages from npm usually go in node_modules. Some are global like cordova, some are local.
Bower is basically another package manager but it’s generally on a per-project basis. So in your bower config file you can see that it defines things like angular and also a version. Bower will automatically fetch and update those versions if it’s changed in the bower file. This is really useful by the way outside of ionic. So if you’re building a website and you want to use a few different components, you just have to add them to your bower file or use the terminal command and it will download them and manage them in the bower_components folder. So if you install a bower component, you don’t move it out of the bower components folder but you actually reference it. So in your code you would do like …/bower_components/asdf/asdf.js.
www/lib is the core ionic lib. You don’t want to alter these because if you update it will just get over written. All of your source should just be everything else in the www folder.
99.99% of the time you won’t have to alter any of these things, ionic handles all of that for you.
And this is where Ionic comes in, it manages all of this so you don’t have to. It makes sure that all the dependancies are correct, gives you all the files as a beginning structure, and then also has all of the ionic functions for things like deploy, push, analytics, etc built in.