This is the first stack that we are going to cover in Project: LEAN and it's about building apps for Web, Android, iOS, Mac, Windows and Linux using a shared codebase through Angular modules.

The goal of Project: LEAN is to introduce new stacks to developers, so we won't be focusing on unit testing or code quality and we will focus only on providing a brief introduction to the services and frameworks in the stack.

Understanding the stack

Part 1 of this series of articles is about fully understanding the key components in this stack, so let's take a look at the image bellow to understand how it works. (Don't worry, I'm going to explain in detail what each part does)

Firebase

Firebase is what we call a Back-end as a service (or BAAS, for short). Basically, it provide us a lightning fast non-relational (Mongo like) database with a persistence and security API on top of it.
The beauty of Firebase, in my opinion, is that in addition to the RESTful API, Firebase provides libraries and SDK's for most popular frameworks like AngularJS, EmberJS and ReactJS, and platforms like Android, iOS, which makes dealing with back-end data persistence dead simple.

Don't worry, we will talk in detail about Firebase in Part 3 of this serie of articles.

Firebase Security Rules

This is a critical component in our stack, as you can tell from the name, we will use Firebase Security Rules to ensure that every data that a user stores in Firebase will be in a predictable and valid format and that no malicious users will do anything "nasty" on our database.
If you are a web developer you will feel right at home with Firebase Security Rules, since it uses a JSON like format to structure the rules that grants or denies access to the data stored in Firebase

Shared Angular Modules

Angular.JS is what makes this stack so fast to build with. We are going to create reusable Angular modules so that we will code only once and build for all 6 platforms, this will drastically reduce our development and maintenance costs.

Ionic

Ionic is a mobile UI framework built on top of AngularJS and Cordova. Basically, we will code an AngularJS app, inject our reusable Angular Modules so that we don't need to code it again, and use Cordova to wrap our Angular App into iOS and Android apps. This will be covered in detail in the next article.

Electron

You probably heard of Atom Editor, right? Atom is a text editor like Brackets or SublimeText and is built and maintained by the GitHub team and the open source community. Atom is built using web technologies like HTML5, CSS3 and Javascript. Atom's dev team created a wrapper like Cordova that lets you pack web technologies into desktop apps for Windows, Mac and Linux, and you can also run low level processess like NodeJS and access native features with it. Pretty cool, right?

WWW

Web apps are important, so we are gonna use our angular modules to create one too. Although you could simply use your desktop app code and publish it to the web, you may want to provide your users with a different experience on the web.