This series of articles introduces the basic concepts of the architecture of an open web application, including MVC, the recommended frameworks and tools, and much more.
There are several ways to create an open web application, with a large choice of framework and a lot of theory to learn. This series of articles introduces you to the types of tools you will encounter during this learning, and we will see the basic theory of Model View Controller (MVC) architecture; the type of architecture of the most used applications on the web. Once the theory is mastered, a series of tutorials will allow you to build your own MVC web application from scratch.
This series considers that you have NO knowledge of MVC architecture or web frameworks, and assists you with their learning. If you are experienced in developing MVC applications and are just looking for a quick start guide that shows you how to quickly build a modern web application, by being assisted, you should instead turn to Apps Quickstart.
So many choices of tools Section
If you’re just starting out in building modern web applications and have been trying to research what tools to use, it’s easy to finish frustrated at the sight of the number of choices available. Through this series of articles, we will recommend tools and how to use them, simply but also to explain the theory through concrete and functional examples.
The tools we will be using are part of the Mozilla Recommended Toolchain, a set of tools that the Application-web team has tried and tested to make sure they work properly with a minimum of complaints. We stress the importance of “recommended”: we are not trying to promote a specific set of tools for any reason other than pragmatism. We are not trying to say that you should not test other tools, or that our choice is the best for everyone. If you have experience in web application development, you probably already have your preferences.
The critical tool we will use in this article series is Ember.js / Ember CLI. Ember.js is a well-known framework for the rapid development of an MVC application, and Ember CLI is a command-line interface for generating Ember code.
This article explains the different functions of the MVC architecture in general before seeing how the Ember framework implements it in its foundations.
Create an Ember application
Then we will see the basic steps required for creating an Ember web application.
Views and templates
At this stage, you will learn the View section (the V in M V C), and how they are implemented in Ember through templates (which defines what content will be displayed for each view), and roads (which defined the URL to which we will find each view).
Controllers (the C in MV C) provide the logic that defines what must happen when the application changes state, e.g., in response to user operations, and updates the view and pattern in response. This article introduces the controllers and how Ember implements them.
Application templates and data
Add style to your Ember application
Now that your app’s features are complete, you’ll probably want to add some style to make it more appealing to use. Like many things in Ember (and other frameworks), there are strict rules for that. In this article, how to procedure CSS, images, and fonts in your Ember application.
Publish your application
Once you are fulfilled with your application, and it is ready to be distributed to the public, you need to host it somewhere where others can access it. This article discusses steps to build an Ember application for production and how to publish it on GitHub as a test mechanism.