front-end architecture for large scale apps - gabriel zigolis
TRANSCRIPT
Gabriel Zigolis
SCALE APPSLARGE
FORARCHITECTURE
FRONT-END
Front-End Architect at Arezzo@zigolis
“Absolutely nothing”
FRONT-END
DO
ESWTFARCHITECTURE
A
DO
FIRSTword that comes to
MIND…
JAVABAD?
SOIS
WHAT’S THERESULT?OF THIS
AND?THIS
YOU ?THISKNOWDO
MATTER?ITDOES REALLY
HYBRIS
YES, IT MATTERS!
ATGWEBSPHERE
WE DEVELOP FOR
DOWHY
IE 8,9…
USERS!THEY ARE THE ANSWER.
AREZZOCUSTOMERS
AGESYSTEM
BROWSER
20~65
90%GATES 15%
IE 8~9
DOWHAT DOES IT MEAN
KNOW
YOU
?15% WEB
SELLS15$ IE
8~9
THAT'STO SUPPORT THEM
WE NEED
WH
Y
RESPONSIVE
MOBILE VERSIONOR?
SCHUTZE-COMMERCE
20% WEB
SELLS4$ MOBILE
before responsive
SCHUTZE-COMMERCE
-80%
after responsive
4$20% WEB
SELLS
REQUIRE
BROWSERIFYOR
?
Gabriel Zigolis, just a developer
“There’s no reason to compare them, they are completely different.”
Stop!
NICE TO MEET YOU
I’m re
quire
();
requirejs.org
“It's a Javascript file and module loader.Using a modular script loader like RequireJS will improve the speed
and quality of your code.”
require();
HAVING
FUN WITH
require(bodyClass);
var configMap = [module];
<body class="cart">
GOINGbeyond the wall!!!
COMMON
JSFILES
require(general);
var configMap = [general];
define (general, []);
DEMANDJS O
N
LET’S in small pieces…THINK
Gabriel Zigolis, just a developer
“It makes a lot of sense to only load fileswhen the user require them.”
Think!
var configMap = [delivery];
NEED TO WE
CODE!!!
BACKBONE JS
ANGULAR JSOR?
Gabriel Zigolis, just a developer
“It's so personal that becomes stupid to start an argument about it.”
Bullshit!
backbonejs.org
“Gives structure to web applications by providing models, collections and views to consume API over
a RESTful JSON interface.”
CHARACTERISTICS
• Powerful Javascript LIB
• Adaptable, inspired on MV* pattern
• Modern, widely used in SPA
• Completely skinny, bitch! Just 7.3kb (1.2.0)
USE WHY
BACKBONE?or any other lib, framework…
BECAUSEAPPS TH
E
GREW UP
NEEDING
OrganizationArchitecture
Modularization
MORE
Backbone Cart();
Instancing features!
WHERE IS
THEDELIVERY
?
Delivery on demand!
Backbone DeliveryView();
Backbone DeliveryModel();
Backbone Rocks!!!
WE do more…CAN
OR?
Gabriel Zigolis, just a developer
“Man, it’s up to you!”
Really, again?
BACKBONE VIEW
REACTOR?
Let’s talk!
Gabriel Zigolis, just a developer
“There is no magic or perfect solution,just your necessity and sense!”
What’s the idea?
Gabriel Zigolis
@zigolis