Frontend SPA Development with Reactjs

React SPA Development

Building ambicious web UIs that feel a lot like desktop application is no small feat using vanilla javascript or the good ol jQuery. Code structure, code reuse and long term code base easier maintainability are some of the major problems that developers have to deal with.

React is an extremely popular javascript library/framework that is gaining wide adoption. It was created by teams at facebook. Javascript framework generally is currently a hot topic among developers. Angular, Reactjs and Vuejs are the biggest players in this space right now, and React seem to be leading the pack at the moment.

This course does not assume any prior experience with React, but expect a good familiary with html, css and javascript basics. We will start with a good primer on javascript and walk up the chain.


  • Have a broad and thorough understanding of javascript and react.
  • Understand what it means to render a page at client instead of at the server.
  • Have the skills to build ambitious web UX/UI experience that feels like a desktop application.
what you'll be able to do

Training Schedules & Fees

Regular Training

This is designed for absolute beginners with no coding experience. This targets graduates and undergraduates, also college school-leavers that want to pursue software engineering as a career. Sessions are well spaced out to accommodate loads of practical sessions.

  • Date Jan. 31, 2020
  • Duration 6 Weeks
  • Days and Time Mondays & Tuesdays or Wednesdays & Thursdays). 10 am - 12.30 pm
  • Program Type Regular
  • Fee N150,000

Professional Training

This is designed for working professionals who want to quickly get equipped for their roles. It is a 5-day intensive, straight-to-the-point training.

  • Date Jan. 31, 2020
  • Duration 5 Days
  • Days and Time Mon - Fri. 10am - 4pm
  • Program Type Professional
  • Fee N150,000

Course Outline

Module 1: Javascript Primer with ES6

  • Introduction to Javascript
  • Your first javascript script .. Hello world!
  • Placing your js codes in html page
  • Browsers developer tools : Chrome and Firebug
  • Basic syntax - variables
  • Logging to console
  • Boolean types
  • Conditional statement - If
  • Conditional statement - If-Else
  • Comparison operators
  • Logical operators
  • Loops - While statement
  • Break and continue
  • Functions
  • Variable scope
  • Numbers and NaN(Not a number)
  • Strings
  • Arrays
  • Objects
  • Understanding 'this' keyword
  • The Date object
  • The Dom
  • Traversing the Dom
  • ES6 Additions

Module 2: Reactjs with Redux

  • Introduction to react
  • React setup with CDN
  • React component
  • state
  • React dev tools
  • Dom events
  • Changing state
  • Working with forms
  • The create react app tool
  • Creating single page apps(SPA)
  • Nesting components
  • Working with props
  • Outputing list
  • Stateless component
  • How to delete data
  • What exactly is virtual dom
  • Working with css files
  • React router extension
  • Talking to backend restful apis with axios
  • Route parameters
  • Working with redux