*** UPDATED FOR RIOT V3 ***
Go from zero to mastery in all aspects of Riot, including configuration, client & server-side rendering, routing and more.
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.
Content and Overview
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.
Basics of getting up and running with Riot.
Understand some key Riot concepts and the basic structure of Riot tag files.
An overview of using Riot with CoffeeScript, TypeScript, ES6 etc.
Basics of Riot HTML tags, including concepts like parent & child tags.
Understand conditional tag expressions like "if", "show" and "hide".
Yield nested HTML inside a Riot tag using the special Riot yield tag.
Learn to implement event handlers for user interactions like 'click', 'submit' etc.
See attached for complete list of Riot events.
Respond to Riot's own internal events like 'mount', 'unmount' etc.
Access DOM node contexts directly using the ref attribute.
An in-depth look at iterating objects and arrays inside Riot tag files.
Use Riot to turn any object into an event-emitting observable object.
A demo of Riots very simple alternative syntax for writing completely valid W3C markup.
Use the Node module to compile and serve tags from the server.
Set up the Riot project from scratch and use Bower to add dependancies.
Implement a search field using Riot event handlers and connect to an api mixin to get result.
Make the API mixin observable and implement API events for getting data from Tags.
Add a fancy CSS animation for the loading action and format the final API results on the front-end.
An overview to the changes affecting the Riot Router post version 3.
Introduction to using and configuring the built-in Riot router
Fine-tune routing by implementing route filters.
An overview of the changes to anticipate in this version 2 project.
Breaking changes affecting the project include:
Create the initial layout of the Blog app.
Display the newly created post(s) on the app homepage in basic blogroll format.
Enable individual post linking from the blogroll, to a more detailed single post view.
Adapt the 'new post' form to enable post editing on a unique route.
Implement a simple confirm/delete action on blog posts.
Stackacademy 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 have real world experience building, maintaining & improving a wide range of applications.
My courses are concise, teaches practical skills and is designed to also serve as usable future reference material.