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
The Road to Node
Search
Guille Paz
October 28, 2017
Programming
0
210
The Road to Node
The Road to Node (at a big company).
Guille Paz
October 28, 2017
Tweet
Share
More Decks by Guille Paz
See All by Guille Paz
No me robes el Scroll!
pazguille
0
190
User First
pazguille
1
170
#OfflineFirst
pazguille
3
5.8k
ES6 in Production
pazguille
10
3k
No me hagas esperar!
pazguille
1
130
CSS Sprites vs. Data URIs
pazguille
0
390
Hello, Style Guides!
pazguille
0
220
Decoupling your JavaScript
pazguille
0
140
Progressive Enhancement - Is it still important?
pazguille
0
98
Other Decks in Programming
See All in Programming
たのしいSocketのしくみ / Socket Under a Microscope
coe401_
8
1.4k
一休.com のログイン体験を支える技術 〜Web Components x Vue.js 活用事例と最適化について〜
atsumim
0
1k
DRFを少しずつ オニオンアーキテクチャに寄せていく DjangoCongress JP 2025
nealle
2
280
Djangoにおける複数ユーザー種別認証の設計アプローチ@DjangoCongress JP 2025
delhi09
PRO
4
490
dbt Pythonモデルで実現するSnowflake活用術
trsnium
0
260
TCAを用いたAmebaのリアーキテクチャ
dazy
0
180
How mixi2 Uses TiDB for SNS Scalability and Performance
kanmo
41
16k
生成AIで加速するテスト実装 - ロリポップ for Gamersの事例と 生成AIエディタの活用
kinosuke01
0
130
SwiftUI移行のためのインプレッショントラッキング基盤の構築
kokihirokawa
0
130
責務と認知負荷を整える! 抽象レベルを意識した関心の分離
yahiru
8
1.3k
CSS Linter による Baseline サポートの仕組み
ryo_manba
1
150
ソフトウェアエンジニアの成長
masuda220
PRO
12
2.1k
Featured
See All Featured
Done Done
chrislema
182
16k
Code Reviewing Like a Champion
maltzj
521
39k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
What's in a price? How to price your products and services
michaelherold
244
12k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
114
50k
Docker and Python
trallard
44
3.3k
Music & Morning Musume
bryan
46
6.4k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Designing Experiences People Love
moore
140
23k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
193
16k
Transcript
The Road to Node at a big company
- I’m Guille Paz - Frontend developer - Tech Lead
at Mercado Libre @pazguille (twitter / github) Hi!
Mercado Libre
Largest e-commerce ecosystem in Latin America
None
~ 1500 developers
~ 1500 developers ~ 4600 repositories
~ 1500 developers ~ 4600 repositories ~ 300 deploys per
day
~ 1500 developers ~ 4600 repositories ~ 300 deploys per
day ~ 800 frontend apps
~ 1500 developers ~ 4600 repositories ~ 300 deploys per
day ~ 800 frontend apps ~ 3 Million rpm
~ 1500 developers ~ 4600 repositories ~ 300 deploys per
day ~ 800 frontend apps ~ 3 Million rpm ~ 900 coffees per day
Back to 2016
Frontend Frontend developers Backend developers
Frontend
Frontend Access Data UI Logic Business Logic Build assets Auth
i18n e2e testing ...
TOO many Technologies
TOO many Responsibilities
It’s a kilombo!
“The world is changing and we must change with it.”
- Ragnar Lothbrok
Hey Guille, coffee? Hey, what's happened? Nothing, just running grails
run-app... Sure! I have 10-15 mins.
New Team Frontend Core
We made Big decisions!
Node is the new UI Layer
Frontend Middleend UI Layer Business Logic
Frontend API API Middleend
Frontend API API Middleend Mobile Native
None
The new frontend stack
None
LTS version
None
None
None
ES6 Modules vs CommonJS
None
None
Use ES Features and don’t transpile the server.
node.green
None
six-speed
None
Use ES Stable Features and don’t transpile the server.
None
Shared Version
Default Middlewares
Authentication Device Detection Security Default Middlewares
Default Routes (“/ping”)
An Express Instance on Steroids
Routers (“mini-applications”)
Start Server (development vs production)
None
Using React Is A Business Decision, Not A Technology Choice.
- Eric Baer
Server-Side Rendering
React on the Server
Only transpile JSX in runtime
JSX (template engine)
res.render(‘View.js, props);
None
Render React Middleware
Override res.render( ).
res.render(<View />, props);
Universal UI Components
Universal Views
React on the Server & Client
None
Hey Guille, coffee? Hey, what's happened? Nothing, just running npm
install... Sure! I have 2-3 mins.
None
None
nordic & nordic-dev packages
None
None
react-router on the server
None
None
react-router@3.0.3
async hooks (onEnter ) are defined globally
None
None
process.env
It’s not a normal JavaScript object...
Server rendering is slower...
cache all the values!
React 16
Takeaway
⇢ Knows your dependencies ⇢ Node is the new UI
Layer ⇢ New roles and responsibilities ⇢ ~ 126 coffees per day (86% real) ⇢ Today we feel like...
None
None
Thank you! @pazguille