Install and Setup Angular Formly

Instructor: [0:00] The first step to getting started with Formly is to install it. Let's go over to the main website, which is formly.dev. This is the main place where you get all of the documentation. You can find a page dedicated for examples, with running examples even on StackBlitz, and so on. That's definitely the way to go for if you want to get deeper into Formly.

[0:22] To install, we can scroll the main page, which is basically a visualization of the readme, and get to know how to install it. You can see here the different kind of examples. You obviously have to have Angular Forms, and then you install Formly core.

[0:37] Formly usually comes in two different parts. There is that core part, which contains mainly basically the core functionality that Formly provides us. Then there comes a bundle UI theme. In the UI theme, here you can see these are the ones that are already included, which is Bootstrap, Material, Ionic, PrimeNG, Kendo, and even NativeScript. There are more coming later as Formly evolves.

[1:01] We don't want to set this up manually as it's described here, but rather, what we want to do is use the Angular CLI and to build an angular schematics. We want to use that ultimate way of setting up our project, and we also want to use the UI theme material as that's what we are using in our project. Let's simply copy that. Go back to our application, and let's paste that in.

[1:29] All right. Once we got Formly installed, let's have a look at what happened. You can see mainly the main app module has been modified. What Formly did is set up the ReactiveFormsModule which we'll need, since Formly is based on top of the ReactiveFormsModule in Angular.

[1:44] Then it installed the forRoot part, so the main FormlyModule here as well as the FormlyMaterialModule which provides the whole UI theme support for material in our case. We're [inaudible] and ready to use Formly in your project.