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
本当に 0 からの 関数型プログラミングの歩き始め方 / How to Walk into F...
Search
TAKASE Kazuyuki
March 24, 2023
Education
1
1.2k
本当に 0 からの 関数型プログラミングの歩き始め方 / How to Walk into Functional Programming from Scratch
このスライドは、2023/03/24 に開催された「第四回 関数型プログラミング(仮)の会」で発表したものです。
cf.
https://opt.connpass.com/event/272470/
TAKASE Kazuyuki
March 24, 2023
Tweet
Share
More Decks by TAKASE Kazuyuki
See All by TAKASE Kazuyuki
A Tour of Anti-patterns for Functional Programming
guvalif
0
3.2k
"数学" をプログラミングしてもらう際に気をつけていること / Key Considerations When Programming "Mathematics"
guvalif
0
660
"情報設計" と "体験設計" の観点から捉える UI 構築の考え方 / Approaches to UI Construction from the Perspectives of "Information Architecture" and "Experience Design"
guvalif
0
690
Chatwork における採用広報と技術広報のリアル / Trial & Error of New Grad Developer Relations at Chatwork
guvalif
0
500
宣言的 UI 時代のクライアントサイド DDD 大考察 / Client-side DDD in the Age of Declarative UI
guvalif
11
10k
新卒採用・育成を通じて、プロダクト人材が育つカルチャーを作りたいお話 / How to Make Developer's Educational Culture
guvalif
2
1.8k
Other Decks in Education
See All in Education
リバースバケットリスト 〜 「死ぬまでにやることリスト」の欠点と対処法
takibi333
0
130
子どものためのプログラミング道場『CoderDojo』〜法人提携例〜 / Partnership with CoderDojo Japan
coderdojojapan
4
15k
Ilman kirjautumista toimivia sovelluksia
matleenalaakso
1
20k
SAT Bootcamp and Course
syedmahadd
0
170
Analysis and Validation - Lecture 4 - Information Visualisation (4019538FNR)
signer
PRO
0
1.9k
2024年度秋学期 統計学 第11回 分布の「型」を考える - 確率分布モデルと正規分布 (2024. 12. 4)
akiraasano
PRO
0
120
The Prison Industrial Complex by Billy Dee
oripsolob
0
740
Why Did Douglass Change His Mind?
oripsolob
0
440
1216
cbtlibrary
0
280
HyRead2425
cbtlibrary
0
130
Semantic Web and Web 3.0 - Lecture 9 - Web Technologies (1019888BNR)
signer
PRO
2
2.7k
Adobe Express
matleenalaakso
1
7.8k
Featured
See All Featured
The World Runs on Bad Software
bkeepers
PRO
67
11k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
440
Unsuck your backbone
ammeep
669
57k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
The Cost Of JavaScript in 2023
addyosmani
47
7.4k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Building Adaptive Systems
keathley
40
2.4k
Building a Scalable Design System with Sketch
lauravandoore
461
33k
Side Projects
sachag
452
42k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.5k
Designing for humans not robots
tammielis
250
25k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
Transcript
© Chatwork 本当に 0 からの 関数型プログラミングの歩き始め方 2023/03/24 [Fri] DevRel 部
MGR 高瀬 和之 (@Guvalif) Chatwork 株式会社
2019 年に Chatwork 株式会社へ フロントエンド・エンジニア としてジョインし、 リリース基盤やビデオ通話アプリケーションの開発に従事。 2020 年から エンジニア採用広報に転身
し、技術イベント運営や エンジニア採用を主業務とする。パラレルワークで講師業 も営む。 Opt さん主催のイベントには、直近のものだと 「第二回 プログラミング教育について話し合う会」に登壇しました 自己紹介 - 高瀬 和之 (たかせ かずゆき) 2 :@Guvalif YouTube にて アーカイブ配信中!
- 良い設計を発見する ための、ベース知識として用いる - 安全な開発を実現する ための、勘所として用いる - これらは決してプログラミング言語に依存すること無く、普遍的に応用可能 だと考える -
つまり、ライトユーザーです (コワクナイヨ! 関数型プログラミングに対する私の立ち位置 3
前提整理 "関数" に親しんでもらう "高階関数" に親しんでもらう "型" に親しんでもらう "パラダイム" に親しんでもらう 1
2 3 4 5 AGENDA アジェンダ
前提整理 1
"0 から" とはどのくらいのレベル感を想定しているか? 6 - "知っている & できない" から、1 つステップアップ
しようとしているレベル感 - 例) プログラミングっておもしろそうだな、まずは Progate で勉強してみようかな? 知識伝達 知識の 分解・再構成 応用知識の 習得 基礎知識の 習得 原体験 経験学習 経験学習 経験学習 知らない & できない 知っている & できない 考えるとできる 考えなくてもできる 教えられる
教材選定と検証母集団 7 - "知っている & できない" から 1 つステップアップしようとしているレベル感の人たちに 対してラーニングを提供したいという背景から、見た目で
Trial & Error がわかりやすい教材 を 選定することが多いです → JavaScript (& HTML + CSS) を活用 - 検証母集団は: - 18 〜 60 才の男女,約 100 人 - 職種や文系・理系の区分は問わない ※ "エンジニア" かつ "考えるとできる" 人のステップアップをどう支援するか?に関しては、 もし要望があればどこかでお話します
"関数" に親しんでもらう 2
学習体験の意図 / 状態定義例 9 ▪ 意図 - 関数型プログラミングをしようにも、関数の有用性 をわかってもらわないことには始まらない →
まずはいくつかのパターンを通じて、関数に慣れ親しんでもらう ▪ 状態定義例 プログラムの全体を構成する手続きが実装できる プログラムの全体を構成する手続きから 構造を分解し関数に置き換えて実装できる
課題設定例 10 - 以下の 3 パターンに分けて、課題の提示やフィードバックを繰り返す: - 処理のまとまりに対して、名前を付ける 用途 -
似た記述であって一部だけが異なる処理に対して、テンプレート化する 用途 - なんらかの命令と結果の組に対して、アクターに見立てる 用途 ※ まず慣れ親しむことを最優先するため、この時点で "副作用" / "クロージャ" / "テスタビリティ" などのキーワードには触れません 発展的指示として … 凝集度っていう考え方も調べてみるとおもしろいよ
"高階関数" に親しんでもらう 3
イベント駆動を理解しその上で インタラクションを実装できる 学習体験の意図 / 状態定義例 12 ▪ 意図 - 関数をファーストクラスなものとして扱う原体験
を得てもらう → map / filter / reduce などを始めとした、主要な高階関数を理解するための足がかり ともする ▪ 状態定義例 順次・反復・分岐処理は実装できるが インタラクションの実装方法は知らない λ. λ. λ.
課題設定例 13 - 「ユーザーの入力に反応できるのはなぜか?」という発問を行う - イベントループにより、さまざまなイベントを待ち受けることができる - イベントの種類に応じて、行いたい処理を登録し切り替えることができる - ↑の登録処理は、まさに
関数を値として受け渡す ことに他ならない → 高階関数の具体例 ※ 本質的には、コールバック関連の課題設定であればなんでも良いと思います カリー化を用いた課題設定も、同様にバリエーションとしてありだと思います 発展的指示として … 関数を返してくれるケースで便利な用途ってありそう?
"型" に親しんでもらう 4
学習体験の意図 / 状態定義例 15 ▪ 意図 - 型があることでエラーや実装のミスを減らせる ことを実感してもらう →
ここでの仕掛けを通じて、代数的データ型や Monadic Computations への応用 も見据える ▪ 状態定義例 データに性質の違いがあることは知っているが 暗黙的変換などで実装ミスをすることがある 型システムを通じてデータの性質の違いを可視化し 未然に暗黙的変換に気づくことができる λ→ λ2 λP λP2 = or ≠
課題設定例 16 - HTML の各種 attribute に対して、値を入れたり取り出したりする課題の提示を行う: - 特に数値や配列を入れるような課題だと、文字列への 暗黙的変換
が起きて良い - 一通りバグらせてもらった後、TypeScript を導入してもらう - 未然に暗黙的変換が防げる → 型システムの恩恵の具体例 ※ 動的型付けプログラミング言語だと、このあたりのバグらせパターンは設計しやすいです undefined になるパターンなども、良く課題として用いています 発展的指示として … 型レベル計算ってキーワードも調べてみるとおもしろいよ
"パラダイム" に親しんでもらう 5
View / Model / Event が混在した状態の ペインを理解し、解決手法に興味が持てている View / Model
/ Event が混在した状態で なんらかの UI を実装できる 学習体験の意図 / 状態定義例 18 ▪ 意図 - 関数型プログラミングの実応用に触れてもらうことで、応用知識習得への導線 をつくる → ここからが本当の関数型プログラミングへの入り口 (他の登壇者の方がノウハウをお話してくれる … はず) ▪ 状態定義例
課題設定例 19 - 「見た目を操作しているのか、値を操作しているのか、なんだがスパゲッティ …」 - 宣言的 UI っていう考え方があるよ、React っていうものを調べてみるといいよ
- 「イベントが複雑に入り組んでいるときに、上手く管理する方法ってないかな …?」 - 非同期ストリーム っていう考え方があるよ、RxJS っていうものを調べてみるといいよ - 「UI の変化が複雑な時に、うまくデバッグする方法ってないかな …?」 - イベントソーシング っていう考え方があるよ、Redux っていうものを調べてみるといいよ 発展的指示として … Elm ってプログラミング言語も調べてみるとおもしろいよ
まとめ 01 0 からの育成を見据えるなら、基礎知識の習得フェーズにおいても さまざまな伏線を仕込むことが大事 20 02 トップダウンで関数型プログラミング言語を用いるケースは未検証なので もし事例をお持ちの方がいればディスカッションしましょう!
人事・組織戦略立案 ブランドリフト 採用・育成 ピープルマネジメント We are Hiring !!! 21 本部長
VPoE & ピープルマネージャー 人事 & 学習体験デザイナー エンジニア採用広報 HRBP 全体支援 人事企画 & 組織開発を横断するスクラムチームで、プロダクト人材の成長環境 を一緒につくりませんか?
働くをもっと楽しく、創造的に