
Explore React from setup to rendering in seven chapters, covering jsx, components, state, props, data binding, ajax with jQuery, flux, and a Get hub profiles project.
React is an open-source JavaScript library for building dynamic web interfaces, focusing on the view, enabling fast, one-way data flow with a component-based architecture and a virtual DOM.
Prepare your react development environment by installing Sublime Text, node and npm, no js, express, get bash, and react developer tools, then create a cross-platform project workspace.
Build an express web server to serve static files from a client folder. Initialize npm to create package.json and install express and body-parser, then start the server on port 3000.
Explore the basics of react syntax and JSX, a markup extension, and convert GSX to JavaScript as you type while building a messaging component with a form and event handling.
Discover how gsx, a javascript syntax extension for React, transforms into javascript for rendering with React.createElement, including class name handling.
Create a simple hello message component in React, learn to set up project files, include scripts and Babel, render with props, and handle events.
Develop a React registration form component with Bootstrap styling, using an on submit handler to prevent default and access input values via refs, introducing simple validation and basic state handling.
Learn to build a form with validation in React by managing state, implementing a register function, and rendering a reusable alert box with dynamic message and bootstrap styles.
Explore React lifecycle methods and component specifications, and learn how actions trigger lifecycles. Discover properties, states, and validation to manage application components and state in React.
Explore React lifecycle methods and component specifications, including get default props, get initial state, and render, with practical demos and a simple component experiment.
Master react props and their validation to create configurable, nestable user interface elements. Define prop types, required props, enums, arrays, objects, defaults, and how to transfer props.
Learn how to work with state in React, using setState and replaceState, manage navigation, initial state, and render updates to the ui based on state changes.
Explore isomorphic JavaScript with React's server and client rendering, build an API with Node.js and Express to serve JSON, and fetch, post, and display data in the UI using AJAX.
Set up a node and express server to serve a products.json data file, expose GET /api/products and POST /api/products, and read/write via fs, tested with Rest Easy.
Fetch product data from a server using ajax in a React app, wiring a products component to form and list subcomponents, with getInitialState, componentDidMount, and setState for updates.
Fetch data via ajax in a React app by mapping product data from props to a product component and rendering a responsive two-column layout with images and descriptions.
Create a two-column product form beside the list, building a bootstrap form with id, name, description, price, and image, and handle submit to gather fields and validate.
Handle product form submission by capturing fields, clearing them, and posting data via ajax to update the products state with the new product.
Explore the chapter intro on add-ons for reach out, previewing animation, two way data binding, cloning, and key fragments.
Explore how React add-ons extend ReactJS with animation through transition groups, two-way data binding with React Link, and immutability helpers like update.
Create a client-side task list in React, using React add-ons and CSS transitions via a Transition Group to animate tasks as they enter and exit.
Implement a dynamic React task list with add and remove actions, animate items using css enter/leave transitions and opacity timing, and address render deprecation.
Explore two-way data binding in React using React Link to keep state and the DOM in sync, enabling real-time updates while contrasting with React's one-way data flow.
Explore how to run react on a node.js server with express, install react on the server, and use gulp and browserify for packaging, plus a quick flux overview.
Set up React on the server by installing React, React-DOM, Babel, and Express Handlebars, and render components to HTML strings via a server route.
Explore a gulp and browserify workflow to run react on the client, using server side modules in the browser, transforming GSX files with reactify and outputting to dist/js.
Learn to implement a gulp and browserify workflow for a React project, define tasks, run and watch scripts, build a Shellback component, and render with React DOM.
Explore the Flux architecture for React, a design pattern that supports one-way dataflow, including actions, dispatcher, stores, and controller views, and see how data flows through the components.
Build a GitHub data API powered profile app that fetches user data and repositories, displays the profile and repos, and adds a username search feature with state and property management.
Create a React app that fetches GitHub user profiles and repositories using the GitHub API, register a developer application, and include the client id and client secret in AJAX calls.
Fetch GitHub user data with an ajax call, pass it to a user data component, and render avatar, name, location, email, and stats (repos, followers, following) with Bootstrap styling.
Learn to fetch a GitHub user's repositories via ajax, paginate with per_page, sort by date, store as repo data, and render a responsive list of repo items with links.
Build a React search form to query GitHub users, display the user's data and repositories, and refresh results by submitting the form while managing state and conditional rendering.
ReactJS is the powerful JavaScript library created by Facebook to handle user interfaces for web applications. It allows developers to handle the major challenges faced while building user interface for dynamic web applications. It is one of the hottest technology on the block and is essential for any web developer. The react handles only the view of the MVC pattern and can be used together with other back end frameworks such as Angular and Node. You can also use React addons to build non UI parts in react. This technology has been widely used across industry and sites like AirBnB, Imgur and Feedly are actively using it.
You will learn the following along with course:
Concepts of front end UI development with ReactJS
View rendering process and application techniques
JSX syntax
JavaScript Concepts
Virtual DOM
Application component reusability
UI Design Concepts
Use React with backend technologies like NodeJS and ExpressJS
The course is our attempt to bring together a complete , professional and practical course for any developer who wants to build web apps using ReactJS. Get started and be the ReactJS guru.