Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ES2015 & React
Search
Stepan Parunashvili
December 18, 2015
Technology
0
36
ES2015 & React
Talk on ES2015, and react at futureadvisor
Stepan Parunashvili
December 18, 2015
Tweet
Share
More Decks by Stepan Parunashvili
See All by Stepan Parunashvili
Scaling React Applications
stopachka
2
86
Universal Applications
stopachka
0
62
Engineering Growth
stopachka
0
42
Universal Applications
stopachka
1
71
ES2015
stopachka
0
48
Other Decks in Technology
See All in Technology
AIとともに歩んだライブラリアップデートの道のり/ vue-fes-japan-2024-link-and-motivation
lmi
2
2.5k
Demystifying Vite Internals
nozomuikuta
3
920
WebRTC と AI の組み合わせ
tnoho
0
390
40代後半で開発エンジニアからクラウドインフラエンジニアにキャリアチェンジし、生き残れる自信がようやく持てた話
iwamot
9
8.3k
全部見せます! BigQueryのコスト削減の手法とその効果 / BigQuery Cost Reduction Methods
shiozaki
1
150
The road to green code (with Sonar)
bluehats
0
190
dbt-coreで実現するCore DataMartsのデータモデリング〜dbt編〜 / Core DataMarts Modeling with dbt-core
i125
0
180
本番のトラフィック量でHudiを検証して見えてきた課題
joker1007
2
290
Nuxt × Vue Router の力を最大限に引き出す機能を紹介
ytr0903
2
480
生成AIの活用パターンと継続的評価
asei
6
660
AWS Step Functionsのタスク入出力に秩序を与えよう
haku__hime
0
140
人工衛星開発のための C2A フレームワークとその開発体験
sksat
1
120
Featured
See All Featured
Rails Girls Zürich Keynote
gr2m
93
13k
Intergalactic Javascript Robots from Outer Space
tanoku
268
27k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
92
16k
Designing for Performance
lara
604
68k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
167
49k
Put a Button on it: Removing Barriers to Going Fast.
kastner
58
3.5k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
5
130
Designing for humans not robots
tammielis
249
25k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
504
140k
Documentation Writing (for coders)
carmenintech
65
4.4k
Fantastic passwords and where to find them - at NoRuKo
philnash
50
2.8k
Ruby is Unlike a Banana
tanoku
96
11k
Transcript
() => <React /> Stepan Parunashvili 1
2
No more waiting 3
Babel $ npm install -g babel-cli 4
ES2015 5
Arrow Functions () => 6
7
8
9
10
11
Classes class Component {} 12
13
14
15
16
Modules import User from 'user' 17
18
19
Larger Standard Library Map, Set, WeakMap, Promise... 20
Smarter Object Expressions {users} 21
22
23
24
25
26
Destructuring in arguments ({name, friends}) => console.log(name, friends) 27
28
29
30
31
Default Arguments (name = 'Bob') => console.log(name) 32
33
34
Template Strings `hello ${name}` 35
36
37
More destructuring var [first, ...rest] = users 38
39
40
41
42
43
Splat addFriends(...friends) 44
45
46
47
48
49
Block scoping: let & const let i = 0; 50
51
52
53
54
55
56
Symbols Iterators Generators 57
Async / Await var users = await getUsers(); 58
59
60
61
62
63
<React /> 64
65
Declarative > Imperative {opened ? <FriendList /> : null} 66
67
68
69
70
71
72
increment append, decrement, replace 73
Now... 74
75
76
77
78
79
Instead... 80
(data) => markup 81
82
83
84
85
Composability friends.map(friend => <Info friend={friend} />) 86
87
88
89 http://handlebarsjs.com/expressions.html
90
Separation of Concerns? 91
Coupling vs Cohesion 92
Cohesion <button onClick={this._handleClick}>Click me</button> 93
94
95
ui logic + markup are cohesive 96
97
Unit testing 98
Reusability 99
100
101
But, large apps are large 102
Keep components small 103
Keep state in a single place 104
Optimize last 105
Use Immutable Data Structures 106
107
108
109
110
111
112
There's more 113
flow redux hot reloading 114
thank you :) 115