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
Mastodonのフロントエンド実装 / Frontend of Mastodon
Search
Yamagishi Kazutoshi
December 08, 2018
Technology
4
800
Mastodonのフロントエンド実装 / Frontend of Mastodon
Frontend Conference Fukuoka 2018 (
https://frontend-conf.fukuoka.jp/
) で話した内容になります。
Yamagishi Kazutoshi
December 08, 2018
Tweet
Share
More Decks by Yamagishi Kazutoshi
See All by Yamagishi Kazutoshi
MastodonとActivityPubとそこから繋がる世界 / Mastodon and ActivityPub
ykzts
0
880
Mastodonを支える技術 / Technology of Mastodon
ykzts
0
400
Other Decks in Technology
See All in Technology
AIエージェントのフレームワークを見るときの個人的注目ポイント
os1ma
1
510
Go Connectへの想い
chiroruxx
0
160
All About Sansan – for New Global Engineers
sansan33
PRO
1
1.2k
マルチテナント+マルチプロダクト SaaS への AI Agent の組み込み方
kworkdev
PRO
2
280
Model Mondays S2E01: Advanced Reasoning
nitya
0
270
Text-to-SQLの評価データセットを作って最新LLMモデルの性能評価をしてみた
gotalab555
3
770
「伝える」を加速させるCursor術
naomix
0
590
Securing your Lambda 101
chillzprezi
0
230
AWS と定理証明 〜ポリシー言語 Cedar 開発の舞台裏〜 #fp_matsuri / FP Matsuri 2025
ytaka23
9
2.3k
"SaaS is Dead" は本当か!? 生成AI時代の医療 Vertical SaaS のリアル
kakehashi
PRO
2
150
AI Engineering Summit Pre Event LT #10
okaru
2
560
OCI Oracle Database Services新機能アップデート(2025/03-2025/05)
oracle4engineer
PRO
1
110
Featured
See All Featured
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.8k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
16
910
The Straight Up "How To Draw Better" Workshop
denniskardys
233
140k
Designing for humans not robots
tammielis
253
25k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Building Applications with DynamoDB
mza
95
6.4k
Balancing Empowerment & Direction
lara
1
270
Become a Pro
speakerdeck
PRO
28
5.4k
How STYLIGHT went responsive
nonsquared
100
5.6k
Navigating Team Friction
lara
186
15k
Bash Introduction
62gerente
614
210k
Why You Should Never Use an ORM
jnunemaker
PRO
56
9.4k
Transcript
Mastodonの フロントエンド実装 山岸和利 (ykzts)
Mastodonとは
Mastodonとは ActivityPubとOStatusに対応したウェブアプリと繋がるミニブログ実装です。 ミニブログはTwitter流行以降に雨後のタケノコのように沢山出てきましたが、大半のも のはそれほど流行することなく消えていきました。MastodonはActivityPubやOStatusの ような共通規格のプロトコルに対応しているため他の実装と連携することができます。 Mastodonと同じくActivityPubやOStatusに対応している実装にはGNU socialや Pleroma、Micro.blogといったものがあります。
使われている技術 • Ruby on Rails • webpack (Webpacker) • React
+ Redux • Immutable.js • Sass • etc...
使われている技術 • Ruby on Rails • webpack (Webpacker) • React
+ Redux • Immutable.js • Sass • etc...
Webpacker?
// config/webpack/production.js process.env.NODE_ENV = process.env.NODE_ENV || 'production' const environment =
require('./environment') module.exports = environment.toWebpackConfig()
// config/webpack/environment.js const { environment } = require('@rails/webpacker') module.exports =
environment
// config/webpack/environment.js (custom) const { environment } = require('@rails/webpacker') environment.config
.set('resolve.extensions', ['.ts', '.js']) environment.loaders .append('ts', { test: /\.ts$/, use: 'ts-loader' }) module.exports = environment
WebpackerのDSLはとにかく自由度がない • Rails Wayに乗ることで誰が書いても似たようなもの になる • 集団開発では役に立つかもしれない • Rubyぽさがどうしても出ているのでフロントエンド開 発者の人は違和感しか抱かない……と思う
$ rm config/webpack/*.js
Mastodonでは WebpackerのDSLを使っていません
MastodonとWebpacker • Mastodonの config/webpack/*.js ではWebpacker のDSLを一切使っていません • webpack.config.js をwebpackの作法にそのまま 沿って書いています
• WebpackerのRakeタスクやViewのHelperだけ使っ ています
$ rm config/webpack/*.js
使われている技術 • Ruby on Rails • webpack (Webpacker) • React
+ Redux • Immutable.js • Sass • etc...
説明できていない要素が まだまだあります!
気になったことがあれば 懇親会等で聴いていただければ
終