Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
frontend_to_cli_tool_by_rust
Search
Wataru Morita
September 13, 2019
Programming
600
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
frontend_to_cli_tool_by_rust
Wataru Morita
September 13, 2019
More Decks by Wataru Morita
See All by Wataru Morita
JMAPが描くメールの未来
tascript
0
180
thanks_react_router_v7
tascript
0
240
5-things-for-front-end
tascript
0
11k
legacy_code_fukuoka_js
tascript
1
490
svelte_typescript_fukuoka_ts
tascript
1
500
enjoy_mruby_2021
tascript
0
130
TypeScript_BFF
tascript
4
5k
nestjs_typeorm
tascript
0
690
Asyncで 非同期処理を 少しだけ楽に書く/ ruby_with_async
tascript
0
260
Other Decks in Programming
See All in Programming
Vue Fes Japan 2026 タイムテーブル徹底解説
448jp
1
570
AgentCore CLI で進化した AWS での AI エージェントの作り方 : 必要な機能を必要な時に
icoxfog417
PRO
4
400
ハーネス設計入門 〜 基礎知識の整理から実務へのステップアップ 〜
kinopeee
19
19k
Androidだけじゃない、DroidKaigiで広がった私の技術スタック
akkeylab
0
100
手動確認はもう限界 〜XCUITestでCustom URL Schemeの遷移を起動種別ごとに自動テストする〜 / Testing Custom URL Schemes with XCUITest
otouto
0
360
巨大モノリシックアプリ モダン化大作戦
ktcryomm
1
1.2k
ソニーのクラウド共通基盤の変遷とAI時代の開発スタイルに合わせた進化 / The Journey of Sony’s Common Cloud Platform and Its Evolution for AI-Native Development
kenjiyoneyama
0
200
Intent as Code
shoppingjaws
6
1.1k
Heart of Swift Concurrency
koher
0
1.1k
技術的負債の返済は、AI時代の複利で効く投資 — 経営としての意思決定とその遂行
curekoshimizu
1
2k
C#の現在地 進化の歴史と、AI時代の.NET Everywhere
neuecc
5
4.4k
Security issues being discussed on Web Platforms
petamoriken
0
1.4k
Featured
See All Featured
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.4k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
340
Docker and Python
trallard
47
4.2k
Prompt Engineering for Job Search
mfonobong
0
460
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
440
Building a Scalable Design System with Sketch
lauravandoore
464
34k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
290
The Illustrated Children's Guide to Kubernetes
chrisshort
51
53k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.9k
The Limits of Empathy - UXLibs8
cassininazir
1
690
4 Signs Your Business is Dying
shpigford
187
23k
Automating Front-end Workflow
addyosmani
1369
210k
Transcript
3VTUͰϑϩϯτΤϯυ͔Β $-*πʔϧͷ։ൃ·ͰͬͯΈͨ @tascript Fukuoka.rs
;͋Έ 森田 亘(@tascript) GMOペパボエンジニア(フロントエンド) Rustは初心者(お手柔らかに)
3VTUͰԿΛ͢Δ͔
3VTUͷकඋൣғ WebAssembly (ほんの少しお話します) FireCracker (もう少しネタ増えたらお話したい) CLIツール (ほんの少しお話します) Webフレームワーク (Rocket) エンジニアのジャンルにとらわれず開発の幅が広い
͍͢͝ʂ
3VTUॻ͖͍ͨʂ
ͬͯΈͨ͜ͱ ͭΛհ͠·͢
ᶃ:FX
:FX Rust製のフロントエンドwebフレームワーク 最終的な成果物をWebAssemblyにコンパイル 独自の仮想DOMを所持 ReduxのようにUIの状態管理が可能 気軽にWebAssemblyを体験
:FXͷجຊ Model(状態管理) Update(状態変更) View(画面表示) 6QEBUF 7JFX .PEFM "DUJPO
:FXͷجຊ ॱ൪ ①viewのactionにより ②updateが実施され ③modelを変更し ④viewに反映する 6QEBUF 7JFX .PEFM "DUJPO
ᶆ ᶅ ᶄ ᶃ
① 構造体に表示に必要なプロパティを用意 ② トレイトでプロパティを変化 .PEFM
①イベントとイベントハンドラを定義 ②matchでイベントを選択 ③イベントハンドラを実行 6QEBUF
①html!マクロを使用してコンポーネントを作成 ②リアクティブなデータとイベントでコールされる関数をRustで記述 7JFX
ͪͳΈʹ .wasmファイルの大きさはリリースビルドで169K + グルーコード31K 計算もしたいし描画もしたいものを再利用しておく場合有効的かも 詳しくはQiitaにも(https://qiita.com/wataru-script/items/ 2918ff21772a805930f1)
ᶄ$-*πʔϧͷ։ൃ
ESBHPOUBJM tailコマンドで特定のキーワードに色を付ける nao-kobayashiさんのrtailから着想 https://github.com/wataru-script/dragontail usage書いてなくてすみません…
ͬͯΔ͜ͱ (rtailでtailの実装はできていた) ①キーワードごとに1行ずつ文字列をsplit ②分割された文字列がキーワードと一致したら色付け(6色をループ) ③splitによる文字列型の配列をループ ④write(最後の要素以外)とwriteln(最後の要素)で出力
໘ͩͬͨ͜ͱᶃ 特定のキーワードで文字列を分割して配列化する処理 (一文字だけならバイト文字列で取り扱えばいいけど2文字以上のキーワードに関する splitが簡単にできなかった) [‘hello’ , ’fukuoka’, ‘.rs event!’] (fukuokaがキーワードの場合)
໘ͩͬͨ͜ͱᶃ ①行内にkeywordが存在すれば一致した箇所のindexの早い順にソート ②行に対しkeywordの一致したindexとkeywordの文字数分の長さでsplitする ᶄ ᶃ
໘ͩͬͨ͜ͱᶄ 複数のキーワードを指定した場合、あるキーワードが他のキーワードに含まれる場合は内包す る側のキーワードを優先する処理 (単純にループ処理が面倒) [‘a’ , ’fukuoka’, ‘.tenjin’, ‘e’] =>
[‘fukuoka’, ‘tenjin’]
໘ͩͬͨ͜ͱᶄ 複数キーワードの場合2つのキーワードを比較し、 相手に含まれているか、含んでいるかを確認(書き方がなんかイケてない)
ৼΓฦΓ とにかく自分の興味のある領域でRustに関するものから手を付ける(守備範囲広め) なにか作ってみたほうがいい(最初はコンパイラにかなり怒られます) コンパイラに怒られてもひたすら書く(緩やかな成長はないのかも) 型が完全に合うと気持ちいい! CLIツールは標準入力に対して色付けするものでもよかったなー(作成中)
5IBOLZPV @tascript Fukuoka.rs