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
Isomorphic javascript in real
Search
Riccardo Maggi
May 13, 2015
Programming
1
1k
Isomorphic javascript in real
architectural overview of a working isomorphic solution plus some funny images of course
Riccardo Maggi
May 13, 2015
Tweet
Share
Other Decks in Programming
See All in Programming
Preact、HooksとSignalsの両立 / Preact: Harmonizing Hooks and Signals
ssssota
1
1.2k
Building a macOS screen saver with Kotlin (Android Makers 2025)
zsmb
1
110
ミリしらMCP勉強会
watany
4
700
AI時代のプログラミング教育 / programming education in ai era
kishida
23
21k
Being an ethical software engineer
xgouchet
PRO
0
180
PHPでお金を扱う時、終わりのない 謎の1円調査の旅にでなくて済む方法
nakka
4
1.4k
PHPer's Guide to Daemon Crafting Taming and Summoning
uzulla
2
1.2k
Firebase Dynamic Linksの代替手段を自作する / Create your own Firebase Dynamic Links alternative
kubode
0
210
Develop Faster With FrankenPHP
dunglas
2
3.1k
「影響が少ない」を自分の目でみてみる
o0h
PRO
1
570
AWS で実現する安全な AI エージェントの作り方 〜 Bedrock Engineer の実装例を添えて 〜 / how-to-build-secure-ai-agents
gawa
7
480
いまさら聞けない生成AI入門: 「生成AIを高速キャッチアップ」
soh9834
14
4.2k
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
12
1.4k
The World Runs on Bad Software
bkeepers
PRO
67
11k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
21k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
29
2k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
510
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
22
2.6k
What's in a price? How to price your products and services
michaelherold
245
12k
Designing Experiences People Love
moore
141
23k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.1k
Building an army of robots
kneath
304
45k
Practical Orchestrator
shlominoach
186
10k
Transcript
Isomorphic Javascript in the real world Cause symmetry is
cool
Agenda An implementa6on that worked Why is it
useful What is “isomorhpism”
“In mathema6cs, an isomorphism (from the Ancient Greek: ἴσος
isos "equal", and μορφή morphe "shape") is a homomorphism that admits an inverse.” Isomorphic defini6on
“In mathema6cs, an isomorphism (from the Ancient Greek: ἴσος
isos "equal", and μορφή morphe "shape") is a homomorphism that admits an inverse.” Isomorphic what?
An example CAR proper6es! I need an engine
I need a steering wheel I want to go to holiday!
This object sa6sfy my proper6es
This object sa6sfy my proper6es too!
river context An isomorphic car! road
context Proper6es always sa6sfied!
Equal Shape Equal Behavior
Do we need this?
Yes we do
I want to build some isomorphic stuff New front
end architecture Single Page Applica6on
A B C D E SPA
managing different states flow
A B C D E What
if need direct access to every state?
JSON SEO must work!
✔ ✔ What if I want to share
business logic? Shared valida<on logic Shared sor<ng algorithm
I need an isomorphic app Template rendering Business
logic Template rendering Business logic
Different Shapes Always a tomato
BL 10000 b view Ask for a page
Ask for BL data HTML builder data engine client JS app Make an interac<on ✔ Ask for BL data
<HTML> {JSON} {JSON} === How to
render data?
Where the data comes from? BE service BE
service BE service BE service Javascript Mashup orchestrator {JSON} {JSON} {JSON} {JSON} {JSON} Data engine
ExpressJS app How do we build HTML server side?
HTTP RS {JSON} Javascript Mashup orchestrator HTTP RQ HTTP RQ HTTP RS <HTML/> HTML builder
MV* JS app How do we manage interac6ons?
AJAX RS {JSON} Javascript Mashup orchestrator Catch interac<on AJAX RQ View render client JS app
Javascript Mashup orchestrator How it works
all together Express app MV* Ask for a page Ask for BL data {JSON} {JSON} Ask for BL data Make an interac<on
None
Leb over from today New way to solve
old problems No need of math PhD You can build your own
@eriol_ricca
grunQile.json bower.json A Generic Module External library
(like backbone) Venere library Venere library A Venere module
A Venere app