The Road to Node (at a big company).
The Road to Nodeat a big company
View Slide
- I’m Guille Paz- Frontend developer- Tech Lead at Mercado Libre@pazguille (twitter / github)Hi!
Mercado Libre
Largest e-commerceecosystem inLatin America
~ 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 to2016
FrontendFrontenddevelopersBackenddevelopers
Frontend
FrontendAccess DataUI LogicBusiness LogicBuild assetsAuthi18ne2e testing...
TOO manyTechnologies
TOO manyResponsibilities
It’s akilombo!
“The world is changingand we must changewith it.”- Ragnar Lothbrok
Hey Guille, coffee?Hey, what's happened?Nothing, just runninggrails run-app...Sure! I have 10-15 mins.
New TeamFrontend Core
We madeBig decisions!
Node is the newUI Layer
Frontend MiddleendUI Layer Business Logic
Frontend APIAPIMiddleend
Frontend APIAPIMiddleendMobile Native
The new frontend stack
LTS version
ES6 ModulesvsCommonJS
Use ES Featuresand don’t transpilethe server.
node.green
six-speed
Use ES Stable Featuresand don’t transpilethe server.
Shared Version
Default Middlewares
AuthenticationDevice DetectionSecurityDefault Middlewares
Default Routes(“/ping”)
An Express Instanceon Steroids
Routers(“mini-applications”)
Start Server(development vs production)
Using React Is ABusiness Decision,Not A TechnologyChoice.- Eric Baer
Server-SideRendering
React onthe Server
Only transpile JSXin runtime
JSX(template engine)
res.render(‘View.js, props);
Render ReactMiddleware
Override res.render( ).
res.render(, props);
Universal UIComponents
UniversalViews
React on theServer & Client
Hey Guille, coffee?Hey, what's happened?Nothing, just runningnpm install...Sure! I have 2-3 mins.
nordic & nordic-devpackages
react-routeron the server
[email protected]
async hooks (onEnter )are defined globally
process.env
It’s not a normalJavaScript object...
Server rendering isslower...
cacheall 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...
Thank you!@pazguille