Photo by Jacky Zhao on Unsplash

Welcome to part-7 of Angular Basics series. In this part also, we will continue with routing. The starting point will be the code from the previous part. You can get the code from here.

We will first learn to do error handling with wildcard routes. We will first generate a new component with the command

We will update the page-not-found.component.html with appropriate text.


Photo by Norbert Levajsics on Unsplash

Welcome to the sixth part of Angular Basics. We will learn to change paths with Routing in this post. The starting point for this project can be taken from this zip file.

On running the project in localhost, we can find a simple project with different tabs. It is not working now and that is the thing, which we are going to fix.


Photo by Michael Soledad on Unsplash

Welcome to part-2 of the recipe book app. We will add on top of the app we have create in the previous part. You can find the code for the earlier part in this github link.

We will first add a directive to our project to add dropdown functionality to the Manage button. Create a new file dropdown.directive.ts in the shared folder.

Here, we are using HostBinding to the open class of bootstrap and creating a variable isOpen. We are then adding it to a listener with click, with help of HostListener.


Photo by XPS on Unsplash

Welcome to the fifth part of Angular Basics. We will deep dive into services and dependency Injection in this part.

The service in Angular works as a central repository which can be accessed from any component. The starting point of the project can be taken from this zip file.

Our small app have three small components and we pass data around for logging and other things.


Photo by DESIGNECOLOGIST on Unsplash

Welcome to the fourth part of Angular Basics. We will deep dive into directives in this part.

The starting point of the project can be taken from this zip file. Our little project have an array of number in app.component.ts file.


Photo by Sebastian Bednarek on Unsplash

We are going to build a recipe book app by using the concepts of Angular we learnt earlier. This app will be build in multiple posts, so keep a look for other posts.

Now, go to any folder in your computer and in the terminal type the below command to create the Angular project.

It will ask us a bunch of questions. Let’s answer them as mentioned below.


Photo by XPS on Unsplash

In this post, we are going to create a beautiful Login and registration form with HTML and CSS.

So, open VSCode and create the basic structure of a HTML in an index.html file by ! and then pressing tab. We have also put an images in the images folder. You can take them from the github repo at the end.


Photo by Call Me Fred on Unsplash

In this post we will create a simple and a beautiful Strawberries comany website with HTML and CSS.

So, open VSCode and create the basic structure of a HTML in an index.html file by ! and then pressing tab. We have also put an images in the images folder. You can take them from the github repo at the end.


Photo by Colin Watts on Unsplash

In this post we will create a simple and a beautiful website with HTML and CSS.

So, open VSCode and create the basic structure of a HTML in an index.html file by ! and then pressing tab. We have also put an image and a logo in a images folder. You can take both of them from the github repo at the end.


Photo by Rafal Jedrzejek on Unsplash

Welcome to the third part of Angular Basics. We will start from where we left. We are going to deep dive into components and data binding.

We will start with a simple angular app, in which everything is running from the app.component.html file. The content for the same is below.

Nabendu Biswas

UI Lead- ReactJS, JavaScript and everything in-between.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store