Riot brings custom tags to all browsers, including IE8. Think React + Polymer but with enjoyable syntax and a small learning curve.
<timer>
<p>Seconds Elapsed: { time }</p>
this.time = opts.start || 0
tick() {
this.update({ time: ++this.time })
}
var timer = setInterval(this.tick, 1000)
this.on('unmount', function() {
clearInterval(timer)
})
</timer>riot.mount('timer', { start: 0 })Custom tags lets you build complex views with HTML.
<timetable>
<timer start="0"></timer>
<timer start="10"></timer>
<timer start="20"></timer>
</timetable>HTML syntax is the de facto language on the web and it's designed for building user interfaces. The syntax is explicit, nesting is inherent to the language and attributes offer a clean way to provide options for custom tags.
- Absolutely the smallest possible amount of DOM updates and reflows.
- One way data flow: updates and unmounts are propagated downwards from parent to children.
- Expressions are pre-compiled and cached for high performance.
- Lifecycle events for more control.
- No proprietary event system.
- Event normalization for IE8.
- The rendered DOM can be freely manipulated with other tools.
- No extra HTML root elements or
data-attributes. - Plays well with jQuery.
- Create tags with CoffeeScript, Jade, LiveScript, Typescript, ES6 or any pre-processor you want.
- Integrate with NPM, CommonJS, AMD, Bower or Component
- Develop with Gulp, Grunt or Browserify plugins
- Power shortcuts:
class={ enabled: is_enabled, hidden: hasErrors() }. - No extra brain load such as
render,state,constructororshouldComponentUpdate - Interpolation:
Add #{ items.length + 1 }orclass="item { selected: flag }" - Compact ES6 method syntax.
- Riot Todo MVC
- Hackernews reader
- Vuejs examples by Riotjs
- Flux-like ES6 Todo
- Simple TODO
- Timer
- Another flux demo caparable to React ones
- Various experiments
- Isomorphic application
- flux-riot todo
- Building Apps with Riot, ES6 and Webpack
- Building Apps with Riot, Babel and Browserify
- Building tabs with Riot
- The "React tutorial" for Riot
- How to package "tag libraries" in Riot
- Another React tutorial with Riot
- Riot Custom Tag by Example
- Riot Compiler Explained
- Adding compiled Riot tags to your Gulp + Browserify build
- Riot + Angular
- Module loader for WebPack
- Riot module for AngularJS
- Riot + Meteor
- Riot on CodeClimate
- Riot Snake Game
- Riot Tag Syntax Checker
Riot is made with ❤️ by many smart guys. Thanks to all the contributors
project : riotjs
repo age : 1 year, 8 months
active : 256 days
commits : 1110
files : 177
authors :
376 Tero Piirainen 33.9%
252 Gianluca Guarini 22.7%
150 Aurimas 13.5%
36 Tsutomu Kawamura 3.2%
27 Marcelo Eden 2.4%
26 rsbondi 2.3%
18 Juha Lindstedt 1.6%
18 Kalman Speier 1.6%
14 andynemzek 1.3%
11 Hrvoje Šimić 1.0%
10 Andy VanEe 0.9%
8 Mark Henderson 0.7%
7 Ashley Brener 0.6%
7 Tianxiang Chen 0.6%
6 Márcio Coelho 0.5%
6 Andreas Heintze 0.5%
6 hemanth.hm 0.5%
6 Jens Anders Bakke 0.5%
5 marciojcoelho 0.5%
5 jigsaw 0.5%
5 midinastasurazz 0.5%
4 blissland 0.4%
4 Eric Baer 0.4%
4 Giovanni Cappellotto 0.4%
4 Richard Bondi 0.4%
3 Anton Heryanto 0.3%
3 Magnus Wolffelt 0.3%
3 Jim Sparkman 0.3%
3 Alan R. Soares 0.3%
3 Tatu Tamminen 0.3%
3 korige 0.3%
3 Artem Medeusheyev 0.3%
2 Žiga 0.2%
2 Alexis THOMAS 0.2%
2 Andrew Feng 0.2%
2 Andrew Luetgers 0.2%
2 Antoine Goutagny 0.2%
2 Markus A. Stone 0.2%
2 Moot Inc 0.2%
2 Philippe CHARRIERE 0.2%
2 Sergey Martynov 0.2%
2 Simon JAILLET 0.2%
2 Steve Clay 0.2%
2 Tim Kindberg 0.2%
2 Tobias Baunbæk 0.2%
2 crazy2be 0.2%
2 jmas 0.2%
2 luffs 0.2%
2 yibuyisheng 0.2%
1 Constantin Rack 0.1%
1 Riccardo Gueli Alletti 0.1%
1 Jonny Buchanan 0.1%
1 Ryan O’Hara 0.1%
1 Sam Morgan 0.1%
1 kylobite 0.1%
1 Ari Makela 0.1%
1 Simone Vittori 0.1%
1 Steel Brain 0.1%
1 Boris Huai 0.1%
1 Steven Koch 0.1%
1 TZ | 天猪 0.1%
1 Jonathan Dumaine 0.1%
1 Tenor Biel 0.1%
1 Joel Thornton 0.1%
1 Ivan Saorin 0.1%
1 Benoit Hirbec 0.1%
1 Barkóczi Dávid 0.1%
1 Trent Ogren 0.1%
1 Ian Walter 0.1%
1 Umut Sirin 0.1%
1 Zach Aysan 0.1%
1 afc163 0.1%
1 Fernando Correia 0.1%
1 Eliseo Arias 0.1%
1 borishuai 0.1%
1 typicode 0.1%
1 Danil Semelenov 0.1%
1 Liu Jin 0.1%
1 Juwan Yoo 0.1%
1 Marcin Jekot 0.1%
1 Justin Dorfman 0.1%
1 Courtney Couch 0.1%
1 Matthew McCullough 0.1%
1 Maxence Dalmais 0.1%
1 Mike Breen 0.1%
1 xieyu03 0.1%
1 Jorrit Schippers 0.1%
1 Patrik Buckau 0.1%
1 Quim Calpe 0.1%