Learn ReactJS with Webpack 4, Babel 7, and Material Design

Quick and simple, fast guide on integrating ReactJS with Webpack, Babel and Material Design.
Free tutorial
Rating: 3.9 out of 5 (325 ratings)
12,915 students
30min of on-demand video
English [Auto]

Integration with ReactJS web Template


  • Basic ReactJS


This is a short tutorial which will get your ReactJS app running with Webpack and Babel.

React is a JavaScript library for building user interfaces and it has three main characteristics:

  • Declarative

  • Component-Based

  • Learn Once, Write Anywhere

Webpack is an open-source JavaScript module bundler. Its main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable of transforming, bundling, or packaging just about any resource or asset. Webpack takes modules with dependencies and generates static assets representing those modules.

Babel is a toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments. Here are the main things Babel can do for you:

  • Transform syntax

  • Polyfill features that are missing in your target environment (through @babel/polyfill)

  • Source code transformations (codemods)

  • And more! (check out these videos for inspiration)

In short, Babel is a JavaScript compiler.

To whom is this course addressed:

  • Beginner and intermediate ReactJS Developers

  • ReactJS Developers that want to learn the new ways of working with React and Webpack

  • Anyone

Who this course is for:

  • Beginner and intermediate ReactJS Developers


Premium Bootstrap Themes
Creative Tim
  • 4.1 Instructor Rating
  • 531 Reviews
  • 22,386 Students
  • 2 Courses

Fully coded UI Tools to create web apps

UI Kits and Dashboards built on top of Bootstrap, Vue.js, React and Angular.

Area of expertise

- Create UI Frameworks

We have created the tools that will help you in your next project. From plugins to complex kits, we've got you covered in all areas regarding front-end development.

- Share Freebies

Everything that we used to create our products can be downloaded for free under MIT License. People have already trusted and used them in thousands of sites.

- Power Hackathons

We've sponsored many hackathons around the world with the tools that they need to make awesome web applications. Our UI tools go hand in hand with startups.

Our technologies

Our products are built on top of modern frameworks. Having the coded and the designed versions for the same framework, your designers and developers will talk the same language.

Solutions for you

Creating your web design from scratch with dedicated designers can be very expensive. Using our solutions you don't have to worry about design. Save time and money by focusing on the business model.

UI Kits & Example Pages

The easiest way to get started is to use one of our pre-built example pages. From landing pages to e-commerce or blog pages, you will be able jump start your development. Show your clients a quick prototype that can be made in minutes!

Pre-Made Sections & Elements

Build pages in no time using pre-made sections and elements! From headers to footers, you will be able to choose the best combination for your project.

Easy to Use Admin Templates

Every element that you need in a product comes built in as a component. All components fit perfectly with each other and can take variations in colour.

Fully Coded Dashboards

Using the our Admin Dashboards will save you large amount of time. You don't have to worry about customizing the basic Bootstrap 4 design or generating new components.

Top companies trust Udemy

Get your team access to Udemy's top 22,000+ courses