In the previous part of our Angular 12 tutorial series for JavaScript developers, we introduced you to some of Angular 12 new additional features and to the application we’ll be building throughout this series. Now, let’s get started with our first practical step.

Parts in this series:

• Angular 12: Tutorial and Example
• Angular 12: Install the CLI & Create a Project (This one)
• Angular 12: Add Bootstrap 4

Angular provides an official tool for initializing projects that saves you from the hassle of configuring modern front-end development tools such as Webpack, and ESLint, etc. It’s available from npm and requires…

In this tutorial, we’ll quickly see how you can generate an Angular 12 project using the official CLI (Command-Line Interface) and then create an application for demonstrating basic concepts of Angular like importing and using built-in modules, creating components and services, and fetching data from a REST API server using HttpClient, the alternative/equivalent to Axios or the Fetch API for Angular developers.

Parts in this series:

• Angular 12: Tutorial and Example (This one)
• Angular 12: Install the CLI & Create a Project
• Angular 12: Add Bootstrap 4

Introducing Angular 12 and its New Features

Angular 12, which is an upgrade to Google’s popular TypeScript-based web framework, has…

More often than not, we need to generate our Angular components inside specific folders for the sake of better structuring our application.

This is how I use Angular CLI to generate a component inside a specific folder.

We can simply use the ng g c command followed by the folder path as follows:

ng g c buttons/home

This command will generate a home component inside the app/buttons/home folder.

Please note that if the buttons folder doesn’t exist Angular CLI will automatically create it.

If you don’t want to have the home subfolder created, you simply need to add the --flat…

In this example, We’ll show you how to build an Angular 11 news app with Bootstrap 4 CSS styling. This example shows Bootstrap integration with Angular, Angular CLI, Components, Services, and sending HTTP requests with HttpClient to a third-party REST API.

This is an example app built using Angular 11 and Bootstrap to build a beautifully styled news app with header, jumbotron, and card UI components.

Overview

We’ll be building an Angular 11 application where users can:

• Use Angular CLI to generate a project,
• Create and use Angular components,
• Create and inject Angular services,
• Use HttpClient to send HTTP requests to…

In this tutorial, we’ll learn about web components and we’ll use Angular to build a simple web component.

Angular is a web platform for building frontend web applications. It makes use of various concepts such as components, dependency injection and data binding.

Angular components are reusable pieces of code that control a part of the application UI. They are not web components but Angular provides the elements package which helps export Angular components as web components.

Before getting started to build the example let’s first introduce web components.

Introducing Web Components

Web components are a set of browser APIs that enable developers to…

In this tutorial, we’ll learn how to use Ionic 4 and Angular to build a cross-platform hybrid mobile application.

Unlike native apps, a hybrid mobile application makes use of web technologies such as JavaScript, HTML and CSS (and their related technologies like TypeScript, Angular and Sass etc.) to build mobile applications. This works thanks to native containers like the popular Cordova tool and more recently Capacitor by the Ionic team. Both of these tools allow developers to call native SDKs on iOS, Android with one codebase. …

Throughout this tutorial, we’ll be building a full-stack web application with Nest.js and Angular 7. We’ll also introduce both frameworks and learn how to get started using each one of them.

In the project, we’ll be building a simple contacts management application for managing a set of contacts in an Angular and Material Design interface retrieved from a Nest.js RESTful backend.

Prerequisites

Let’s get started with listing the prerequisites you need to have for this tutorial. Basically, you will need to have:

• Both Node.js and NPM installed on your development machine. You can simply go to the official website and download…

Throughout this tutorial, we’ll see how to use Electron and Vue.js to build cross-platform desktop apps for major operating systems such as Windows, Linux, and MAC.

In a previous article, we have used Angular as the framework for structuring the code of our application. Now, we’ll see how to use Vue.js instead.

Thanks to Electron, you can build fully-fledged desktop apps using web technologies only. No more Java or C++, plus you’ll have access to the native APIs of the underlying system so you can integrate your app with any required system service.

A plethora of apps are being built…