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
Kotlin/MPPでブログを作った話
Search
Yuta Tomiyama
May 19, 2021
Programming
0
620
Kotlin/MPPでブログを作った話
集まれKotlin好き!Kotlin愛好会 vol.29 @オンライン にて発表
Yuta Tomiyama
May 19, 2021
Tweet
Share
More Decks by Yuta Tomiyama
See All by Yuta Tomiyama
モバイルアプリ開発を始めよう!
yt8492
0
46
Git勉強会
yt8492
0
110
なんでもやってみる勇気
yt8492
0
81
Android Autoが思ったよりしんどい話
yt8492
0
190
apollo-kotlinにcontributeした話
yt8492
0
120
DMM TVのSDカードダウンロード機能を実装した話
yt8492
1
830
今だからこそ知りたいKotlin Multiplatform
yt8492
0
290
State management and API calls in Jetpack Compose: Learning Apollo + Jetpack Compose through React Hooks
yt8492
0
1.2k
サーバーフレームワークの仕組みが気になったので車輪の再発明をしてみた
yt8492
0
200
Other Decks in Programming
See All in Programming
既存デザインを変更せずにタップ領域を広げる方法
tahia910
1
240
Create a website using Spatial Web
akkeylab
0
300
プロダクト志向なエンジニアがもう一歩先の価値を目指すために意識したこと
nealle
0
110
Deep Dive into ~/.claude/projects
hiragram
7
1.3k
Cline指示通りに動かない? AI小説エージェントで学ぶ指示書の書き方と自動アップデートの仕組み
kamomeashizawa
1
570
AWS CDKの推しポイント 〜CloudFormationと比較してみた〜
akihisaikeda
3
310
型付きアクターモデルがもたらす分散シミュレーションの未来
piyo7
0
810
Select API from Kotlin Coroutine
jmatsu
1
190
CursorはMCPを使った方が良いぞ
taigakono
1
170
Java on Azure で LangGraph!
kohei3110
0
170
PostgreSQLのRow Level SecurityをPHPのORMで扱う Eloquent vs Doctrine #phpcon #track2
77web
2
290
F#で自在につくる静的ブログサイト - 関数型まつり2025
pizzacat83
0
310
Featured
See All Featured
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.8k
Gamification - CAS2011
davidbonilla
81
5.3k
It's Worth the Effort
3n
185
28k
The Invisible Side of Design
smashingmag
299
51k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.6k
Why You Should Never Use an ORM
jnunemaker
PRO
56
9.4k
The Pragmatic Product Professional
lauravandoore
35
6.7k
Music & Morning Musume
bryan
46
6.6k
Product Roadmaps are Hard
iamctodd
PRO
53
11k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Transcript
Kotlin/MPPで ブログを作った話 2021/05/19 Kotlin愛好会
自己紹介 HN: マヤミト 会津大学 学部4年 Zliという技術系LTサークルやってます GitHub: https://github.com/yt8492 好きな言語: Kotlin,
Scala, Go 最近はウマ娘に脳味噌を破壊されています Twitter: yt8492
Kotlin/MPPをフル活用してブログを作りました JSファイルがクソデカ(約3MB)なのでWi-Fi環境でのアクセスをオススメします😇 https://blog.yt8492.com
プロジェクトの構成 - 4つのGradleのモジュールから構成されている - common - ユーザーや記事などのモデルの型定義 - このモジュールをserver, webfront,
cliの3つのモジュールから読みこむ - server - Ktor - webfront - Kotlin/JS, React, Ktor Client - cli - Kotlin/Native, kotlinx-cli, platform libraries, Ktor Client
プロジェクトの構成 Kotlin/MPP common - モデルの型定義 - JSONの型定義 server webfront cli
POSIX
webfrontについて - kotlin-wrappersというリポジトリにある各種ラッパーライブラリを使用 - kotlin-react - kotlin-react-dom - kotlin-react-router-dom -
kotlin-styled - kotlin-css - ラッパーが提供されていないライブラリも使いたい - 自分で書く😇 - react-markdown - remark-gfm - react-syntax-highlighter
JSライブラリのラッパーの作り方 1. ライブラリをimplementationする react-markdownの場合 implementation(npm("react-markdown", "5.0.3"))
JSライブラリのラッパーの作り方 2. ライブラリのコードを読む(TSの型定義があると楽)
JSライブラリのラッパーの作り方 3. 読んだコードをもとにラッパーを書く 関数名などはJS側の定義に合わせる必要がある(変える場合は@JsNameで元の名前 を渡す)
ReactをKotlinで書くのは気持ちがいい - JSXではなくKotlinのDSLで書く
OGP対応 - ページのHTMLのヘッダーにOGPの情報を含める必要がある - SPAで記事ごとにOGP出すのしんどい😇 - NginxなどでHTMLファイルを配信するやり方ではしんどそう 🤔 - Ktorでkotlinx.htmlを使い、HTMLだけサーバー側で動的に生成することに
- OGPの生成はJavaのAWTで動的に頑張ってます😇 - もっといい方法あったら教えて下さい……
OGP対応
ビルド時にJSを一緒に生成するようにする - serverのbuild.gradle.ktsにwebfrontのビルドを一緒に実行するように書く
管理用CLIツールについて - macosX64をtargetにしたKotlin/Nativeのプロジェクト - 本当はhierarchical structureで複数プラットフォーム対応したかったけど IDEのバグっぽいのを引 いて断念(Issueは立てた) - 管理ユーザーログイン、記事の投稿・編集・削除の機能を実装
- ビルドすると実行可能なバイナリになる
各種コマンドの実装 - kotlinx-cliを使用 - コマンドライン引数などを簡単に扱うことができる - これのSubcommandを継承したクラスを実装し、 main関数から読み込んで使う
ファイル操作など - platform librariesを使う(実質C言語😇) - file pointerなどをゴリゴリに使うので便利関数で隠蔽するのがおすすめです
できた🎉
やってみた感想 - なにもかもKotlinで書けて楽し〜〜〜〜〜✌🤪 - commonモジュールの型定義を各プラットフォームで使い回せるのは体験が良い - ライブラリやコンパイラやIDEのKotlinプラグインのバグを踏みまくりでちょっとしん どい楽しい - Kotlin
1.5に上げるのは一旦断念しました - Issueを立てて貢献しよう! - 各プラットフォームに対する理解が深まる - みんなもKotlin/MPP、やろう! - Kotlinかわいーーーー!!!!!!!!!!!!
リンクなど - ブログのリポジトリ - https://github.com/yt8492/Blog - 実装の解説記事 - https://blog.yt8492.com/entries/aboutthisblog