It's time to learn React.js
With a focus on simplicity and readability, this course will have you building real time applications and dynamic website components in no time!
Together, we will build “Catch of the Day” — a real-time app for a trendy seafood market where price and quantity available are variable and can change at a moment's notice. We will build a menu, an order form, and an inventory management area where authorized users can immediately update product details.
You can try it out here or get the course if you are already convinced.
Meet Wes Bos
Wes Bos is a Full Stack Developer, Speaker and Teacher from Canada. He works as an independent web developer and teaches as a lead instructor with HackerYou and Ladies Learning Code. Wes has taught over 500 students in 200+ classes and spoken at dozens of conferences around the world.
Wes is the author of Sublime Text Power User, which has sold over 4,000 copies, and the creator of Flexbox.io, Command Line Power User and hundreds of YouTube Tutorials.
Follow @wesbosJavaScript is everywhere now, as is React, and having strong React skills is a great way to get ahead with building modern web apps right now. Wes' teaching style is amongst the best in our industry and I'd recommend this course to anyone looking to get better at both JavaScript and React.
Peter Cooper@petercEditor of JavaScript Weekly • Chair of O'Reilly @FluentConf • Co-chair of O'Reilly OSCON
Wes is one of the most talented teachers I have ever seen in action. Since we started working together in 2012, his knowledge, energy and humour has helped 500+ students break past difficult learning hurdles and given them the skills and confidence to create amazing things. HackerYou wouldn’t be the same without Wes on our instructor team, and anyone who has the chance to learn from him should prepare to be inspired and delighted.
Heather Payne@heatherpayneCEO of HackerYou • Founder of Ladies Learning Code
What Will I Learn?
- How to build an entire App or Website Component in React.js from start to finish.
- Understanding React Components and writing markup with JSX
- Maintain your Application's State
- Communication between components
- Working with State and HTML5 LocalStorage
- Real time web socket data with Firebase
- Creating maintainable code with JavaScript Modules
- URL routing with React Router
- Taking advantage of new ES6 Features
- + So much more — Check below for a full listing of videos
Who is this for?
Anyone looking to modernize their front end development skill set. If you are already an experienced JavaScript developer, you will simply complete the course a little more quickly.
- Developers reliant on jQuery who want to improve how they build with JavaScript
- Angular, Ember or Backbone developers looking to grok how React works
- PHP & WordPress Developers - React tends to jive well with those who are used to PHP as it was built for Facebook
- Developers looking to add interactive or real time pieces to existing websites
- Anyone who wants to get better at JavaScript and learns well from seeing both fundamental and advanced concepts in practice
Video pacing is just right - fast enough to keep you interested without passing by or assuming any details.
The Course Modules
Each video breaks down a specific part of React and allows for quick referencing in the future.
Just under 5 hours of video — learn React in an afternoon or two!
Development Environment Setup with Gulp + Browserify
12:38#1
Introduction to React Components
6:36#2
Writing your first Component
9:03#3
Writing HTML with JSX
8:34#4
Creating our application layout with components
5:02#5
Passing dynamic data with Props
6:54#6
Routing with React Router
13:22#7
Using Utility : Helper Functions in React
4:41#8
All About React Event Listeners
8:36#9
Understanding State
21:58#10
Loading Data into State onClick
3:06#11
Displaying State with JSX
10:46#12
Updating our Order State
10:13#13
Displaying our Order State with JSX
12:54#14
Persisting State with Firebase
14:00#15
Persisting State with LocalStorage
11:03#16
Bi-Directional Data Flow with LinkState
16:03#17
Updating and Deleting State
10:52#18
Animating React Components
24:53#19
Component Validation with PropTypes
10:03#20
Chunking our code into ES6 Modules
11:49#21
ES6 Components Extended
15:47#22
Creating React classes with ES6
3:19#23
ES6 and React Mixins
2:06#24
Autobinding this with ES7 Decorators
5:47#25
Handling React Proptypes with ES6
1:03#26
Working with ES6 and State
5:29#27
Converting the rest of our components to ES6
5:47#28
Locking down our Application with Firebase oAuth Authentication
26:39#29
Course Packages
Starter Course
- First 18 HD Video Tutorials
- All Source Code — Gulp Tasks and Starter Files for each video
- Stream course from any device
- Unlimited Updates
Exclusive access to the React for Beginners Slack Chat Room where you can ask me for help and chat with other learners
Special Price — join 5,555 other React.js Learners
Master Package
- Access to all 29 HD Videos — see above for a full listing of topics
- Component Interaction + Animation
- ES6 Videos - Refactoring for Modules, Classes, Mixins and Autobinding
- Integrating a Login with FireBase Authentication
- Source Code — Gulp Tasks and Starter Files for each video
- Stream and Download DRM-free files from any device
- Unlimited Updates
Special Price — 5,555 already sold!
Team License
Purchase a team license to get your entire team — of up to 10 — building with React. This includes everything in the master package and as an added bonus, I'll mail your team an envelope stuffed with React and related JavaScript Stickers!
I'm also available for on-site training — contact me for more info!
All prices in USD
What Is React?
ReactJS is a JavaScript library that has become the tool the choice for easily building dynamic user interfaces. The power is in the Virtual Dom — when your application's data changes, React figures out which parts of your document need to be changed, and immediately update only those parts.
Hundreds of thousands of developers from small agencies to large companies use React to deliver top notch experiences in their apps and dynamic website components.
Like who? Facebook.com is made up of thousands of React components. Instagram web viewer is entirely built in React. The brand new Netflix movie browsing experience is powered by React. And many, many more...
FAQ
What version of React was this created for?
React 15 — I'll update this section each time React is updated. In the videos I also note some of the new features that were introduced in 0.14 and how we can take advantage of them — helpful if you have done a tutorial or two before.
What about Webpack? Why did you pick Browserify?
This course is focused on doing an awesome job at teaching you React and doesn't spend too much time on the tooling which can often be an unwanted distraction. Browserify is the easiest to get up and running but many of the learners have converted the build step to their tooling of choice. The important thing here is that you are learning to Code react which can be built with any number of build tools.
What format are the videos? How do I watch them?
Once you buy a package, you will be mailed access to a course viewer area where you can stream all the videos. Buyers of the Master Package will also be able to download them for offline viewing. All the videos were recorded at 1920×1080. Most of them have double resolutions, to maintain crispness on 4k and Retina displays
What if I'm not thrilled?
I want to make sure you get real value out of this so I only want your money if you are happy with the product! If you aren't satisfied, please send an email to [email protected] with a copy of your receipt and I will refund you.
Do you offer a student discount?
Absolutely! Send me an email with some proof that you are a student - such as from your student email address - and I'll send you a discount code. This applies to anyone in any type of schooling, including evening classes and coding bootcamps!
Does this video series cover Flux? Redux? Fluxible? Reflux? Alt? Flummox? Marty.js? McFly? Lux? Material Flux? Nuclear.js? Fluxette? Flipity Flop? Fluppity Floop?
React is amazing in that there are many libraries that work really well with it. While those libraries are fantastic, they may add unnecessary abstractions when learning. The creator of Redux even says so.
So, this course is focused on you absolutely nailing React and walking away feeling confident in your understanding, hungry to learn and build more. Once you finish this course, you can take my free Learn Redux as a perfect next steps.
I have another question!
Sure - email me at [email protected] or give me a call 416-833-3641!