Webpack for React Applications [Video]

Preview in Mapt

Code Files

Webpack for React Applications [Video]

Alexandru Toea
Tuesday, January 16, 2018

Learn everything needed to build your own modern stateful web applications

Quick links: > What will you learn?> Table of content

Mapt Subscription

FREE

£24.99/m after trial

Video

£94.86

RRP £111.58

Save 14%

What do I get with a Mapt Pro subscription?

Unlimited access to all Packt’s 5,000+ eBooks and Videos
Early Access content, Progress Tracking, and Assessments
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 Mapt 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 Mapt 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 Mapt reader

£0.00

£94.86

£25.00 p/m after trial

RRP £111.58

Subscription

Video

Start 14 Day Trial

Frequently bought together

Webpack for React Applications [Video]

£ 111.58

£ 94.86

Webpack for React Applications [Video]

Jan 2018

3 hours and 20 minutes

£ 94.86

Building Your Application with React Native [Video]

£ 111.58

£ 94.86

Building Your Application with React Native [Video]

Jan 2018

1 hour and 47 minutes

£ 94.86

Buy 2 for £31.68
Save £159.58

Add to Cart

Video Details

ISBN 139781788472203

Course Length3 hours and 20 minutes

Video Description

Whether you are optimizing build times to decreasing bundle sizes or strategies of serving large applications, performance is always one of the main traits of web applications. Having a slow Webpack build with a ton of libraries is always a challenge. No matter if it’s perceived by the end user, server, or developers.

In this course, we will learn how to use Webpack with a real project. You will be provided with a dynamic responsive photo gallery application written in react, along with minimal to basic Webpack configuration and will be shown how to apply advanced features such as deploying with Babel, code splitting, and ES2015.

By the end of this tutorial, you will be able to deploy your application to dynamic cloud hosting sites such as AWS in order to improve the existing application.

Style and Approach

This course is a comprehensive, yet an easy-to-follow guide for anyone who would like to learn how to get up-and-running with Webpack.

Introduction to the Project

The Course Overview

A React Application

Deliverables with Webpack

Deliverables with Webpack (Continued)

Configuration of the Project

Setting Up Babel

Setting Up Babel (Continued)

Webpack Configuration - Loading Assests

Webpack Configuration - File Loader

Webpack Configuration - SCSS

Performance Increase

Cache Busting

Project Files Cleanup

React Specific Topics

Using Dev Server in Your Application

Best Practices with Webpack Dev Server

React Router and Code Splitting

Webpack Based Deployments

Getting an App Production Ready

Deployments with GitHub Pages

Deployments with AWS S3

Dynamic Sites - Node and Webpack Integration

Deployments to AWS EBS

What You Will Learn

Create a message board website
Build your own modern stateful web applications
Track your application state in real-time with Firebase
Use components as a unit of styling
Spread props to wrap components
Set up a Firebase project
Master deploying with Babel, code splitting, and ES2015
Understand how to add posts and styling

Authors

Alexandru Toea

Colibri is a technology consultancy company founded in 2015 by James Cross and Ingrid Funie. The company works to help their clients navigate the rapidly changing and complex world of emerging technologies, with deep expertise in areas such as big data, data science, machine learning, and cloud computing. Over the past few years they have worked with some of the world's largest and most prestigious companies, including a tier-1 investment bank, a leading management consultancy group, and one of the world's most popular soft drinks companies, helping each of them to better make sense of its data and process it in more intelligent ways. The company lives by its motto: Data -> Intelligence -> Action.

Alexandru Toea is a Senior Frontend developer. He is currently working with various startups specializing in building complex React applications for both public and internal use. Alexandru started his frontend developer career by building his school's websites around 10 years ago and has constantly advanced his knowledge of web technologies ever since. He is currently working with a technology startup to provide it with the tools required for quick expansion.

Alexandru has spent the past four years working with React and Redux as well as building efficient real-time applications for both startups and corporate clients. He has a passion for efficient and clean code, while also staying on top of all the new developments in the front-end world. On the site he is also an Authorized Google Trainer, teaching for companies such as Solvay and Lucas Films.

Introduction to the Project

The Course Overview

A React Application

Deliverables with Webpack

Deliverables with Webpack (Continued)

Configuration of the Project

Setting Up Babel

Setting Up Babel (Continued)

Webpack Configuration - Loading Assests

Webpack Configuration - File Loader

Webpack Configuration - SCSS

Performance Increase