dodaiのアーキテクチャ(build編) Main Process .tsx Original Files HTMLファイル 最終成果物 (./dist/*) 画像や robots など Reactのための中間成果物 (./.dodai-build/*) .js File System Program
dodaiのアーキテクチャ(build編) Main Process .tsx Original Files ① Compiler API で Call HTMLファイル 最終成果物 (./dist/*) 画像や robots など File System Program Reactのための中間成果物 (./.dodai-build/*) .js
dodaiのアーキテクチャ(build編) Main Process .tsx Original Files ① Compiler API で Call ② トランスパイル HTMLファイル 最終成果物 (./dist/*) 画像や robots など File System Program Reactのための中間成果物 (./.dodai-build/*) .js
dodaiのアーキテクチャ(build編) Main Process .tsx Original Files ① Compiler API で Call ② トランスパイル ③ 成果物を書き出し HTMLファイル 最終成果物 (./dist/*) 画像や robots など File System Program Reactのための中間成果物 (./.dodai-build/*) .js
dodaiのアーキテクチャ(build編) Main Process .tsx Original Files ① Compiler API で Call ② トランスパイル ③ 成果物を書き出し ④ rendertoStaticMarkup HTMLファイル 最終成果物 (./dist/*) 画像や robots など File System Program Reactのための中間成果物 (./.dodai-build/*) .js
dodaiのアーキテクチャ(build編) Main Process .tsx Original Files ① Compiler API で Call ② トランスパイル ③ 成果物を書き出し ④ rendertoStaticMarkup ⑤ JS として import HTMLファイル 最終成果物 (./dist/*) 画像や robots など File System Program Reactのための中間成果物 (./.dodai-build/*) .js
dodaiのアーキテクチャ(build編) Main Process .tsx Original Files ① Compiler API で Call ② トランスパイル ③ 成果物を書き出し ④ rendertoStaticMarkup ⑤ JS として import ⑥ string で結果を返却 HTMLファイル 最終成果物 (./dist/*) 画像や robots など File System Program Reactのための中間成果物 (./.dodai-build/*) .js
dodaiのアーキテクチャ(build編) Main Process .tsx Original Files ① Compiler API で Call ② トランスパイル ③ 成果物を書き出し ④ rendertoStaticMarkup ⑤ JS として import ⑥ string で結果を返却 ⑦ HTML を書き出し ⑧ static/ をコピー HTMLファイル 最終成果物 (./dist/*) 画像や robots など File System Program Reactのための中間成果物 (./.dodai-build/*) .js
dodaiのアーキテクチャ(watch編) HTML Server (http://localhost:5432) ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 HotReload Server (http://localhost:10020) ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ② ブラウザからアクセス ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ② ブラウザからアクセス ③ /subscribe にポーリング ※ HTMLϑΝΠϧʹؚ·ΕΔॲཧ ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ② ブラウザからアクセス ③ /subscribe にポーリング ※ HTMLϑΝΠϧʹؚ·ΕΔॲཧ ④ 変更検知後ビルド ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ② ブラウザからアクセス ③ /subscribe にポーリング ※ HTMLϑΝΠϧʹؚ·ΕΔॲཧ ④ 変更検知後ビルド ⑤ 更新を通知 ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ② ブラウザからアクセス ③ /subscribe にポーリング ※ HTMLϑΝΠϧʹؚ·ΕΔॲཧ ④ 変更検知後ビルド ⑤ 更新を通知 ⑥ HTTP Response を返却 ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ② ブラウザからアクセス ③ /subscribe にポーリング ※ HTMLϑΝΠϧʹؚ·ΕΔॲཧ ④ 変更検知後ビルド ⑤ 更新を通知 ⑥ HTTP Response を返却 ⑦ ポーリング終了検知後再読み込み ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)
dodaiのアーキテクチャ(watch編) リクエストごとに最新のHTMLを配信 .tsx ① chokidarで監視 ② ブラウザからアクセス ③ /subscribe にポーリング ※ HTMLϑΝΠϧʹؚ·ΕΔॲཧ ④ 変更検知後ビルド ⑤ 更新を通知 ⑥ HTTP Response を返却 ⑦ ポーリング終了検知後再読み込み ⑧ リロードによって再度アクセス ᶃɺᶄͷॳճ࣮ߦޙᶅʙᶊ͕ࣗಈతʹ܁Γฦ͞ΕΔɻ αʔόʔͰ݁͢Δॲཧ ϒϥβͱαʔόʔͷॲཧ Main Process HTML Server (http://localhost:5432) HotReload Server (http://localhost:10020)