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
2k
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
420
YAPC::Asia 2014
zoncoen
0
2.6k
同期的にプレゼンテーションするツールをつくった話
zoncoen
1
980
Gunosy.go #4 ~ flag.go ~ #gunosygo
zoncoen
0
220
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
今年のアップデートで振り返るCDKセキュリティのシフトレフト/2024-cdk-security-shift-left
tomoki10
0
210
nekko cloudにおけるProxmox VE利用事例
irumaru
3
440
Zoneless Testing
rainerhahnekamp
0
120
これでLambdaが不要に?!Step FunctionsのJSONata対応について
iwatatomoya
2
3.7k
テストコード書いてみませんか?
onopon
2
170
採用事例の少ないSvelteを選んだ理由と それを正解にするためにやっていること
oekazuma
2
1k
PSR-15 はあなたのための ものではない? - phpcon2024
myamagishi
0
160
Semantic Kernelのネイティブプラグインで知識拡張をしてみる
tomokusaba
0
180
tidymodelsによるtidyな生存時間解析 / Japan.R2024
dropout009
1
800
menu基盤チームによるGoogle Cloudの活用事例~Application Integration, Cloud Tasks編~
yoshifumi_ishikura
0
110
Mermaid x AST x 生成AI = コードとドキュメントの完全同期への道
shibuyamizuho
0
170
Exploring: Partial and Independent Composables
blackbracken
0
100
Featured
See All Featured
A designer walks into a library…
pauljervisheath
205
24k
Speed Design
sergeychernyshev
25
670
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
29
2k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
17
2.3k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
48k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
10
810
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
BBQ
matthewcrist
85
9.4k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
GitHub's CSS Performance
jonrohan
1031
460k
Producing Creativity
orderedlist
PRO
342
39k
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