ReactJS and Flux: Learn By Building 10 Projects

Get the real world experience by building professional projects in React and Flux

3.35 (344 reviews)
Udemy
platform
English
language
Web Development
category
2,140
students
11 hours
content
Dec 2018
last update
$19.99
regular price

What you will learn

Get Conceptual understanding of ReactJS and Flux

Learn practical application of ReactJS

Learn professional tricks for smart web development

Master the latest technologies building real world projects

Description

The problem of scale and complexity creates new challenges for system designers and force us all to fundamentally innovate processes and paradigms for software creation. React and Flux are Facebook's response to their scaling problems and these technologies have opened up new avenues for all web programmers worldwide. React has become the buzzword as it provides a cool new framework to solve real world problems and if you are a web developer you must learn this amazing new technology.

This is where our Projects Using React JS and Flux course comes in. The course has been meticulously designed in a manner to help you understand the technology as well as have a little fun with them. Using 10 different projects, we will get you on board on how to use ReactJS and Flux to make your application unique, just like you!

What are ReactJS and Flux?

Created by Facebook, both technologies were designed to simplify the process of coding and making applications. ReactJS is a powerful JavaScript library that uses an XML-like syntax called JSX to describe component's DOM representations. It allows you to not only easily create interactive User Interface (UI) components, but also reuse them when needed in other projects.

On the other hand, Flux is an application architecture that is used for creating dynamic client-side JavaScript web applications and works alongside ReactJS. Flux is used to maintain a unidirectional data flow, in order to deal with scalability issues that can arise in the MVC and simplify the data flow.

The Projects Using React.JS and Flux tutorial is the perfect way to not only learn these technologies, but also understand how they can be practically applied to create applications. It will also give you a working idea of other technologies that can be used in tandem with these technologies.

In this course, you will build the following 10 projects:

Project 1 – Bootstrap React Components – This is a starter project to help you understand how to use Bootstrap to create basic React components.

Project 2 – Github Profile Viewer – Learn how to use ReactJS to create a UI and fetch data from the Github API.

Project 3 – Quick Quiz – Design a simple React quiz application

Project 4 – Movie Find – Learn how to create a movie find database that uses the OMDB API to fetch movies from the database.

Project 5 – Contact List – Create a contact list and learn how to use the Firebase database technology

Project 6 – Stickypad Notes - Create a fancy ToDo List that uses a Stickypad image for its background

Project 7 – InfoFinder Search Engine – Learn how to use the DuckDuckGo API to design a fully-functional search engine.

Project 8 – Youtube Gallery – Create a complex video gallery that allows you to add YouTube videos using just the ID of the video.

Project 9 – Socket . io Chat – Learn how to create a functional chat application that allows you to create a username and send messages back and forth over web sockets.

Project 10 – Workout Logger – Finally one of the most interesting and the most complex application in the list, this Workout Logger will have a mobile friendly interface and will also teach you how to create a local storage.

At the end of this course, not only will you have 10 functional applications ready for use, but you will also learn how to use React.JS and Flux to create interesting web and mobile applications. Enroll now and become a React and Flux wiz.

Content

Course Introduction

Introduction

Bootstrap React Components

Section Intro
Setup React & Bootstrap
Creating React Components
Component Props
Working With State
Bootstrap React Components Quiz

Github Profile Viewer

Section Intro
Files & Webpack Setup
Main App Component
Profile Component
RepoList & Repo Components
Search Component
Github Profile Viewer Quiz

Quick Quiz Application

Section Intro
App Component Setup
QuestionList & Question Component
Quiz Logic
Quick Quiz Application Quiz

MovieFind

Section Intro
Flux Structure & Gulp Part A
Flux Structure & Gulp Part B
Flux Setup & Preperation Part A
Flux Setup & Preperation Part B
SearchForm Component
Working With The API
Displaying Results
Quiz

Firebase ContactList

Section Intro
Flux Boilerplate Setup
Adding Contacts To Store
Persisting Data To Firebase
Listing & Deleting Contacts
Edit & Update Contacts Part A
Edit & Update Contacts Part B
Quiz

Stickypad Notes

Section Intro
Stickypad Boilerplate Setup
AddNoteForm Component
Add & Fetch Notes From MongoLab
Display Sticky Notes
Delete Sticky Notes
Stickypad Notes Quiz

InfoFinder Search Engine

Section Intro
InfoFinder Fluxboiler Setup
Search Form
Fetch Data From DuckDuckGo API
Display Results
InfoFinder Search Engine Quiz

Youtube Gallery

Section Intro
Boiler & Add Video Form
Persist Data To Firebase
Displaying Videos
Deleting Videos
Youtube Gallery Quiz

Socket.io Chat App

Section Intro
Webpack & React Setup
Server Connection Setup
Adding Messages
Display Messages
Username Functionality
Socket.io Chat App Quiz

Workoutlogger

