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
Perl歴約10年のエンジニアがフルスタックTypeScriptに出会ってみた
Search
papix
April 22, 2025
Technology
1
630
Perl歴約10年のエンジニアがフルスタックTypeScriptに出会ってみた
papix
April 22, 2025
Tweet
Share
More Decks by papix
See All by papix
Houtou.pm #1
papix
0
1.4k
YAPC::Kyotoの「全て」 / All of "YAPC::Kyoto"
papix
0
1.5k
イベントの中の人 / Inside the Events
papix
0
290
2022年に始めるPerlでWebサービス開発(趣味)
papix
0
550
ワーケーションに関する考察
papix
3
2.2k
(今更)Amplifyさっくり体験
papix
0
870
はてなにおけるGitHub Actions活用事例 / GitHub Actions in Hatena
papix
0
2.5k
ミススペルを発見するmisspellのご紹介 / Introduce misspell
papix
0
1.2k
「知らなかった」を聞きに行く 〜海外カンファレンス参加のススメ〜 / builderscon 2019
papix
0
350
Other Decks in Technology
See All in Technology
フィンテック養成勉強会#56
finengine
0
140
サラリーマンの小遣いで作るtoCサービス - Cloudflare Workersでスケールする開発戦略
shinaps
1
380
AI開発ツールCreateがAnythingになったよ
tendasato
0
120
「何となくテストする」を卒業するためにプロダクトが動く仕組みを理解しよう
kawabeaver
0
280
会社紹介資料 / Sansan Company Profile
sansan33
PRO
6
380k
バイブスに「型」を!Kent Beckに学ぶ、AI時代のテスト駆動開発
amixedcolor
2
500
Function Body Macros で、SwiftUI の View に Accessibility Identifier を自動付与する/Function Body Macros: Autogenerate accessibility identifiers for SwiftUI Views
miichan
2
180
Flutterでキャッチしないエラーはどこに行く
taiju59
0
220
Snowflakeの生成AI機能を活用したデータ分析アプリの作成 〜Cortex AnalystとCortex Searchの活用とStreamlitアプリでの利用〜
nayuts
1
460
2025年にHCP Vaultを学び直して見えた景色 / Lessons and New Perspectives from Relearning HCP Vault in 2025
aeonpeople
0
230
Language Update: Java
skrb
2
290
AIのグローバルトレンド2025 #scrummikawa / global ai trend
kyonmm
PRO
1
260
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
696
190k
Art, The Web, and Tiny UX
lynnandtonic
302
21k
Context Engineering - Making Every Token Count
addyosmani
1
23
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
131
19k
Making Projects Easy
brettharned
117
6.4k
Fireside Chat
paigeccino
39
3.6k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
580
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Designing for humans not robots
tammielis
253
25k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
Transcript
本資料は、トグルホールディングス株式会社に許可なく複製・転載をしないようお願いします。 Perl歴約10年のエンジニアが フルスタック TypeScriptに 出会ってみた
© toggle holdings inc. 2 papix(パピックス) 所属 2025/01〜 トグルホールディングス株式会社 出⾝
Perl界隈 - (⼀社)JPA理事 - 湘南.pm / 湘.なんか ⾸魁 趣味 旅⾏、料理 SNS X: @__papix__ / id:papix
© toggle holdings inc. 3 本⽇の式次第 • ⼆部構成です • 第⼀部:
papix(10分) ◦ トグルホールディングスのご紹介 ◦ Perl歴約10年のエンジニアが フルスタックTypeScriptに出会ってみた • 第⼆部: ⽊下(10分) ◦ TS未経験から3ヶ⽉で新機能開発した話
© toggle holdings inc. 4 トグルホールディングスの ご紹介
© toggle holdings inc. 5 わたしたちのパーパス 新しい何かをつくる。 そこに宿る喜びを、わたしたちは愛しています。 新しい何かによって、 古い産業を、硬直化した社会を、
そして、人々の生活をかえられる。 その可能性を、わたしたちは信じています。 この愛と可能性を体現する中で、わたしたち自身もかわっていく。 そしてまた、つくって、かえて、かわっていく。 わたしたちは、この挑戦を不断に続けていきます。 つくる・かえる・かわる PURPOSE
不動産開発に、⾰新的な業務インフラを 1. 開発余地のある⼟地探索 2. ⼟地‧道路測量 3. 建物企画 4. 相場分析‧投資シミュレーション 5.
販促資料 (BIM) 6. 詳細設計‧建築確認
© toggle holdings inc. 7 デベNAVI • https://tsukuru-ai.co.jp/deve-navi
© toggle holdings inc. 8
© toggle holdings inc. 9 デベNAVIの構成 デベNAVI Frontend デベNAVI Backend
PlanetScaleなどSaaS 各種API 他チームが開発
© toggle holdings inc. 10 https://engineer.toggle.co.jp/
© toggle holdings inc. 11 Perl歴約10年のエンジニアが フルスタックTypeScriptに出会ってみた
© toggle holdings inc. 12 これまでのあらすじ • ⼤学に⼊ってC⾔語、Javaなどを学ぶ • 研究室でPerlに出会う(出会ってしまう)
• 以後、2社で約10年Perl主体でWebサービス開発 ◦ フロントエンド(TypeScript)は⽚⼿間程度 • 2025年1⽉、トグルホールディングス⼊社 ◦ 突如「フルスタックTypeScript」の世界へ…
© toggle holdings inc. 13 Perl? • 動的型付け⾔語 ◦ =型がない!!!!!!!!
◦ 数値や⽂字列は「よしな」に扱われる • 内部的に型はあるが、ユーザーは意識せずに使える my $number = 1; my $string = $number . " + 1 = 2"; print $string; # => "1 + 1 = 2"
© toggle holdings inc. 14 Perl? • 「classないんでしょ」、「try/catchないんでしょ」… ◦ 着実に進化しているんですよ!
▪ 5.38.0でclass構⽂が追加 ▪ 5.40.0でtry/catch構⽂が安定版に • 「スイスアーミーナイフ」を作る道具としてのPerlは令和に なっても以前便利と思います
© toggle holdings inc. 15 閑話休題
© toggle holdings inc. 16 フルスタックTypeScriptに出会ってみた • 「型がない」世界から「型がある」世界へ… ◦ まさに「異世界転⽣」
• しかし、⾼速にキャッチアップして成果を出せた ◦ その理由は…? ▪ 会社‧チーム: 環境構築の⾼速化‧シンプル化 ▪ 個⼈: AI技術の活⽤
© toggle holdings inc. 17 環境構築の⾼速化‧シンプル化
© toggle holdings inc. 18 環境構築の⾼速化‧シンプル化 • ⼊社して最初の壁が「環境構築」 ◦ 必須ツールの導⼊、ライブラリのインストール、データ
ベースの初期化‧初期データ投⼊… ◦ ⼿順書があっても、誤っていたり古かったりすることも… • ここを短縮できれば、⾼速にプロダクト開発に参加できる ◦ より素早くドメインの理解に進める ◦ より素早くコードを書いて、成果を出せる
© toggle holdings inc. 19 環境構築の⾼速化‧シンプル化 • 環境構築の⾼速化‧シンプル化の鍵 ◦ GitHub
Codespaces ◦ PlanetScale
© toggle holdings inc. 20 GitHub Codespaces • GitHubが提供する開発環境 ◦
GitHubからボタンをポチるだけで、即座に開発環境が⽴ち 上がり、VSCodeから操作できる • → 必須ツールの導⼊が不要になる! ◦ ⼿順もシンプルになる(ボタンを押すだけ) • GitHub Codespacesでしか開発できない、ということはない ◦ 従来通り、⾃分のマシンに開発環境を構築することも可能
© toggle holdings inc. 21 PlanetScale • フルマネージドMySQL • ブランチ機能がある!
◦ 例: mainからdevelを⽤意する ▪ develはmainから独⽴していて、schemaの変更やデー タの追加‧削除ができる ▪ 作ったdevelブランチは、作った時点のmainブランチ のレコードが格納されている
© toggle holdings inc. 22
© toggle holdings inc. 23 PlanetScale • 更に、schemaのマージも可能! ◦ develの変更をmainに取り込む、など
© toggle holdings inc. 24
© toggle holdings inc. 25 PlanetScale • GitHubのブランチごとにPlanetScaleのブランチを作る • →
データベースの初期化‧初期データ投⼊を任せられる ◦ ⼿順もシンプルになる(コマンドを⼊⼒するだけ) • 万が⼀、データベースの中⾝がおかしくなっても、削除して作 り直せばOK!というのも嬉しいポイント
© toggle holdings inc. 26 AI技術の活⽤
© toggle holdings inc. 27 AI技術の活⽤ • 新しい⾔語を学ぶとき、過去の経験は活きる ◦ =TypeScriptを学ぶにあたって、Perlの経験を活かす
• 「Perlでならこう書く、ではTypeScriptなら…?」 ◦ →AI(ChatGPT)に聞こう!!!
© toggle holdings inc. 28
© toggle holdings inc. 29
© toggle holdings inc. 30
© toggle holdings inc. 31
© toggle holdings inc. 32 AI技術の活⽤ • まずはPerlとTypeScriptの知識を紐づけて、取っ掛かりを作る ◦ 「Perlのアレは、TypeScriptのコレなんだな…」
• 慣れると最初からTypeScriptのことを考えて書けるようになる • Perlでもちゃんと教えてくれるので、「他の⾔語から TypeScriptへの⼊⾨」でも確実に使えるテクニック(?)
© toggle holdings inc. 33 まとめ
© toggle holdings inc. 34 まとめ • フルスタックTypeScriptを⾼速にキャッチアップする施策 ◦ 会社‧チーム:
環境構築の⾼速化‧シンプル化 ◦ 個⼈: AI技術の活⽤ • 感想 ◦ 「フルスタックTypeScript」だったので、新たに学ぶ⾔語 が1つで済んだ、という点もプラスに感じた ◦ 最初の成果に⾄るまでのインプットが最⼩限で済んだ
© toggle holdings inc. 35 ご清聴ありがとうございました!