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
notch_man
August 23, 2023
Technology
0
72
本当に初心者目線で考えた時の技術選定の話
2023年度の筑波大学enPiTで使用した資料です。全4回+αでWeb開発の基礎を学ぶことが出来ます。
※notion資料は近日公開予定です。
notch_man
August 23, 2023
Tweet
Share
More Decks by notch_man
See All by notch_man
[第4回] Webサービス開発講座
notchman8600
0
28
新人的ソフトウェアサバイバルガイド:荒野に向かい、瓦礫にぶつかり、迷子になり、広野に赴く
notchman8600
1
880
最高の開発手法、アジャイルを捨てよう
notchman8600
0
21
[第1回] Webサービス開発講座
notchman8600
0
44
[第2回] Webサービス開発講座
notchman8600
0
52
[第3回] Webサービス開発講座
notchman8600
0
63
Pythonけものみち(という名のオレオレFWを作った言い訳)
notchman8600
0
22
Other Decks in Technology
See All in Technology
20241125 - AI 繪圖實戰魔法工作坊 @ 實踐大學
dpys
1
450
OPENLOGI Company Profile for engineer
hr01
1
18k
駆け出しリーダーとしての第一歩〜開発チームとの新しい関わり方〜 / Beginning Journey as Team Leader
kaonavi
0
110
Evolving Architecture
rainerhahnekamp
3
240
ゼロからわかる!!AWSの構成図を書いてみようワークショップ 問題&解答解説 #デッカイギ #羽田デッカイギおつ
_mossann_t
0
1.3k
comilioとCloudflare、そして未来へと向けて
oliver_diary
5
400
When Windows Meets Kubernetes…
pichuang
0
270
MasterMemory v3 最速確認会
yucchiy
0
340
embedパッケージを深掘りする / Deep Dive into embed Package in Go
task4233
0
150
Bring Your Own Container: When Containers Turn the Key to EDR Bypass/byoc-avtokyo2024
tkmru
0
770
20241228 - 成為最強魔法使!AI 實時生成比賽的策略 @ 2024 SD AI 年會
dpys
0
340
2025年の挑戦 コーポレートエンジニアの技術広報/techpr5
nishiuma
0
110
Featured
See All Featured
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
127
18k
Fireside Chat
paigeccino
34
3.1k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.4k
Being A Developer After 40
akosma
89
590k
Git: the NoSQL Database
bkeepers
PRO
427
64k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
6
490
Statistics for Hackers
jakevdp
797
220k
Writing Fast Ruby
sferik
628
61k
4 Signs Your Business is Dying
shpigford
182
22k
How to Think Like a Performance Engineer
csswizardry
22
1.3k
Transcript
技術選定の話 〜安易に〇〇を選ぶな〜 2023/5/10 Kentaro Miyake
2 おしながき 1. 自己紹介 2. 技術選定とは? 3. [実例で学ぶ] 技術選定で大火傷を負う方法 4.
現実的な技術選定とは? 5. [実例で学ぶ] 現実的な技術選定 6. とりあえず、みんなは技術選定をやめよう 7. まとめ
3 ⾃⼰紹介 クラウドソーシングサービスなどを 開発しています notch_man twitter: @notch_man8600 • 認定スクラムマスター(CSM) •
ラボのシステム開発の全責任を負う(辛い) • 学類パンフに載ったけど留年したよ(笑) • 現場で都合良く使われています [概要] • 2020年3月 香川高専卒業 • 2021年4月 筑波大編入 • enPiT2021(受講)&2022~(メンター) [略歴]
4 What is it? このトークは技術スタックの 優劣を決める話ではありません And, there is no
hate for Python
5 What is it? 技術選定で大火傷をしないために 技術選定で押さえるべきポイントを知る
6 DISCLAIMER • enPiT特有の問題に向き合うための技術選定の話です ◦ not 一般的な技術選定の話 • 現場ではこの考えを捨ててください •
私見が豊富に含まれます • 後半の火力が高めですが、ラジオだと思ってください
7 技術選定とは 道具選び
8 技術選定とは その考えは捨てよう
9 技術選定とは 次の電柱まで歩く方法を考える
10 技術選定とは 現実的に使い物になりそうなトンカチを見つけて そのトンカチで釘を打ち付けて とりあえず、木と木をくっつける 微妙にくっつかなかったらボンドで止める
11 1. 使い物になるトンカチを⾒つける
12 1. 使い物になるトンカチを⾒つける 明日までにWebサイト作っといて
13 1. 使い物になるトンカチを⾒つける
14 1. 使い物になるトンカチを⾒つける あなたはどう要望に応えますか?
15 1. 使い物になるトンカチを⾒つける • う~ん、WebサイトということはHTMLを触れば良さげ... • HTMLであればLAMP生やすか、時代はレンサバ! • いや、講義資料はnotionで十分だしそれで良くね? •
う~ん、俺はイケてるNext.jsで良い感じにSSRしてやるぜ! 使ったことがある or 使い方が見える もっとも簡単な方法を選びましょう!
16 1. 使い物になるトンカチを⾒つける [実例] トンカチ選びの失敗談
17 過去の失敗談 • う~ん、あのメンターがDjango最高!って言っていた • 別のメンターはGoを推している • 最近、TwitterでNext.js+Nest.jsが最高のWebFWだと言われるね • 時代はGoogle!時代はAngular!
• いや、俺はLaravelで攻める • あそこでオレオレしてる人が格好いい!憧れる!あれに成りたい! 全部アンチパターンです
18 1. 使い物になるトンカチを⾒つける 使ったことがある物以外使うな!
19 1. 使い物になるトンカチを⾒つける せめて、90%の確度で使えそうな物を選べ
20 技術選定とは 現実的に使い物になりそうなトンカチを見つけて そのトンカチで釘を打ち付けて とりあえず、木と木をくっつける 微妙にくっつかなかったらボンドで止める
21 2. トンカチで釘を打ち付ける 美しさ、作法、実行速度
22 2. トンカチで釘を打ち付ける 全て捨ててください
23 2. トンカチで釘を打ち付ける HTMLと決めたらHTMLで書いてください ex.) 自己紹介サイトを作る <!DOCTYPE> <html> <body> 私はnotch_man(23)です。
</body> </html>
24 2. トンカチで釘を打ち付ける これを早く作れ
25 2. トンカチで釘を打ち付ける • 格好いいCSSフレームワークは何だろう? • コードフォーマッタは何がおすすめ... • エディタはviかvimかnvimのどれが良いのか...? •
5年後も死なないHTMLを書くにはどういう命名規則で... • 良い情報提示のお作法を知りたい! よおこそ、富士の樹海へ
26 2. トンカチで釘を打ち付ける トンカチを持ったらさっさと釘を打て!
27 技術選定とは 現実的に使い物になりそうなトンカチを見つけて そのトンカチで釘を打ち付けて とりあえず、木と木をくっつける 微妙にくっつかなかったらボンドで止める
28 3. とりあえず、⽊と⽊を繋ぐ 先ほどの話ですが... • 格好いいCSSフレームワークは何だろう? • コードフォーマッタは何がおすすめ... • エディタはviかvimかnvimのどれが良いのか...?
• 5年後も死なないHTMLを書くにはどういう命名規則で... • 良い情報提示のお作法を知りたい!
29 3. とりあえず、⽊と⽊を繋ぐ 木と木が繋がれば良いんです
30 3. とりあえず、⽊と⽊を繋ぐ トンカチを持ったらさっさと釘を打て!
31 3. とりあえず、⽊と⽊を繋ぐ とりあえず、繋がればOK
32 2,3の事例 notch_manの経験 • ものづくりの美しさを追求するチームがありました • ソフトウェア設計やチームの在り方の議論を費やす • 気がついたら、作法を巡りヒートアップ •
コンテストの2週間前に物が出来ていない • 付け焼き刃でプロダクトを開発 • 結局、終わって1週間もすると誰も触れないプログラムが残る 樹海を歩いた意味が...
33 技術選定とは 現実的に使い物になりそうなトンカチを見つけて そのトンカチで釘を打ち付けて とりあえず、木と木をくっつける 微妙にくっつかなかったらボンドで止める
34 4. ボンドで⽌める 木と木が繋がれば良いんです
35 4. ボンドで⽌める 最悪、手を添え続けなさい
36 4. ボンドで⽌める 手→ボンド
37 4. ボンドで応急処置をする • 文字が小さいんですけど? ex.) 文字を大きくしたバージョン <!DOCTYPE> <html> <body>
<h1> 私はnotch_man(23)です。</h1> </body> </html>
38 4. ボンドで応急処置をする 変更箇所1行でとりあえず解決
39 4. ボンドで応急処置をする • 変更方法が分かりやすい • 変更した痕跡が残りやすい • 将来的にきちんと治さないといけないことが自覚できる ◦
付け焼き刃は分かりやすく見えます(分かっているものであれば) • 変更を素早く反映することができる ◦ 最初のHTMLをデプロイした方法は知っている ◦ 確実に変更を届けることができる
40 4. のアンチパターン • text-sm,text-lg,text-xlどれにしよう...? • えっと、それぞれの値は... ◦ 0.875rem、remって何だよ... •
あ~、お客さんの環境は高DIPだから手元と値が狂う... • 私は〇〇〇〇wind分からないです ◦ よし、<h1 style=”font-size:100px”>で対応だ! • あらゆる所に現われる !important 結局、道具の使い方を間違えることになる
41 4. ボンドで応急処置をする 愚直な方法で治せる物を使おう
42 4. ボンドで応急処置をする 治し方が分からない物を使わない
43 現実的な技術選定とは 以下の4つを押さえた物にしましょう 1. 何となく(90%以上の自信)で使えそうなトンカチ 2. 誰でも使えそうなトンカチ 3. 治し方が現実的に分かる物 4.
治した跡が分かりやすい物
44 現実的な技術選定とは 現実的に使い物になりそうなトンカチを見つけて => ホームセンターのトンカチなら誰でも使える そのトンカチで釘を打ち付けて => 釘の打ち方は中学校で習ったからとりあえず出来そう とりあえず、木と木をくっつける =>
くっつけばOK! 微妙にくっつかなかったらボンドで止める => 木工用ボンドは小学校で使ったことある => 跡が分かりやすいのでそのうち良い感じに治そう!
45 現実的な技術選定とは 甘言に流されず分からない物は使わない
46 弊ラボでは技術選定をどうしたか? • Pythonをメインにすることはこれまで通り ◦ メンバーが最も触っている言語である ◦ 元々のコードベースを踏襲する ◦ 新規に入る人もPythonの履修率は高い
• 今後はGo”も”使っていく ◦ 家庭菜園では使い始めている ◦ 一部、Goでの開発を行なった経験がある ◦ notch_manが対応できる
47 現実的な技術選定の補⾜ 上級者向けテク
48 フロントエンドの技術選定について • notch_manの独断でReactを採用 ◦ メンバーはほぼ分からない ◦ これはアンチパターン • notch_man1人で全てをカバー出来るので採用
◦ 現状、React化の範囲は狭い ◦ 最悪、分からなくなったら素JSに置き換えられる仕組みを導入 ◦ Webのデファクトになりつつあるので今後 React勢が来ることを期待
49 現実的な技術選定の補⾜ あなたが全責任を負えるなら好きにしろ
50 現実的な技術選定の補⾜ ただし、アンチパターンである
51 ところで、技術選定の話を⽌めませんか? ex.) 私たちはデータベースを使うべきか否か... • 辛辣ですが、このレベルの話はそもそも技術レベルが足りません • 使う決断をしても十中八九大火傷を負います • 90%の理解があったとしたら、これらの判断はできます
◦ どこでDBを使うか使わないか? ◦ RDBかオブジェクトDBを使うか...? “この時点で既に目の前のトンカチではないです”
52 技術選定の話をするなら • 使えるトンカチを増やしましょう ◦ 技術に対する知見をためましょう! ◦ 普段から様々な技術に触れてみましょう! ◦ 春学期は、新しいトンカチを探す旅をするのに絶好の機会です
◦ メンターはトンカチ探しが大好きです • 使えるトンカチの限界に挑んでみましょう ◦ 去年のチームで大量のデータを埋め込んだところがあります ◦ HTML+CSSはチューリング完全です ▪ https://www.youtube.com/watch?v=Ak_sWZyHi3E
53 まとめ 技術選定で押さえるべきポイント a. (90%以上の自信)何となくで使えそうな物を選ぶ b. (a)が、誰でも使えそうなトンカチ c. トンカチの使い方を間違えたときの治し方が分かるか? d.
将来の改修に備えて、修復跡が残る物であるか? 技術選定に捕らわれず使える物で どんどん物作りをやりましょう!