React is one of the top programming languages in the world and continues to grow
From almost nowhere, React has become the most popular JavaScript framework in use today. First released in 2013, it currently accounts for over 475k websites, is used by 65% of all JavaScript developers, has over 130k GitHub stars, and was ranked most popular JavaScript library in the 2018 State Of JS survey; but to write using React, you will have to get up to speed in all the enormous changes to JavaScript since 2015 (ES6 and beyond). These changes are non-trivial and take some time to master. In addition, whatever your future projects will involve, you'll need to be comfortable with Webpack, npm and Babel to transpile, minify and bundle your code.Book Your Course
Start Date
Venue
Availability
Cost
Course confirmed - Guaranteed to run
Course Full/Limited availability
Price shown excluding VAT.
Book a Private Event
If you require the content of this event tailored or have around 7 or more people to train it maybe better for you to host a Private Event, please get in touch to discuss this.
Get in touchDescription
Who is this course for
Anyone wishing to learn more about React, Webpack, npm, Babel and the recent advances in JavaScript.
Purpose of the course
This course gives you a hands-on 3 days with the JavaScript language, covering all the new features introduced since 2015. We’ll then cover Webpack, npm and Babel, before moving on to learn React.
You will learn how to
- Understand the fundamental features of ES6+, Webpack, npm, Babel and React.
- We'll also cover all the new JavaScript syntax introduced since 2015.
Prerequisites
Ideally, you'll already be comfortable with JavaScript 2009 (ES5). However, if you have experience in any modern language such as C#, Python, Java etc, you should be good to go.Benefits for you as an individual
In a recent survey of 60,000 jobs on Indeed.com, 78% required React (21% Angular and 0.8% Vue). React is definitely the library to learn!
Getting Started
- What is JavaScript?
- JavaScript Toolsets.
- Visual Studio.
- Variable Scope.
- Reading from and Writing to the DOM.
- Events
ES6 New Features
- Babel
- Polyfills
- CoffeeScript
- TypeScript
- ES6+ New Features
- JavaScript Modules
- JavaScript Objects
- JavaScript Classes
- Maps
- The for..of Loop
- Destructuring
- Object Literal Enhancement
- The Spread Operator
- Displaying Objects
- Array.map()
- Functional Programming (Optional)
Ajax with ES6+
- Introduction to Ajax
- JavaScript Choices
- Using ES5 Syntax
- Promises
- The Fetch API
- Async and Await
Webpack, npm and Babel
- What's the Problem?
- Packages
- Installing Node, npm and webpack
- JavaScript Modules
- Modules and Webpack – a Worked Example
- Create an HTML Page
- Using jQuery
- Create Multiple Bundles
- Adding Bootstrap
React Setup
- Overview of SPAs.
- React Environment Setup.
- Write some React.
- Install React Developer Tools.
- Hot Module Replacement.
React
- React - The Basics.
- React Elements.
- Elements, Components and Classes.
- React Components.
- State and Lifecycle.
- Hooks.
- The Virtual DOM.
- Displaying Images with React
React with Data
- Starting a New App.
- Edit the Config Files.
- Create a Component Class.
- React and Ajax
Create-React App
- Windows or Linux?
- VS or VS Code?
- Create-react-app
- Create Our Own App.
- Snippets.
- Install and Configure Bootstrap.
- Simple Components.
- Props.
- State.
- Submitting Form Data.
- Removing Data (Optional).
- Building and Deploying a React App.
- Updating to New Releases
Node.js
- What is Node.js?
- Differences Between Node.js and Browser
- Writing Node.js
- The Node.js REPL
- Run Node.js Programs
- Node.js Modules
- Writing a Web Server
- Using Visual Studio
Material UI
- Bootstrap vs Material UI
- Getting Started with Material UI
- Going Further
Get Started
Forget trawling through endless course catalogues – Find the training that’s right for you
Learn MoreLatest from our blog
Kanban and Agile: Bridging the Gap
Kanban and Agile: Bridging the Gap Quanta’s Kanban University Certified Trainer Steve Church explores the way in which Agile and…
Read More
How a Ballerina could move into Cybersecurity
Jason Ford, Quanta Cybersecurity and IT Trainer talks about the limitations in Cybersecurity Training courses. Jason discusses a safe and…
Read More
Boost Team Performance and Productivity: Unlocking the Advantages of Emotionally Intelligent Leadership
Quanta People Development and Leadership Trainer, Giles Collins outlines the key elements of Emotionally Intelligent Leadership and how it impacts…
Read More