Responsive design

An application is always judged by how it looks. Now that we know how to make it perform, we need to learn how to make it look good. Nowadays, it is common practice to build the frontend while keeping the following two things in mind:

• Minimalism: This style of design makes your site concise by exposing only the necessary elements to have the site functioning. Less is more.

• Responsive: This style of programming makes your site usable everywhere, no matter how big the screen is. The HTML markup will always adapt depending on the width of the screen.

Here, we are only going to cover how to program a responsive frontend because minimalism is a vast and highly debatable topic.

General settings

The first layer of customization begins with the kyleking:customizable-bootstrap-stylus package that we have already installed. Follow these steps to set this up:

Create the following directory:

/_globals/client/bootstrap/custom.bootstrap.json.

(Leave the JSON file empty.)

Run the Meteor project...