Master Riot: Learn Riot.js from Scratch
4.8 (49 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
173 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Master Riot: Learn Riot.js from Scratch to your Wishlist.

Add to Wishlist

Master Riot: Learn Riot.js from Scratch

Go from zero to Master with the React-inspired, Riot.js library. A powerful, yet flexible, javascript view layer.
4.8 (49 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
173 students enrolled
Created by Ray Viljoen
Last updated 11/2016
English
Current price: $10 Original price: $65 Discount: 85% off
1 day left at this price!
30-Day Money-Back Guarantee
Includes:
  • 2.5 hours on-demand video
  • 22 Supplemental Resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Have a coupon?
What Will I Learn?
Create customised Riot implementations specific to the project they are working on.
Understand, in depth, each individual aspect of the Riot API.
Have the know-how to implement Riot in practical ways to build rich, real-world web applications.
Know how to use Riot both client-side & server-side.
Implement dynamic HTML5 routing, using the built-in Riot router.
Write more logical & modular Javascript via simple Riot design principles.
View Curriculum
Requirements
  • Good understanding of the basic of Javascript.
  • Have a simple text editor with some syntax highlighting.
  • Basic knowledge of HTML is required.
  • Pre-installing Node.js would be advantageous, but is not required.
Description

Learn to create rich web applications using the Riot javascript library.

Go from zero to mastery in all aspects of Riot, including configuration, client & server-side rendering, routing and more.

Master Riot is suited to both complete newcomers to Riot, and advanced Javascript developers looking to quickly and efficiently add Riot to their arsenal.

  • Learn to set up a base Riot configuration according to your project needs
  • Understand the entire Riot API in depth
  • Configure HTML5 routing and route filtering
  • Integrate Riot in more advanced server-side projects
  • Be more creative with your code via Riot’s flexible approach

An incredibly powerful library to know for any Javascript developer.

Javascript is hands-down the fastest growing programming language, and Riot is an invaluable skill for any developer with existing Javascript knowledge.

Riot will enable developers to create rich, powerful web applications without the steep learning curve of React or Angular, and also works exceptionally well as a view layer for native mobile & desktop apps, through the use of technologies such as Phonegap and Electron.

This course will allow Javascript developers to use Riot to it’s full potential and go from complete Riot novice to an an advanced level as quickly as possible.

Content and Overview

This course comprises of 25+ concise video lessons designed to make learning Riot as quick and efficient as possible. The course is suited to anyone with a good understanding of the Javascript programming language.

Absolutely no knowledge of any other Javascript libraries is required, although a basic grasp of Node.js would be helpful for a small section of the course.

The course starts by looking at the different variations of the Riot library, different compilation options and the basics of Riot’s tag syntax.

The next section, which forms the bulk of the course, takes an in-depth look at each individual aspect of the Riot API, including concepts such as styling, looping and handling user interactions.

After mastering the API, the course will move to using Riot on the server (Node.js) and then teach you how to configure and use the Riot router for creating rich, routable web apps.

The final section of the course is a practical project which will put all the previous lessons’ knowledge to use in a real-world web app.

Completing this course will allow you to start creating practical Riot-based web/mobile apps immediately.

All the lessons are designed to be as concise as possible and the course focuses on learning in a practical way.

Who is the target audience?
  • This course is designed for developers with some experience of writing dynamic Javascript and basic working knowledge of HTML5 and CSS.
  • It is also ideal for existing React developers , looking to learn Riot as a leaner, more flexible alternative.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 28 Lectures Collapse All 28 Lectures 02:43:47
+
Introduction
3 Lectures 08:01

Why you would want to use Riot, what it aims to provide as a view layer and how it compares to alternative Javascript frameworks, such as React & Polymer.

Preview 03:00

Overview of lessons' structure & tools used in the lectures.

Lesson Structure
03:32
+
Getting Started
3 Lectures 23:16

Basics of getting up and running with Riot.

  • Different Riot library versions
  • Compilation options
  • Mounting your first Riot tag
Setting up a Riot project
09:49

Understand some key Riot concepts and the basic structure of Riot tag files.

Syntax & Structure
10:30

An overview of using Riot with CoffeeScript, TypeScript, ES6 etc.

Pre-processors
02:57
+
Core / API
11 Lectures 01:00:55

Basics of Riot HTML tags, including concepts like parent & child tags.

Tags
06:48

Style Riot components with modular, scoped CSS.

Preview 04:00

Understand conditional tag expressions like "if", "show" and "hide".

Conditionals
02:53

Yield nested HTML inside a Riot tag using the special Riot yield tag.

Yielding
05:24

Access DOM node contexts directly using name and id attributes.

Named Elements
02:47

Learn to implement event handlers for user interactions like 'click', 'submit' etc.

See attached for complete list of Riot events.

Event Handlers
10:21

Respond to Riot's own internal events like 'mount', 'unmount' etc.

Events
06:05

An in-depth look at iterating objects and arrays inside Riot tag files.

Loops
09:40

Learn how to share functionality across your Riot tags with powerful mixins.

Preview 06:03

Use Riot to turn any object into an event-emitting observable object.

Observables
05:31

A demo of Riots very simple alternative syntax for writing completely valid W3C markup.

Writing Valid W3C Markup
01:23
+
Routing
2 Lectures 12:55

Introduction to using and configuring the built-in Riot router

Basic Routing
07:50

Fine-tune routing by implementing route filters.

Route Filtering
05:05
+
Server-Side
2 Lectures 11:42

Use the Node module to compile and serve tags from the server.

Rendering Pre-Compiled Tags
07:00

Watch and compile Riot tags during development for serving pre-compiled Javascript tag files.

Manuel Pre-Compilation
04:42
+
Build a Riot Blog app
7 Lectures 46:58

Create the initial layout of the Blog app.

Project Setup
05:56

Create and persist a blog post.

Preview 13:32

Display the newly created post(s) on the app homepage in basic blogroll format.

Implement a Blogroll
08:54

Enable individual post linking from the blogroll, to a more detailed single post view.

Single Post View
05:48

Adapt the 'new post' form to enable post editing on a unique route.

Editing Posts
08:10

Implement a simple confirm/delete action on blog posts.

Delete Posts
04:05

Outro
00:33
About the Instructor
Ray Viljoen
4.6 Average rating
298 Reviews
2,042 Students
3 Courses
Courses Designed for Learning Efficiency.

Stackacademy.tv provides high-quality Courses for Developers, with learning-efficiency as the #1 priority.

My name is Ray Viljoen,
I have 9 years experience as a Full Stack Developer and I am 100% self-taught.

My courses are concise, teaches practical skills and is designed to also serve as usable future reference material.