Universal React with Electrode
3.4 (5 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
67 students enrolled

Universal React with Electrode

Learn to develop large scale, search engine friendly, and modern universal web apps with Electrode
3.4 (5 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
67 students enrolled
Last updated 1/2020
English
Current price: $62.99 Original price: $104.99 Discount: 40% off
2 days left at this price!
30-Day Money-Back Guarantee
This course includes
  • 1.5 hours on-demand video
  • 1 article
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Large scale Universal App development
  • Web development with React
  • NodeJS and its HapiJS server framework
  • CSS modules via PostCSS
  • Asynchronous API calls in React via Axios
  • App deployment on Heroku cloud platform
  • Server side rendering of React Apps
  • Electrode framework for universal app development
  • Advantages of server side rendered apps over Client-side only rendered (single page) apps
  • Using the NewsAPI to fetch live news items
Requirements
  • Basic understanding of ReactJS
  • Basic understanding of HTML
  • Basic understanding of CSS
Description

Single page apps using React without server side rendering are NOT search engine friendly. The Electrode open source platform provides an easy way to build large scale universal web apps making your sites incredibly fast and search engine friendly. This open source framework is supported by WalmartLabs and therefore updates and improvements are guaranteed in the future to further improve your website.

Learn how to use thi powerful framework to build your large scale modern web apps.

Who this course is for:
  • Beginner to advanced web developers
Course content
Expand all 19 lectures 01:42:35
+ Introduction and Setting up
3 lectures 15:30

Introduces the course and major concepts that will be learned.

Preview 05:35

Install NodeJS, NPM and Electrode platform.

Create initial app using the Electrode app archetype

Preview 04:20

Remove code relevant only for sample app and prepare to build up the application.

Cleaning up sample project
05:35
+ Building the news feed viewer
14 lectures 01:21:35

Start implementing the sidebar in ReactJS

Create categories sidebar
05:52

Add classes to sidebar elements, learn how to add classes the Electrode way to allow CSS modules to work.

Styling the sidebar
07:35

More styling of the sidedar.

Learn CSS

Styling the sidebar continued
07:25

Learn routing in ReactJS via React router

Adding multiple paths to route
02:40
Determine clicked route in content
06:41
Getting the NewsAPI key and request URL
01:45
Axios for fetching backend data
03:18
Set category and news item list
03:21
Get and update news articles
06:47
Display news title and content
06:37
Match URL with active sidebar link
09:20
Clean up news content view
05:22

Learn how using Electrode to build your universal web apps helps to optimize for search engines with little effort.

How SSR enhances our web app
07:31

The main components of the Electrode server platform explained.

Preview 07:21
+ Deploying app online
2 lectures 05:29

Create Heroku and GitHub account.

Install Heroku CLI and deploy app to Heroku for free.

Steps to deploy app on Heroku
05:27
Resources
00:02