The purpose of this post is to create an ionic template with left and right side menus, combined with tabs sections.

Why two sides menus?

For the new app I am working on, a social networking application, the client required to have this feature.

After successfully logged In, user should have his profile, message, emails, chat in badges alert on the right side bar. The left side will contain information about the app, and other menu such as contact us.

The Tabs will show the main modules.

To do this app, You will just need to create any template app by running ionic start demoTabs

I skipped the installation process because I assumed you have read my previous posts on how to setup your local work station. Otherwise you can follow the basic from https://davidzongo.com/2016/06/01/create-your-first-mobile-app-with-no-money-quiz-app-bdm/

Now you will just need to open the index page and replace with the following:

[raw] %CODE1%
[/raw]

You can create controller for each of the sidebar and bind them after user loggedIn. For the purpose of the article I always bind them from the dummy data.

This is it.

# you can also view the demo in your Android, Ios using this Ionic View 13e65c44
a.first download the preview app from http://view.ionic.io/
b.then use this code 13e65c44 as AppID

The module is available for download in githup

https://github.com/davidzongo/IonicTabsMenu