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
38
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
87
Universal Applications
stopachka
0
64
Engineering Growth
stopachka
0
43
Universal Applications
stopachka
1
74
ES2015
stopachka
0
50
Other Decks in Technology
See All in Technology
第13回 Data-Centric AI勉強会, 画像認識におけるData-centric AI
ksaito_osx
0
360
AndroidデバイスにFTPサーバを建立する
e10dokup
0
240
テストアーキテクチャ設計で実現する高品質で高スピードな開発の実践 / Test Architecture Design in Practice
ropqa
3
710
スタートアップ1人目QAエンジニアが QAチームを立ち上げ、“個”からチーム、 そして“組織”に成長するまで / How to set up QA team at reiwatravel
mii3king
1
1.1k
Culture Deck
optfit
0
330
Datadog APM におけるトレース収集の流れ及び Retention Filters のはなし / datadog-apm-trace-retention-filters
k6s4i53rx
0
320
RSNA2024振り返り
nanachi
0
500
Ask! NIKKEIの運用基盤と改善に向けた取り組み / NIKKEI TECH TALK #30
kaitomajima
1
450
SA Night #2 FinatextのSA思想/SA Night #2 Finatext session
satoshiimai
1
100
Classmethod AI Talks(CATs) #15 司会進行スライド(2025.02.06) / classmethod-ai-talks-aka-cats_moderator-slides_vol15_2025-02-06
shinyaa31
0
170
組織貢献をするフリーランスエンジニアという生き方
n_takehata
1
1k
The 5 Obstacles to High-Performing Teams
mdalmijn
0
270
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
630
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2.1k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.5k
Gamification - CAS2011
davidbonilla
80
5.1k
KATA
mclloyd
29
14k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
Designing for humans not robots
tammielis
250
25k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
366
25k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
A designer walks into a library…
pauljervisheath
205
24k
GraphQLとの向き合い方2022年版
quramy
44
13k
Designing for Performance
lara
604
68k
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