Vzpomínáte na doby, kdy na všechno stačilo jQuery? Slavme, jsme zpátky v budoucnosti. Svět JavaScriptových knihoven a nástrojů se usadil. Poznejte a naučte se technologie, které následujících minimálně pět let budou mainstreamem. Už není třeba experimentovat, dumat jestli Ember nebo Angular nebo Meteor, odpovědí je React a Flux. Zabaleno a připraveno k použití v produkci v úplně novém Este.js - zero bus factor edition.

1. Este.js
The End of the Great Schism
daniel@steigerwald.cz

2. Why full stack development is so hard?
1. huge js fragmentation - 40% of a developers time is spent in
learning
2. permanent client/server languages/tools/libraries schizophrenia
- developer has to learn/write/change things twice!
3. endless fight against app state a structure; class model and
inheritance - 40% of a developers time is spent in debugging and
refactoring
Let's face it: We are hardly productive 10 % of our time.

3. For next several years at least.
Este.js to the Rescue.

4. Huge JavaScript fragmentation
Angular, Backbone, jQuery, Meteor, MarionetteJS, Dart, KnockoutJS,
mustache.js, Ampersand.js, Grunt, CoffeeScript, broccolijs, and
more…
Solution: Be modular, minimize vendor locks and bus
factors. Choose only well supported stuff unless you
have pretty good reason to not.

5. Mail I got recently...
"Daniel, I went away for a few weeks and when I came back my
engineers had changed us from Angular to React!
I thought you'd find this funny - as in you told me to use React
instead of Angular almost two years ago. Oh, wait, does this put us
back into the running for possibly consultancy with you?"
medium.com/este-js-framework/whats-wrong-with-angular-js-
97b0a787f903

6. ● Facebook library for building user interfaces
● Laser focused with minimal API
● Huge adoption
● Facebook is open sourcing only dog fooded stuff
There are many awesome features, but the most important is the
fact, that React replaces imperative mutated API with the
declarative API. Yes, for iOS and Android as well.
React

7. Client MVC hell
In MVC, a Model can be read by multiple Views, and can be updated by
multiple Controllers. In a large application, this results in highly
complex interactions where a single update to a Model can cause
Views to notify their Controllers, which may trigger even more Model
updates.
= hard to reason about and debug cascading changes

8. Flux
● CQS - Command Query Separation
● actions, stores, dispatcher
● unidirectional data flow
● = keeps things predictable
In Este.js, Flux is pure - no framework, no state.
nulogy.com/articles/what-the-flux
medium.com/brigade-engineering/what-is-the-flux-application-architecture-b57ebca85b9e

9. Flux Action - it's basically command design pattern.
Cimrman's sidestep: blog.confluent.io/2015/01/29/making-sense-of-stream-processing
Flux Store - reduce/sort/filter app state
Awesome combo with github.com/facebook/immutable-js. Forget about Underscore.
Flux Dispatcher - pub/sub
Flux

10. ES6/7/whatever
● JavaScript as language rocks - babeljs.io
○ Ich bin ein BabelScripter! ES6 + ES7 + JSX + Flowtypes
● npm is the largest module repository
● no dependency hell
● writing functional and async code is much easier

11. No more client/server schizophrenia
● Everybody wants server side rendering, even Angular
2 is planning it. Ember has demo already.
● Meteor is not solution. Closed ecosystems suck.
● With good design it's pretty easy.
Solution: Use one language and isomorphic approach

12. Endless fight against app state a structure

13. ● en.wikipedia.org/wiki/Elephant_in_the_room
● state is evil, state-less actions, state-less stores, CQS
○ github.com/facebook/immutable-js
● global app state with cursors
○ In Este.js, press ctrl-save-s, then console.log(_appState)
● composition over inheritace
"Inheritance locks you into the first shitty design you
come up with." Dan Abramov
Endless fight against app state a structure

14. ● App model built ad hoc, just like with TDD, but without TDD.
● DI container is workaround for distributed state in many classes
● Function > Class
● Class is piece of mutable state, and state is root of all evil.
Class and inheritance is the wrong pattern most of the
time, but the first thing people try.
Endless fight against app state a structure

15. ● live checking code syntax for JS/HTML/CSS/whatver
● eslint
● webpack React hot reload
● pendings actions
● sync/async validations
● localizations
● jest testing with automocking
● LESS, SASS, Stylus, or plain CSS with autoprefixer.
● … and much more
What else Este.js provides?

16. ● Relay - gist.github.com/wincent/598fa75e22bdfa44cf47
● js-csp - CSP channels for Javascript (like Clojurescript's core.
async, or Go)
● Leverage Webpack loaders for Clojure or PureScript or whatever.
○ twitter.com/swannodette/status/574986800466370560
● React Native and A Dynamic, Crazy, Native Mobile Future
Future

17. ● I don't see any reason to start a new project in PHP/Ruby/Whatever. Sure you can use
Clojure, Elm, or even PHP, but you must be aware of aforementioned issues.
● Don't create classes messed with state unless you have pretty good reasons to do
that. Immutability and functional programming is a thing you have to learn right now.
It's easy with Este.js
● Maybe Ember can compete, but there is huge legacy stuff.
● Este.js is now only about patterns and practices. Frameworks are dead.
● Static pages or dynamic app? False dichotomy. Now Este.js is just fine for coders as
well. Part of your app will always be static, and you can add interactivity anytime later.
No need to change stack or learn new one.
Final thoughts

18. http://javascript-skoleni.cz
I'm hiring.
twitter.com/steida