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
2.2k
0
Share
Perl でも React.js の server-side rendering がしたい! / perl meets javascript with reactjs
Gotanda.pm#5 LT 資料
zoncoen
June 24, 2015
More Decks by zoncoen
See All by zoncoen
About Merpay Engineering Productivity Team
zoncoen
0
1.9k
Perl の HTTP/2 事情 / HTTP2 in Perl
zoncoen
0
500
YAPC::Asia 2014
zoncoen
0
2.7k
同期的にプレゼンテーションするツールをつくった話
zoncoen
1
1k
Gunosy.go #4 ~ flag.go ~ #gunosygo
zoncoen
0
250
Gunosy.go #3 ~ expvar.go ~ #gunosygo
zoncoen
1
760
初心者がGoでpercol実装してみた話 / Golang + Reveal.js + Websocket で同期的にプレゼンテーションしたい #hikarie_go
zoncoen
0
2.6k
Other Decks in Programming
See All in Programming
OSもどきOS
arkw
0
280
バックエンドにElysiaJSを採用して気付いた、良い点・悪い点
wanko_it
1
190
[2026年度第1回ORセミナー] 計画最適化ベンチャーと競技プログラミング人材
terryu16
0
120
Inside Stream API
skrb
1
360
TSKaigi 2026 TypeScriptバックエンドのオブザーバビリティ戦略 — Datadog × NestJSの実践
taiseiyamamotoan
1
210
iOS26時代の新規アプリ開発
yuukiw00w
0
210
分析エージェント精度向上における データアナリストの役割
oura_shoya
0
140
1人1案件のプロダクトエンジニア時代に、"プロセス監督"としてチャレンジしたこと
non0113
0
350
Migrations : C'est une question d'hygiène !
vinceamstoutz
0
2.5k
Transactional Change Stream Processing With Debezium and Apache Flink
gunnarmorling
1
140
LLM Plugin for Node-REDの利用方法と開発について
404background
0
140
不変条件と整合性境界—ビジネスが決める設計判断と実現パターン / Invariants and Consistency Boundaries
nrslib
11
3k
Featured
See All Featured
What’s in a name? Adding method to the madness
productmarketing
PRO
24
4.1k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
290
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.8k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
Mind Mapping
helmedeiros
PRO
1
210
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
350
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.3k
Producing Creativity
orderedlist
PRO
348
40k
Claude Code のすすめ
schroneko
67
220k
YesSQL, Process and Tooling at Scale
rocio
174
15k
Between Models and Reality
mayunak
4
310
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
710
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