# 3.1 Introduction

The collection of articles contained in this **App developers tutorials** help category presents several short tutorials on using the [**Materialize components**](../1.-about-this-application/1.3-components-catalog) from [**Aurelia-Materialize bridge**](https://github.com/aurelia-ui-toolkits/aurelia-materialize-bridge) Aurelia plugin. \


Specifically that means how you will develop the app which "hosts" the few selected controls (`select`, `button`, `slider` and `collapsible`).

\
&#x20;**Note**: This tutorial uses the skeleton navigation and JSPM for simplicity. The skeleton navigation delivers everything you would need for a starting application. JSPM is used so you don't need to fiddle with webpack configuration.

This same application that you will build from the scratch, also exists in its finished form [**here**](https://github.com/aurelia-ui-toolkits/materialize-app-developers-tutorial), provided as a courtesy to allow you to "peek" into some details that might have escaped you. \


Starting with one of the most simple components - NavBar, we will show how this component can be added to the well known [**Aurelia Skeleton Navigation**](https://github.com/aurelia/skeleton-navigation/tree/master/skeleton-es2016) app and then add several additional components (Select, Button, Slider and Collapsible).

By the end of the tutorial we will have completed the [**Materialize app developers tutorial**](https://github.com/aurelia-ui-toolkits/materialize-app-developers-tutorial)

shown below: \
&#x20;\


![](http://i.imgur.com/kcCLiy7.jpg)
