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
アップルップルの新しいオープンソースの紹介
Search
Hori Godai
May 20, 2018
Technology
0
510
アップルップルの新しいオープンソースの紹介
a-blog cms Training Camp 2018 Springで発表した内容です
Hori Godai
May 20, 2018
Tweet
Share
More Decks by Hori Godai
See All by Hori Godai
TypeScript Compiler APIを使って 型のユニットテストをブラウザーで動かす
steelydylan
3
220
エディター付きのReact開発環境を ブラウザーだけで実装した話
steelydylan
9
1.9k
HonoでReact・TypeScriptの実行環境をブラウザー上に作る
steelydylan
1
2.3k
複数ピンをまとめて表示するYahoo!地図用のJavaScriptライブラリをつくりま作りました
steelydylan
1
1.2k
Nuxtでのサーバー、クライアント間データ共有について
steelydylan
0
930
next.jsを使ったuniversal React 入門
steelydylan
1
310
a-blog cmsの静的書き出し機能を使って、 自分のブログを100%静的にした話
steelydylan
0
380
MySQLの GEOMETRY 型とJavaScriptの Geolocation API の活用事例
steelydylan
1
480
a-blog cms をよくするために 取り組んだ3つのこと
steelydylan
0
580
Other Decks in Technology
See All in Technology
クラウドセキュリティを支える技術と運用の最前線 / Cutting-edge Technologies and Operations Supporting Cloud Security
yuj1osm
2
250
Jaws-ug名古屋_LT資料_20250829
azoo2024
3
210
RSCの時代にReactとフレームワークの境界を探る
uhyo
6
710
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
30k
おやつは300円まで!の最適化を模索してみた
techtekt
PRO
0
250
ZOZOマッチのアーキテクチャと技術構成
zozotech
PRO
2
1.1k
つくって納得、つかって実感! 大規模言語モデルことはじめ
recruitengineers
PRO
32
12k
MCPで変わる Amebaデザインシステム「Spindle」の開発
spindle
PRO
2
1.9k
なぜSaaSがMCPサーバーをサービス提供するのか?
sansantech
PRO
4
900
サンドボックス技術でAI利活用を促進する
koh_naga
0
140
実践アプリケーション設計 ②トランザクションスクリプトへの対応
recruitengineers
PRO
4
1.2k
見てわかるテスト駆動開発
recruitengineers
PRO
6
2.4k
Featured
See All Featured
The Art of Programming - Codeland 2020
erikaheidi
55
13k
What's in a price? How to price your products and services
michaelherold
246
12k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.8k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
Building an army of robots
kneath
306
46k
Side Projects
sachag
455
43k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3k
Designing for humans not robots
tammielis
253
25k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
61k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.6k
For a Future-Friendly Web
brad_frost
179
9.9k
Transcript
Ξοϓϧοϓϧͷ ৽͍͠Φʔϓϯιʔεͷհ Ξ οϓϧ οϓϧ ງ ޛ େ
ງ ޛେ • @steelydylan • ϑϩϯτΤϯυΤϯδχΞ • Nagoya.jsओ࠵
ࠓ ͓ ͢͠ Δ ͜ ͱ • ެ։͍ͯ͠ΔJavaScript
OSSͷհ • OSSΛެ։͢ΔϝϦοτ • ࠓޙͷඪ
ΞοϓϧοϓϧͷOSSΛͬͨ͜ͱ͋Γ·͔͢ʁ
Ϩ ϙ δ τ Ϧ 3 3 ε λ
ʔ 9 5 5 https://github.com/appleple
JavaScript ϥϯΩϯά Nagoya Japan 2 / 80 Ґ 29 /
7662 Ґ http://git-awards.com/users/search?login=appleple
લ ʑ ճ հ ͠ ͨ O S S
• SmartPhoto • hiraku • modal-video • a-table.js
ࠓ ճ հ ͢ Δ O S S •
FormStorage • PrettyScroll • Hiraku2 • ScrollHint
FormStorage.js https://github.com/appleple/form-storage
FormStorage.js • Ұೖྗͨ͠༰Λอଘͯ͠࠶ͼϑΥʔϜΛ๚Εͨஈ ֊Ͱ෮ݩͰ͖Δ • ೖྗͨ͠༰ΛผͷϑΥʔϜͰར༻Մೳ
PrettyScroll https://github.com/appleple/pretty-scroll
PrettyScroll • εΫϩʔϧݻఆ͢Δཁૉ͕windowͷߴ͞ΑΓ͍ ߹Ͱ͔Β·ͰදࣔͰ͖Δ • εΫϩʔϧݻఆ͢ΔྖҬΛηϨΫλʔͰࢦఆͰ͖Δ • CSSෆཁ • ϒϨΠΫϙΠϯτ͕ઃఆՄೳ
Hiraku2 https://appleple.github.io/hiraku2/
Hiraku2 • ΦϑΩϟϯόεͷ։ด࣌ͷΞχϝʔγϣϯʹtransform Λ༻ • ΦϑΩϟϯόεΛεϜʔζʹεΫϩʔϧͰ͖ΔΑ͏ʹ վྑ • ϖʔδϦϯΫʹରԠ
ScrollHint https://github.com/appleple/scroll-hint
ScrollHint • ཁૉΛΈग़͍ͯ͠Δίϯςϯπ͕͍Δ߹ʹεΫ ϩʔϧ͢Δ͜ͱΛଅ͢ΞΠίϯΛදࣔͯ͘͠ΕΔ • ΞΠίϯͱςΩετࣗ༝ʹมߋՄೳ
appleple open source project https://appleple.github.io
Ξ οϓϧ οϓϧ ͷ O S S Λ ར ༻
͢ Δ ར • ։ൃ͕׆ൃ • @steelydylanʹཁόάใࠂΛग़ͤଈ࠲ʹରԠ • ͍ํ͕Θ͔Βͳͯ͘@steelydylanʹฉ͚Δʂ • ຊޠυΩϡϝϯτͷॆ࣮ • a-blog cms ͷ։ൃʹߩݙͰ͖Δ
ࣗ ʹ ͱ ͬͯͷ ར • ւ֎ͷ͍ΖΜͳਓ͔ΒissueϓϧϦΫ͕ඈΜͰָ͖͍ͯ͠ •
TwitterͰόζΔͷΛݟΔͷָ͕͍͠ • CMSʹΈࠐΈ͍ͨ࣌WebpackͰόϯυϧ͢Δ͚ͩͳ ͷͰָ • ελʔͰΔؾ্ • Ҋ݅Ͱ͑Δ
ඪ • ΞϓϦͷΑ͏ͳUIΛεϚϗͰఏڙ͍ͨ͠ • ΞοϓϧοϓϧͷOSSΛ͑Web੍࡞ʹࠔΒͳ͍ͱ ݴΘΕΔΑ͏ʹͳΓ͍ͨ • ͱΓ͋͑ͣ Nagoya
Ͱελʔ 1ҐΛࢦ͍ͨ͠
ࠓ ޙ Γ ͨ ͍ ͜ ͱ • ͔͍͍ͬ͜ςʔϚ։ൃ͍͖͍ͯͨ͠
• PWAʹରԠͨ͠ςʔϚͱ͔ • Node.jsΛͬͨίϚϯυϥΠϯܥͷOSS࡞Γ͍ͨ
࠷ ۙ P H P ॻ ͖ ·
͢ ʂ
֦ ு Ξ ϓ Ϧ O S S ͱ
ͯ͠ ͯ͠ ͍ · ͢ https://developer.a-blogcms.jp/app/
͜ Ε ͔ Β օ ͞ Μ ͷ W
E B ੍ ࡞ Λ ศརʹ͢ΔπʔϧΛ։ൃ͍͖ͯ͠·͢ɻ
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ @steelydylan