Angular 17+ Crash Course: Building a Storefront with Node.js Backend

In this comprehensive Crash Course, I will guide you through mastering Angular while building a practical storefront application. We'll focus on integrating a Node.js backend using Express and a mock database to emulate real world integration scenarios.

Course Highlights:

Angular Foundations: Gain a solid understanding of Angular architecture, components, directives, and services.

Core Angular Features: Standalone components, Modules, Routing, Pipes & Services.

Node.js Backend with Express: Learn to set up a robust backend for handling RESTful APIs, authentication, and more using Node.js and Express.

Mock Database Integration: Understand the importance of data management by integrating a mock database into your application.

Building a Storefront: Stepbystep guidance on developing a fully functional storefront application, including product management, user authentication, and shopping cart functionality.

Responsive Design and UI/UX: Explore best practices for creating a responsive user interface using Angular Material and other UI libraries.

‍ Target Audience:

Beginners with some experience in web development.

Developers seeking to upgrade their Angular skills to version 17 and beyond.

Web developers interested in building scalable applications with Angular and Node.js.

Those looking to understand the intersection of frontend and backend development in a practical project.

Prerequisites:

Basic knowledge of HTML, CSS, and JavaScript (and preferably TypeScript).

#AngularCrashCourse #NodeJS #WebDevelopment #Angular17 #Angular #crashcourse #angular2024

Repos:

Client: https://github.com/thecodedeck/angula...
Server: https://github.com/thecodedeck/angula...

CHAPTERS
00:00 Intro
00:36 Installing NodeJs
04:55 Installing Angular
09:06 Selecting a Code Editor
09:35 How Web Apps Work
20:57 Generating The Project
24:14 Project Structure & Set Up
53:00 Setting Up a NodeJs Server for Testing
01:01:43 VS Code Extensions
01:03:14 Importing Media Assets
01:05:14 Running The Project
01:06:30 Fetching Project From Server (Services & Endpoints)
01:32:18 Creating the Layout
01:46:57 Introduction Into PrimeNG
01:49:40 Making the Product component
02:13:48 Pagination
02:21:11 Adding Delete, Edit & Create products Endpoints
02:33:50 Adding the Delete, Edit & Create functions
02:39:44 Adding edit, create and delete buttons to the UI
03:10:57 Update the paginator when updating the products list
03:13:00 Modules
03:29:35 Header Menu
03:33:13 Recap
03:35:20 Favicons / Logos
03:38:00 Looking at the changed UI
03:40:37 Pipes
03:47:37 Form Groups
04:03:26 Outro