Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
翻訳した英単語をそのまま 使うのは今日で終わりにしよう!
junmikai
January 22, 2021
Programming
0
1.4k
翻訳した英単語をそのまま 使うのは今日で終わりにしよう!
・開催日
2021/1/27
・イベント名
リーダブルコード LT会
https://rakus.connpass.com/event/199845/
junmikai
January 22, 2021
Tweet
Share
More Decks by junmikai
See All by junmikai
agoraのドキュメントはまずここから読め!
junmikai
0
98
今年の抱負
junmikai
0
72
エンジニア転職できるかはこの質問1つでわかります
junmikai
0
100
明日からドヤりたくなるネット基礎知識
junmikai
0
56
とりあえずモダンな技術を インプットしまくって 失敗したお話
junmikai
1
490
Other Decks in Programming
See All in Programming
Windows コンテナ Dojo 第5回 OpenShift で学ぶ Kubernetes 入門
oniak3ibm
PRO
0
200
動画合成アーキテクチャを実装してみて
satorunooshie
0
580
夕食断食にTRY!/for-lt-12th
pachikuriii
0
250
Lookerとdbtの共存
ttccddtoki
0
670
ZOZOTOWNにおけるDatadogの活用と、それを支える全社管理者の取り組み / 2022-07-27
tippy
1
3.6k
プロダクトの成長とSREと
takuyatezuka
0
130
Pythonによる開発をアップデートするライブラリの紹介
daikikatsuragawa
1
1.3k
SwiftUIで「意図」を伝える / swiftui_intention
uhooi
2
150
ベストプラクティス・ドリフト
sssssssssssshhhhhhhhhh
1
220
レビュー駆動学習のススメ_StaPy#83
soogie
0
330
Now in Android Overview
aosa4054
1
430
kintone × LINE Bot で餃子検定Botを作った話
naberina
0
350
Featured
See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
15
990
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
316
19k
Building Better People: How to give real-time feedback that sticks.
wjessup
344
17k
Practical Orchestrator
shlominoach
178
8.7k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
15
3.9k
Testing 201, or: Great Expectations
jmmastey
21
5.5k
Support Driven Design
roundedbygravity
87
8.6k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
151
13k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
269
12k
Building an army of robots
kneath
299
40k
Designing for humans not robots
tammielis
242
24k
From Idea to $5000 a Month in 5 Months
shpigford
373
44k
Transcript
翻訳した英単語をそのまま 使うのは今日で終わりにしよう! 実際に使用した関数を見直そう!
▪ 自己紹介 ▶ 現職 2020年6月、渋谷のベンチャー企業にフロントエンドエンジニアとして 未経験で入社。 エンジニア歴は半年! ▶ 主な使用言語・フレームワーク Vue.js
/ Nuxt.jsを中心に Typescript も導入中。 写真
① 関数の中身を隠しても何の処理をしているか 理解できる名前をつけよう! ② 関数名の上に処理のコメントを少しでも減らそう! (コメントのコメントをしない from:リーダブルコード) 今回の目標
▪ 今回使用するリーダブルコードのテクニック ▶ 明確な単語を選ぶ ex.) size()は大きさ?長さ?個数?と色々想像できてしまう。この場合 height()の方がいい ▶ 汎用的な名前は避ける ex.)change()だと変わったという情報しか伝わってこない。
▶ 誤解されやすい名前は避ける ex.) 値の有無確認にvalueRead()はややこしい。readはこれから読むのか既に読み取ったのかわからない か ら。isValue()などの方がわかりやすい。
例① : 外部ページにアクセスする 機能 ボタンをクリックすると外部ページにアクセスする デザインサンプル 外部サイトへ 実務で命名した関数名 externalLink() 問題点
external(外部)のlinkという意味はわかったが ボタンをクリックしたら何のアクションが発生す るのかわからない。
改善案:jumpToExternalLink() 移動するを飛ぶに変換。 jumpToという単語は~に飛び跳ねるという意味。 飛ぶ(jumpTo)+外部リンク(ExternalLink)で関数名を見ただけで意味がわ かるようになる。 goToExternalLink()でもいいかも・・・
②宿泊フォームを追加する 機能 ボタンをクリックすると宿泊入力フォームが1つ増える ここでいう宿泊は予約を指す デザインサンプル 実務で命名した関数名 lodgmentDateAdd 問題点 lodgmentという単語が難しいため誰もが読めるわ けではない(TOEIC600点以上)
追加する 宿泊日
改善案:addReserveDate() reserveはホテルの部屋などを予約すること。 予約=ホテルに泊まるという行為なので宿泊と同じ意味になる。 後はDateを追加する事で宿泊の日程だと意味がわかる。 ちなみに泊まった日を報告する場合の入力フォームの場合は予約が使えな いのでaddStayData()がいいだろう
③資格取得年月日の日付を入力した時 機能 公的資格取得年月日の入力フォームに値を入力し た時、その値をセットする(changeイベント) デザインサンプル 実務で命名した関数名 changeAcquisitionQualificationDate() 問題点 Acquisition(習得)やQualificationが難しい (それぞれ英検準1級、2級以上)
資格習得日が変わった時発火する事はわかったが文 字数が長すぎる。その上、変わったら何が起こるかが わからない。cssが変わるの?他のフォームが変わる の?など色々イメージできてしまう。 追加する 1995/12/12 公的資格取得年月日
改善案:updateLicenseDate() 資格を免許に変換して馴染みやすい licenseを使用。免許と資格が厳密に意 味は違うが資格関係の入力フォームはここしかないため問題ない。 changeはイベントが発火する部分を見れば理解できるため関数名は発火した 後の処理を書いた方がわかりやすい。 値を更新するという意味でupdateを使用。recordでもいいかなーと考えました が入力フォームの値が変わる事を考慮すると updateの方がいいでしょう。
④機関を選択した時、別ボタンを押せるようにする 機能 機関を選択すると隣にある決定ボタンを押せるようにす る。選択されていない初期状態は決定ボタンはグレーで 押せないようになっている デザインサンプル 実務で命名した関数名 organizationSelected() 問題点 上記関数名だと機関選択フォームだけで完結する処
理だと思われる。右下のボタンを処理は関係ないん だなーと勘違いさせないように、値が存在するかどう か?という関数名にして「他のどこかが変わるんだ」と イメージしてもらうようにしよう リダブル機関 専門機関 戻る 決定 グレーから青に変更 (押せるようになる) ˅
改善案:isOrganization() リーダブルコード34pのブール値の命名にis,can,has等を使うといいとの事な のでisOrganizationSelectedになる。 しかし、これでは長すぎるのでisOrganizationにした。 同一ページでisOrganization(機関が存在するか?)を使用していなければ ここの関数はselectタブの事だな〜 と自然にわかるのでselectedは不要だと思います。
× 翻訳した英単語をそのまま突っ込む ◦ 誰もが知っている単語を組み合わせる ▼ わかりやすい関数名を作る事ができる!
自分が働いているアルサーガパートナーズ(株) では一緒に働く人を募集してます! QRコード(採用ページ) リンクはこちら 興味のある人は自分にTwitterDM(@miumitempe)か会社HPから連絡してください!