Web Development with Angular and Webpack 4 [Video]

Preview Online

Code Files

Web Development with Angular and Webpack 4 [Video]

Tarun Sharma

Friday, August 31, 2018

Build powerful and effective websites using Angular and Webpack 4

Quick links: > Table of contents > What will you learn? > Preview

Mapt Subscription

FREE

€29.98/m after trial

Video

€10.54

RRP €128.38

Save 91%

What do I get with a Mapt subscription?

Unlimited access to all Packt’s 6,000+ eBooks and Videos
100+ new titles a month, learning paths, assessments & code files
1 Free eBook or Video to download and keep every month after trial

What do I get with an eBook?

Download this book in EPUB, PDF, MOBI formats
DRM FREE - read and interact with your content when you want, where you want, and how you want
Access this title in the subscription reader

What do I get with Print & eBook?

Get a paperback copy of the book delivered to you
Download this book in EPUB, PDF, MOBI formats
DRM FREE - read and interact with your content when you want, where you want, and how you want
Access this title in the subscription reader

What do I get with a Video?

Download this Video course in MP4 format
DRM FREE - read and interact with your content when you want, where you want, and how you want
Access this title in the subscription reader

€0.00

€10.54

€29.99 p/m after trial

RRP €128.38

Subscription

Video

Start 14 Day Trial

Frequently bought together

Web Development with Angular and Webpack 4 [Video]

€ 128.38

€ 10.54

Web Development with Angular and Webpack 4 [Video]

Aug 2018

2 hours 46 minutes

€ 10.54

Angular (Full App) with Angular Material, Angularfire and NgRx [Video]

€ 129.58

€ 10.56

Angular (Full App) with Angular Material, Angularfire and NgRx [Video]

Oct 2018

10 hours 26 minutes

€ 10.56

Buy 2 for €21.10
Save €197.39

Add to Cart

Video Details

ISBN 13 9781789340150

Course Length 2 hours 46 minutes

Getting Started with Webpack 4.0 and Angular 6

The Course Overview

Understanding Webpack First

Understanding Webpack 4 with What Is New Here?

Running Webpack 4 with an Angular 6 App

Adding Loaders and Plugins for Angular 6 App

Adding Loaders for Angular 6 App

Adding Plugins for Our Angular 6 App and Running App

Adding Wings to Angular 6 App with Webpack 4

Explore Webpack 4.0 Plugins and Middleware

Advanced Builds with Webpack 4 and Angular 6

Organizing Files and Folders for Angular Build

Internal Implementation of CSS and Style Loaders with SASS and LESS

Adding Images and Fonts to Your Build

Using Different Webpack Tools

Live Reload/Hot Module Replacement with Webpack Middleware

Adding Webpack Dev Middleware with Angular App

Creating a Custom Loader with Plugins

Bundling, Transpiling, and Debugging Webpack

Bundling Without Config or with Custom webpack.config.js

Run Webpack on cmd to Create bundle.js

Transpilation of ES6 Using Babel and Webpack –Part 1

Transpilation of ES6 – Part 2

Webpack Hot Middleware

Webpack HMR API for Different Apps

Webpack Dev Essentials

Bundling or Setting Webpack with mergeMap

Understanding source-map and html-webpack-plugin

Understanding Progress Plugin and uglify js Plugins

Hot Reloading with Webpack dev-server

Webpack Compression and Extracting the Mini CSS Plugin

Optimizing Production Using Webpack

Optimizing for Production Builds – Part 1

Optimizing for Production Builds – Part 2

Optimizing the Angular App for Production –Part 1

Optimizing the Angular App for Production –Part 2

Brotli Compression on Webpack Build

Video Description

Have you ever thought of tackling the hassle of managing multiple JavaScript files for use in a browser? Something which can help you transforming, bundling or packaging about any resource or asset. The exciting new features of Webpack 4 will simplify your development experience with a list of features that cater to all kinds of JavaScript apps.

You will begin the course by writing Webpack without configuration and setting up the environment to build an application. You’ll learn to enhance the application by working with plugins, middleware, and loaders. Further, you’ll gain experience with bundling, transpiling, debugging, and testing your application written in Angular 6.0.

You will learn some advanced Webpack features—for example, working with different transpilers such as TypeScript and Babel to achieve ES6 transpilation with some middleware, making your application production-ready. By the end of the course you will have a better understanding of Webpack, you will be confident, and will have built your own web application using Angular 6 and Webpack 4, so you can apply yourself to practical web development projects.

All the code and supporting files for this course are available on Github at https://github.com/PacktPublishing/Web-Development-with-Angular-Webpack-4

Style and Approach

In this course, you'll understand Webpack 4.0 and how it works with Angular application development

Video Preview

What You Will Learn

Get started with Webpack, with or without configuration
Make your life easier with extensive plugins and middleware
Roll your own hot-reloading Webpack boilerplate from scratch
Create and manage production and development builds with Webpack.
Create production-ready builds using different plugins and loaders
Transpile JavaScript ES6 with Babel and understanding HMR in Webpack
Finally get Angular applications up-and-running for different environments

Authors

Tarun Sharma

Tarun Sharma has been a passionate developer for the past 6 years. He has been working on many different technologies and for the last 3 years has worked with JavaScript, Angular, Node.js, and different frameworks and libraries such as React and Redux. He is a developer, publisher, and online trainer providing free online training and talks on Redux/React/Angular 2.0 in meetups. He uses Redux in production applications and finds it very useful for state management and React-friendly.

More on his experience can be found here - https://in.linkedin.com/in/tarun-sharma-03790254.

Getting Started with Webpack 4.0 and Angular 6

The Course Overview

Understanding Webpack First

Understanding Webpack 4 with What Is New Here?

Running Webpack 4 with an Angular 6 App

Adding Loaders and Plugins for Angular 6 App

Adding Loaders for Angular 6 App

Adding Plugins for Our Angular 6 App and Running App

Adding Wings to Angular 6 App with Webpack 4

Explore Webpack 4.0 Plugins and Middleware

Advanced Builds with Webpack 4 and Angular 6

Organizing Files and Folders for Angular Build