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
Perl でも React.js の server-side rendering がしたい! ...
Search
zoncoen
June 24, 2015
Programming
0
2.1k
Perl でも React.js の server-side rendering がしたい! / perl meets javascript with reactjs
Gotanda.pm#5 LT 資料
zoncoen
June 24, 2015
Tweet
Share
More Decks by zoncoen
See All by zoncoen
About Merpay Engineering Productivity Team
zoncoen
0
1.7k
Perl の HTTP/2 事情 / HTTP2 in Perl
zoncoen
0
450
YAPC::Asia 2014
zoncoen
0
2.6k
同期的にプレゼンテーションするツールをつくった話
zoncoen
1
990
Gunosy.go #4 ~ flag.go ~ #gunosygo
zoncoen
0
230
Gunosy.go #3 ~ expvar.go ~ #gunosygo
zoncoen
1
720
初心者がGoでpercol実装してみた話 / Golang + Reveal.js + Websocket で同期的にプレゼンテーションしたい #hikarie_go
zoncoen
0
2.5k
Other Decks in Programming
See All in Programming
Ruby on Railroad: The Power of Visualizing CFG
ydah
0
300
Vibe Coding の話をしよう
schroneko
14
3.7k
エンジニア向けCursor勉強会 @ SmartHR
yukisnow1823
3
12k
大LLM時代にこの先生きのこるには-ITエンジニア編
fumiyakume
8
3.3k
Cursorを活用したAIプログラミングについて 入門
rect
0
170
The Missing Link in Angular’s Signal Story: Resource API and httpResource
manfredsteyer
PRO
0
140
By the way Google Cloud Next 2025に行ってみてどうだった
ymd65536
0
120
REALITY コマンド作成チュートリアル
nishiuriraku
0
120
Making TCPSocket.new "Happy"!
coe401_
1
3.3k
iOSアプリで測る!名古屋駅までの 方向と距離
ryunakayama
0
150
UMAPをざっくりと理解 / Overview of UMAP
kaityo256
PRO
3
1.5k
ぽちぽち選択するだけでOSSを読めるVSCode拡張機能
ymbigo
13
5.9k
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
223
9.6k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.4k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Six Lessons from altMBA
skipperchong
28
3.8k
How STYLIGHT went responsive
nonsquared
100
5.5k
VelocityConf: Rendering Performance Case Studies
addyosmani
329
24k
KATA
mclloyd
29
14k
A Tale of Four Properties
chriscoyier
159
23k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.5k
The World Runs on Bad Software
bkeepers
PRO
68
11k
Bash Introduction
62gerente
612
210k
Transcript
Perl Ͱ React.js ͷ server-side rendering ͕͍ͨ͠ʂ Gotanda.pm #5 @zoncoen
ͱ͍͏ਓ͍Δ͔͠Εͳ͍ ʢੈք͍ʣ
Ͱ͖ΔΑ
What is React.js • JavaScript view library • Facebook
Why server-side rendering? • ॳظϩʔυ࣌ؒͷվળ • SEO ! React.js ରԠͯ͠Δ
• React.renderToString() • ReactElement ͷ initial HTML Λฦ͢ with Node.js
web server React.renderToString(React.createElement(MyClass, {data: data})); <div data-reactid=".1emne5x67eo" data-react-checksum="154602720"></div>
with other languages • Ruby (on Rails): react-rails ! •
Python: python-react ! → ֤ݴޠ͔Β JavaScript ͷؔΛ࣮ߦ react_component('MyComponent', {data: data}, {prerender: true}) render_component('my-component.jsx', {'data': data}, to_static_markup=true)
Perl ͰΕΔʢͣ | ͖ʣ
How to implement • renderToString() ͷ࣮ߦ݁Ռ͕͋Ε͍͍ → Perl ͔Β JavaScript
ͷؔΛ࣮ߦ
JavaScript::V8 • Perl interface to the V8 JavaScript engine •
Latest version released on 28 Dec 2012 … ! • ͱΓ͋͑ͣ V8 v3.14.5.8 Ͱಈ͘͜ͱΛ֬ೝ
Example #!/usr/bin/env perl use strict; use warnings; use utf8; !
use JavaScript::V8; ! my $context = JavaScript::V8::Context->new(); ! my $result = $context->eval(q| (function () { return 'Hello, JavaScript world!'; })(); |); ! print "$result\n";
Demo https://github.com/zoncoen-sample/reactjs_server-side- rendering_with_perl