Section Intro
Setup & ShowForm State
Add Workout Form
Using LocalStorage
Fetch & Display Workouts
Deleting Workouts
Workoutlogger Quiz

Course Summary

Summary
Bonus Lecture: More Interesting Stuff, Offers and Discounts

Screenshots

ReactJS and Flux: Learn By Building 10 Projects - Screenshot_01ReactJS and Flux: Learn By Building 10 Projects - Screenshot_02ReactJS and Flux: Learn By Building 10 Projects - Screenshot_03ReactJS and Flux: Learn By Building 10 Projects - Screenshot_04

Reviews

Henry
July 16, 2016
I have done other tutorials today for reactJS and they took me much longer to understand what these lectures have done in an hour.
Jamie
June 28, 2016
I'd recommend this course for anyone familiar with JavaScript and comfortable looking up technologies on their own. The instructor moves fairly quickly and glosses over a few technologies that he assumes you understand. If you don't understand them, you have to pause the video and search on your own (no hand holding). None of the technologies he skipped were very advanced, and what he does cover in depth is great. I already feel very comfortable working in React and Flux and am reusing some of the course templates in production level apps. Some people have criticized him for making several errors and having to spend video time fixing them, but I actually think it's great he shows his mistakes and you can follow real time as he fixes them.
Thomas
June 26, 2016
1) The author of this course does not visit the forums or answer any of the questions. 2) The source code for connecting to the firebase database needs to be updated.
Sean
June 2, 2016
I took this course to learn an alternative JS library to jQuery. This isn't my first course from Eduonix taught by Brad, so before I even started I knew the quality would be there. I personally enjoy Brad's tone and style more than some other instructors, and he obviously is very well versed in the subjects he teaches. I believe the skills I learn in this course will be valuable in my career.
Allison
May 29, 2016
The instructor seems a little board and moves a little fast just copying and pasting things. It also bothers me that he doesn't use his terminal to navigate. I'm just in the very beginning of the course so we will see how it goes.
Carlo
May 21, 2016
I like the step by step process as well as the hands on go along approach. Very helpful in learning the syntax and setup of React, its dependencies and dev tools.
Bennett
May 14, 2016
I'm new to this technology. The boilerplate and the 10 projects provided me real world project experience.
Ryan
May 13, 2016
Basic intro into React and Flux, some info is outdated. I would say this course is for someone who has no exposure to React or building basic apps.
Elli
April 18, 2016
One of the best ways to learn and I haven’t yet found a detailed hands-on tutorial before. Eduonix’s project based courses have always been my go for learning new technologies (I’ve also finished MongoDB, Hadoop and MeteorJS). This one was just as great as the others, if not even more so. I’m the kind of person that prefers to learn by doing and this course is perfect for me because it helps me by allowing me to actually create projects with the technology. Of course, I mess around with the coding to see what else I can create with and sometimes it actually turns out brilliantly. So, yes I would definitely recommend others who prefer to learn by doing to take this course.
James
April 7, 2016
Great! I love the working through the real-world applications! I look forward to working through all of the applications (they're very relevant)!
Pyae
March 21, 2016
Best suited for those who have basic knowledge of JavaScript, HTML. This whole course is driven by practical app development with React.js. Each section is quite interesting and easy to follow. One of the best React.js courses on Udemy.
Hussian
March 7, 2016
React is a helpful framework that can help you solve real world problems if you are a web developer. Our ReactJS and Flux tutorial has been meticulously designed to help you understand the technology as well as create practical working projects. Using 10 different projects, you will learn how ReactJS and Flux can help make your developing life easier.
FvdZ
March 3, 2016
This course is excellent for people who already know some of React and JavaScript. I like how the instructor demonstrates how to build React components and shows how to work with state and how to pass that on by props to the child components. The Flux bit isn't really explained very well but it is a good thing that we use the same template for all the projects. The instructor makes some mistakes along the way and that is just fine because then you can see how he solves them so that will help you understand everything better. For people without the basic knowledge of JavaScript and React this is not the right course to start with. I think some of the things are just not explained very well so that can be confusing for beginners.
Bill
March 2, 2016
I'm new to React.js and Flux, but I feel like I'm making some useful and relatively powerful applications through the projects. I look forward to seeing what I'm capable of building at the end of the course.
Ajinkiya
February 26, 2016
So far, I’ve only gotten through only half of the course, and for now I am really enjoying the course. The concepts have been explained in a simple manner. The instructor is clear and precise, not only explaining the concepts but also taking the time to explain the basic concepts such as props, bootstrap, different components. For now, I would recommend this course. I’ll come back and change it if there is any update.

Charts

Price

ReactJS and Flux: Learn By Building 10 Projects - Price chart

Rating

ReactJS and Flux: Learn By Building 10 Projects - Ratings chart

Enrollment distribution

ReactJS and Flux: Learn By Building 10 Projects - Distribution chart

Related Topics

764042
udemy ID
2/16/2016
course created date
8/24/2019
course indexed date
Bot
course submited by