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
これからのメタプログラミングJavaScriptの正義を語ろう / meta programm...
Search
erukiti
November 18, 2017
Programming
5
2.5k
これからのメタプログラミングJavaScriptの正義を語ろう / meta programming JavaScript is Justice
コーディングタイムコンパイル
暖かき溢れる手作業による重複を根絶する
生産性を向上して、相対賃金を上げる
erukiti
November 18, 2017
Tweet
Share
More Decks by erukiti
See All by erukiti
Codex時代の新たなバイブコーディングワークフロー/ after Codex workflow
erukiti
7
2.1k
Claude Codeを使って不確実性と戦う / claude-code-fights-uncertainty
erukiti
10
4k
Claude Code活用において、メンタルモデルを変える必要がある / rethinking-claude-code-mental-models
erukiti
20
13k
AIとの対話で加速する学び / ai learnig
erukiti
1
720
コーディングエージェントを作ってるけどうまくいかなかった話 ~あるいは二ヶ月本気でコーディングエージェントと向き合った話~ / Two Month Agent Struggle
erukiti
40
20k
Gemini 2.0 Flashで実現する高コスパAI開発 〜実践的プロンプトエンジニアリングと文書管理システムの実装例〜/gemini-2.0-flash-prompt-engineering
erukiti
17
6.7k
LLMをねじ伏せる/Conquer the LLM
erukiti
0
240
鮮度が高すぎて世界で誰も正解を見つけてない課題に取り組んでいる/ Freshness issues
erukiti
1
900
実演TypeScript + GitHub Copilot
erukiti
9
4.5k
Other Decks in Programming
See All in Programming
Towards Transactional Buffering of CDC Events @ Flink Forward 2025 Barcelona Spain
hpgrahsl
0
120
コードとあなたと私の距離 / The Distance Between Code, You, and I
hiro_y
0
210
Devoxx BE - Local Development in the AI Era
kdubois
0
150
Node-REDのノードの開発・活用事例とコミュニティとの関わり(Node-RED Con Nagoya 2025)
404background
0
110
Researchlyの開発で参考にしたデザイン
adsholoko
0
100
Ktorで簡単AIアプリケーション
tsukakei
0
120
フロントエンド開発のためのブラウザ組み込みAI入門
masashi
7
3.6k
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
4
17k
CSC305 Lecture 11
javiergs
PRO
0
310
Developer Joy - The New Paradigm
hollycummins
1
380
マイベストのシンプルなデータ基盤の話 - Googleスイートとのつき合い方 / mybest-simple-data-architecture-google-nized
snhryt
0
110
CSC305 Lecture 09
javiergs
PRO
0
330
Featured
See All Featured
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.7k
jQuery: Nuts, Bolts and Bling
dougneiner
65
7.9k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Mobile First: as difficult as doing things right
swwweet
225
10k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
Faster Mobile Websites
deanohume
310
31k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
658
61k
Building a Scalable Design System with Sketch
lauravandoore
463
33k
Into the Great Unknown - MozCon
thekraken
40
2.1k
4 Signs Your Business is Dying
shpigford
186
22k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.5k
Speed Design
sergeychernyshev
32
1.2k
Transcript
͜Ε͔Βͷ ϝλϓϩάϥϛϯά JavaScriptͷਖ਼ٛΛޠΖ͏ @erukiti ϝλϓϩάϥϚ(AST෩)
@erukiti • కΊΓۦಈͰٕज़ॻΛࣥච • ۭɾໝυϦϒϯΤϯδχΞ • ϑϩϯτΤϯυ͋·Γͬͨ͜ͱͳ͍όοΫΤϯυ ͷܦྺ͔Γͳແ৬ (࣌ʑϑϦʔͰࣄͯ͠Δ) •
࠷ۙɺASTΛ׆༻ͨ͠property based testingͷ࡞ ΄͔ɺͻͨ͢ΒAST৮ͬͯΔ
ʮͰ͖ΔΤϯδχΞ ੜ࢈ੑ͕Ұܻɾೋܻҧ͏ʯ
ੈքअѱʹຬ͍ͪͯΔ
ߦ͑ؔ OJDFDBUDI ແࢹ͞ΕΔXBSOJOH ॥తෳࡶ͑ *%&͕ແ͍ͱίʔυͷѲ͕Ͱ͖ͳ͍ ফͨ͠Βಈ͔ͳ͘ͳΓ·͢ ໊લۭؒԚછ ಉ͡ϩδοΫ͕ෳՕॴʹ
ʮࣈͬΆ͍จࣈྻͳͷͰࣈʹม͓͖ͯ͠·ͨ͠ʯ Ϣχοτςετ͕શ͘ແ͍ ͓·͡ͳ͍ ίϐϖϓϩάϥϛϯά ҉ͷܕม Ͳ͜Λॻ͖͑Ε͍͍ͷ͔Θ͔Βͳ͍ ҰՕॴॻ͖͑ͨΒଞʹӨڹͰ·ͬͨ͘ DPOTPMFMPH IPHF ফ͢ͱԿނ͔ಈ͔ͳ͍ ಉ͡ϩδοΫ͕ෳՕॴʹ
ϘʔϧυϚʔΧʔ
ਓ͕ؒཧղͰ͖Δఔʹ γϯϓϧʹ͍ͨ͠
ରࡦํ๏ • ΫϥεϝιουͷΛݮΒ͢ (جຊ୯Ұ ͷݪଇ) • ૄ݁߹ʹ͢Δ • ׂ౷࣏͢Δ •
DRYݪଇΛकΔ
DRY - Don’t Repeat Yourself • ʮ͋ͳͨͷखͰ܁Γฦ͍͚ͯ͠ͳ͍ʯ • ͭ·Γʮ͋ͳͨͷखʯ͡Όͳ͔ͬͨΒ܁Γฦ ͍͍ͯ͠
• ܁Γฦ͕͠ಘҙͰɺͱͯਖ਼֬ͳϠπʹΒͤ Α͏
ͦ͜Ͱϝλϓϩάϥϛϯά
ϝλϓϩάϥϛϯά • ιʔείʔυͰιʔείʔυΛੜ͢Δ • ੜݩ͕DRYͰ͑͋͞Ε͍͍ • ੩తͳϝλϓϩͱಈతͳϝλϓϩ͕͋Δ
None
Babel • JSքͰҰ൪ΘΕͯΔɺϝλϓϩάϥϛϯά ʹΑΔϓϩμΫτ • ϓϥάΠϯͦͷू߹ମͰ͋ΔϓϦηοτΛ ͬͯιʔείʔυΛม͢Δ • ϓϥάΠϯ࡞ΔͷɺπʔϧνΣΠϯͷαϙʔ τ͕͋ΔͷͰ͔ͳΓ؆୯
BabelπʔϧνΣΠϯ • ࣈ۟ղੳͱ͔໘͝ͱશͯҾ͖ड͚ͯ͘Ε Δ • ؔఆٛɺมఆٛɺೋ߲ԋࢉͳͲɺಛఆͷ ෦Λநग़Ͱ͖Δ • ੩తղੳʹΑΔมͷείʔϓղੳɺ͋Δఔ ͷࣗಈ࠷దԽ
• 100ߦҎͰͬ͘͞ΓDIΛ࡞ΕΔ • 100ߦҎͰͬ͘͞Γ࠷దԽϓϥάΠϯΛ࡞Ε Δ • 100ߦҎͰͬ͘͞ΓԋࢉࢠΦʔόϥΠυΛ࣮ ݱͰ͖Δ BabelͰͰ͖Δ͜ͱͷྫ
https://github.com/erukiti/autodebugger
͜Ε͔Βͷϝλϓϩάϥϛϯά • BabelͷΤίγεςϜʹ͔ͬΔ • جຊࣄલbuild • ։ൃ࣌ߦͤಈతॻ͖͑Մೳ • ίʔσΟϯάλΠϜίϯύΠϧͱ͍͏৽ٕज़
ίʔσΟϯάλΠϜίϯύΠϧ
None
s2s - source to source • @akameco ͞ΜͷϓϩμΫτ • ϑΝΠϧ͕࡞ɾߋ৽͞ΕͨΒࣗಈͰBabelϓϥά
ΠϯΛΒͤΔ • React/ReduxΛߴίʔσΟϯά • ίʔσΟϯά్தͰΔίϯύΠϧ͔ͩΒίʔσΟ ϯάλΠϜίϯύΠϧ
s2sͰͰ͖Δ͜ͱ • ReduxͷreducerΛՃͨ͠Βɺউखʹ combineReducers͞ΕΔ • ϑΝΠϧΛtouchͨ͠ΒςϯϓϨʔτ͕ࣗಈల։ • ؔΛॻ͍ͨΒJsDoc͕ࣗಈੜ͞ΕΔ • ؔΛॻ͍ͨΒɺରԠ͢ΔϢχοτςετ͕ࣗಈੜ
͞ΕΔ
ΞΠσΞ͍ͬͺ͍ɺເ͍ͬͺ͍ • ܕਪͰࣗಈͰܕΛ͚ͭΔ • ܕใ͔ΒassertΛࣗಈੜ • ָͳॻ͖ํͰܖϓϩάϥϛϯάΛ࣮ݱ͢Δ • طଘͷͷΑΓڧྗͳproperty based
testing͕࣮ݱͰ͖ͦ ͏ • ΤϯτϦϙΠϯτΛॻ͍ͨΒࣗಈͰJSON Scheme Λੜ͢Δ
ASTΛ৮Δ͚ͩ͡Όͳ͍ • ࠷ۙϋϯυϥʔͱ͍͏Έ͕ೖͬͯɺBabelϓ ϥάΠϯҎ֎ΒͤΒΕΔΑ͏ʹͳͬͨ • JavaScript, TypeScriptʹݶΒͣ͋ΒΏΔͷΛ watchͯ͠JSͷίʔυ͋Δ͍ଞͷԿ͔ʹม ͢Δ͜ͱͰ͖Δ •
ྫ͑pegjsΛίʔσΟϯάλΠϜͰมͰ͖Δ
ίʔσΟϯάλΠϜίϯύΠϧ • ίʔσΟϯά͠ͳ͕ΒϦΞϧλΠϜͰιʔείʔ υ͕ల։͞ΕΔ • ίϯύΠϧࡁΈͳͷͰɺVSCodeͳͲIDEͷࢧ ԉΛ࠷େݶड͚ΒΕΔ • ܕใ׆༻͠์
͜Ε͔Βͷϓϩάϥϛϯάͷਖ਼ٛ • ίʔσΟϯάλΠϜίϯύΠϧͱ͍͏৽ٕज़ • ஆ͔ΈᷓΕΔख࡞ۀΛࠜઈ • ੜ࢈ੑΛ্ͯ͠ɺ૬ରۚΛ্͛Δ
ࠂ • ٕज़ॻయ3Ͱ൦ͨ͠ʰ؆୯JavaScript ASTೖ ʱͬͯΔͷͰख͠Ͱ൦Ͱ͖·͢ɻ • લճͷModern JavaScriptʹଓ͍ͯɺASTຊ ۀԽ࡞ۀਐߦதͰ͢ɻ •
ۀ൛JSຊɺΞοϓσʔτ༧ఆͰ͢ɻ