id:radiocat です。6/26、27に開催されたScrum Fest Osaka 2020に参加し、登壇させて頂きました。イベントをレポートします。 Scrum Fest Osaka 2020とは？ どんなイベント？ 会場はDiscord セションはZoom 数々の企業・団体スポンサーが支援 基調講演 ちょっとした「うっ」は成長のチャンス 登壇レポート スクラムちゃうがなと言われてもやってみぃひん？ ふりかえりが重要ではない！？ふりかえりの活用方法について 非秩序を乗りこなすアジャイルなイベントでした Scrum Fest Osaka 2020とは？ www.scrumosaka.org 公式サイトには次のように書かれています。 Scrum Fest Osakaは スクラム の初心者からエキスパート、ユーザー企業から開発企業、立場の異なる様々な人々が集まる学びの場です。 昨年が初開催で、今回が2回目となるイベントです。前回は2トラックで20以上のセッションが行われ、関西としては スクラム に限らずエンジニア向けイベントとして最大級のイベントです。全国から様々な境遇や立場の人が集まって、それぞれの取り組みや知見を共有しあう、参加者全員の学びの場です。 ちなみに、昨年と今回オンライン開催に変更される前まで会場となる予定だった 関西大学 梅田キャンパス KANDAI MeRISE は弊社の大阪オフィスのすぐ隣です。 どんなイベント？ 登壇者は昨年から公募され、既に決まっていましたが、コロナの影響でオンライン開催に変更となり、全国19コミュニ ティー を集めて各トラック並行で開催されるという異例の内容・規模となりました。19トラックともなると、ご覧のとおり一覧で見ることができない規模です。 19トラックのイベント一覧 オンライン開催ということで、参加者は Discord と Zoom の利用が必須となりました。 会場はDiscord 参加の申込みを行って運営側へDiscordのアカウントを連絡するとイベント専用のDiscordサーバへ招待されます。Discordにはイベントのお知らせや、各種連絡、当日のオープニングや基調講演で使われるメインチャンネル、各コミュニ ティー のチャンネルに加え、雑談、トイレ？、2次会など、参加者が思い思いに参加できる無数のチャンネルがあります。 Discordの画面 イベントの申し込みが終わるとイベント開催の数日前からDiscordに招待され、当日だけでなく準備中の状況なども確認できるようになっていました。もちろん、開催前から参加者同士で交流することができます。そして、開催後の現在も継続して交流可能です。開催当日を軸としつつも、その前後の時間も使って参加者全員でイベントを作り上げていく形が、イベントの新しいスタイルとして、オンラインイベントの可能性を感じることができます。 セションはZoom 開催当日は、セッション開催の時間になるとDiscordのチャンネルにZoomのURLが流れてきます。そこからZoom上で登壇者の発表を聞くという流れです。 セッションの様子 登壇者から聴講者への一方向のセッションだけでなく、オンラインの視聴者を巻き込んだりチャットツールを使ってディスカッションするなど、オンラインでの新たな試みを行っているセッションもありました。 数々の企業・団体スポンサーが支援 アジャイル を実践中の様々な企業・団体がスポンサーとしてイベントを支援しています。弊社もシルバースポンサーとして参加させて頂きました。 スポンサーの紹介 オープニングイベントでしっかり紹介して頂いていました。参加したイベントのスポンサーに自社が名を連ねているのはいつ見ても嬉しいものです。 基調講演 基調講演は アジャイル コーチであり、『SCRUM BOOT CAMP THE BOOK』の共著者としてもおなじみの株式会社アト ラク タの永瀬さんによる『今あえての スクラム 』でした。 真ん中が空いた、縦書きの、変わったスライドになっているのは理由があります。なんと、画面共有でスライドを投影するのではなく、ご本人が真ん中に映りながらバーチャル背景にスライドを投影するというスタイルで発表されたのです！ その様子は参加者だけのお楽しみなのでご紹介できなくて残念ですが、背景に使われたスライドを見ながらなんとなく想像していただければと思います。 ちょっとした「うっ」は成長のチャンス 今回の登壇にあたり、イベントがオンライン開催に変更されたことで最初は「うっ」と思われたとのことです。これは私も登壇させて頂いたのでわかります。オンラインという形で前提が変わって、どのようなセッションを行おうかと戸惑いました。しかし、このような状況にチャレンジすることは成長のチャンスでもあるということです。 スクラム は非秩序な状況を乗りこなすことに適した フレームワーク です。 染み付いた行動の癖で、予見できる範囲でスプリントを回していないか？ ふりかえりでプロブレムに対するトライばかりしていないか？ 行動する前に既存の価値観で判断してしまっていないか？ 変化の時代だからこそチャレンジしてみよう。やってみて、失敗して、学習しよう。そういう内容のセッションでした。そして、前述のように背景にスライドを投影するという発表にチャレンジすることでもそれを伝えていただいた内容だったと思います。この発表を聞くだけでもイベントに参加する価値のある内容でした。 登壇レポート 2日目は19トラックに分かれて各セッションが行われました。セッションだけでなく、各コミュニ ティー のDiscordチャンネルでは様々な情報交換がされていてとても賑わっていました。 ちなみに、セッションは録画され（登壇者が承諾した場合）、当日の参加者には約1ヶ月間公開されているので、19トラックの発表を後日ゆっくり見ることができます。アフターイベントとして、録画試聴会なども開催されています。これもオンラインイベントの新たなスタイルです。 最後に、弊社から登壇させて頂いた内容についてレポートさせてください。 スクラム ちゃうがなと言われてもやってみぃひん？ スクラム は理解は容易ですが、習得は困難だと言われています。実際にやろうとすると、思ったとおりできないと感じることが多々あります。特に我々のような中小企業の開発の現場では制約も多く、長年やってきた従来型の 開発プロセス を全て刷新して充分環境を整えてから スクラム を導入できるケースは稀です（もちろん中小企業ではなくても様々な制約はあると思いますが、今回の発表は我々の境遇に視点をあてた内容になっています）。同じ境遇の方々に我々の取り組みが参考になればとの思いで発表させていただきました。 スクラム ちゃうがな問題 少しずつ カイゼン する カイゼン 文化をつくるには、まず スクラム のベースとも言える PDCA を回す状態をつくることです。課題が山積していていることは認識していても、計画を立てて、実行後に振り返る流れが習慣化していなければ カイゼン は進みません。 それができたらチームで開発している状態をつくることに着手します。従来型の 開発プロセス でよくある課題が、縦割りで担当者に業務が アサイ ンされ、隣の人が何をやっているかもわからない状態で仕事をしている状態です。スケジュールマネジメントをしっかり行い、チームとして成果を出せる状態をつくることで、個の活動からチームの活動になり、 カイゼン をチームの文化にする土台ができます。 少しずつ カイゼン する（私たちの場合） ありたい姿を探る カイゼン は進みましたが、いつ スクラム になるかのゴールが見えませんでした。そこでチームとして「中小企業のエンジニアチームを楽にするモデルをつくる」というビジョンを設定し、それに到達するまでのロードマップをつくりました。ロードマップの段階を踏んでいくことで スクラム に近づき、チームのあるべき姿に到達させるのです。 チームのロードマップ 原則を土台にする チームのロードマップをつくって進めていたものの、自分たちの視点に偏っていて顧客視点が持てていないことに気づきました。自分たちの カイゼン を進めてチームをアップデートしても顧客に価値を届けられなければ意味がありません。 アジャイル の原則に立ち返れば当たり前のことができていないと気づいたのです。 原則にむきなおる 経験から学ぶ これらの取り組みから、 カイゼン とありたい姿、原則の土台を3つの柱として経験しながら学ぶことで スクラム に近づくと考えました。これは経験学習というモデルをベースにしています。 経験から学ぶチームで スクラム に近づく 「 スクラム ちゃうがな」から始まる 経験から学ぶモデルの中心には「意欲と信頼」があります。私たちは「 スクラム ちゃうがな」と感じて悩んだとき、何かを変えたいという意欲を持っています。つまり「 スクラム ちゃうがな」と感じたことは経験から学んで スクラム に近づくスタート地点なのです。 スクラム ちゃうがなから始まる オンラインならではのチャレンジ スライドではわかりませんが、イベント当日は途中でネコが合いの手やツッコミを入れる部分を、あらかじめ録音しておいた合成音声を流すことで自問自答する雰囲気を演出してみました。これも私なりのオンラインならではのチャレンジです。 ネコによるツッコミ ふりかえりが重要ではない！？ふりかえりの活用方法について 弊社からもう1名がふりかえりについて発表させて頂きました。発表は参加者と一緒にふりかえりについて考えるスタイルになっており、Discordのチャンネルで様々な意見が共有されていました。これもまたオンラインならではのスタイルです。 retrospective.connpass.com この発表は、再演イベントが企画されていますので内容の紹介は割愛させて頂きます。興味のあるかたはぜひイベントにご参加ください。 非秩序を乗りこなす アジャイル なイベントでした イベント全体を通して、参加者全員で変化に向き合って適応しようと取り組み、みんなでイベントの新しい形をつくりあげていく空気に溢れていました。イベント自体が アジャイル な体験だったと言えます。 オンラインでのこのようなイベントは世界レベルでみてもまだ事例が少ないのではないかと思います。そんな中で最終的に500人以上がDiscordに集まる大盛況のイベントとなったようです。そんなイベントを作り上げた実行委員のみなさんのコメントや裏話が Youtube で公開されていますので合わせてご覧ください。 スクラムフェス大阪 開催中に実行委員が感慨を語る Discordのチャンネルでは現在も様々な情報交換が行われており、その刺激を受けて参加者がそれぞれの現場で次のScrum Festに向けた取り組みをスタートさせています。私たちもまた次回のイベントで採択されるようにチャレンジを続けたいと思っています。 弊社でも様々なオンラインイベントが企画されており、取り組み内容を共有しています。7月末には楽楽明細開発チームの スクラム 事例の発表も予定されています。よろしければぜひご参加ください。 rakus.connpass.com

はじめに 　こんにちは、tuq376sです。今回は最近触り始めたE2Eテストの フレームワーク 、 TestCafe での初歩的な画面操作についてまとめたいと思います。 　というのも、TestCafeはTypeScriptを用いて記述するのですが。 そもそも自分がTypeScriptも初めてかつ、 JavaScript も自信を持ってすらすら書ける！　とは言えないレベルなので、 まずは「こう書けばとりあえず動作する」から覚えていこうという次第です。 　 はじめに アクセス先とテストケース 要素を取得 クリック テキストフィールドへの入力 ファイルアップロード おわりに アクセス先とテストケース 　まずはアクセス先の指定とテストケースの書き方から。 fixture("サンプル").page("https://hogehoge/"); test("テストケース1" , async (t) => { //テスト内容 }); test("テストケース2" , async (t) => { //テスト内容 }); 　 fixture は複数のテストケースをまとめるカテゴリの役割を果たします。 そして続く .page は始めにアクセスするURLを指定しています。 .beforeEach や .afterEach で事前・事後処理を記述することもできるようです。 　実際のテストケースは test で宣言します。実行結果ではこのテストケースごとに成功と失敗が返される形になります。 要素を取得 　ここからの内容は、 test の中で書いていきます。 まずは画面を操作していくために、ページ上の要素を変数に取得していきます。 const button = Selector('input').withAttribute("value","ボタン").nth(0); 　 Selector は指定した要素を取得します。ここにはタグ名だけではなく、class や id も指定することができます。 　 WithAttribute は、属性の名前と値で要素を絞り込みます。リンクやボタンなどであれば、だいたいこれで一意に絞れるのではないかと思います。 　それでも一意にならない時（自分は同じ属性を持った要素が並ぶ一覧画面でつまづきました）、便利なのが nth です。これは条件に一致した要素のうち、上から何番目の要素を取得するかを指定できます。これが素敵なのは、HTML上で何番目になるかが同じであれば、もし属性の値が変更されたとしてもテストコードを書き直さずに済むところです。 クリック 　さて、ようやく画面自体の操作です。 await t.click('#nextLink'); 　クリック操作は click で行います。要素の指定は上記のようにidを直接書いたり、先ほどのSelectorで取得したものを渡したりします。 　ここで指定したものが複数に該当してしまっていると、エラーになってしまいますので注意です。（例えば一つしかボタンがないと思っていたら、実はhidden状態の同じボタンがもう一つ存在してたりとか……ありました） テキストフィールドへの入力 　続いて、テキストフィールドへの入力操作についてです。 const textArea = Selector('input').withAttribute("name","入力場所"); await t.typeText(textArea, "入力したい値"); 　 typeText を用います。Selectorで取得したテキストエリア要素と、入力する値を指定します。 　どうやら指定した要素をクリックしてフォーカスしてから入力を行っているようで、クリックした段階で正しくフォーカスできなかった場合、書き込みは行われないようです。 ファイルアップロード 　最後に、ファイルをアップロードする操作です。 await t.setFilesToUpload(linkInputFile, "ファイルパス"); 　 setFilesToUpload を使って、ファイルを設定する要素とファイルパスを記述します。ファイルパスは [ 'ファイル1', 'ファイル2', 'ファイル3' ] といったように複数を指定することも可能です。 おわりに 　というわけで、これらがわかれば最低限テストケースを作って画面操作してみる、ということはできるはずです。 　テストと言いつつ アサーション には触れられていませんが、そちらはまたもう少し理解できたら、いずれ記事にしてみたいなと思います。

はじめに 技術広報のitoken1013です。こんにちは。 先日6/17(水) 、当社主催のMeetup 『SaaSを支える品質担保術/レガシーコード、アーキテクチャ、EOL』 を開催いたしました。 今や ラク スの恒例行事となりましたMeetupですが、今回は初のオンライン開催となり、 40名超のお客様にご参加いただけました。 今回は当日の発表内容について、簡単にご紹介をさせていただければと思います。 イベントテーマ概要 ラク スでは数多くの to B 向け SaaS の開発を行っています。 サービスにはこれから新たにリリース予定のものもあれば、 クラウド サービスの黎明期から存在する歴史の深いサービスまで、多くのお客様のご支持によって幅広く展開させていただいています。 今回はそんなサービスの中から代表し、以下の3つのサービスがどのような品質担保を行っているかをエンジニアから紹介させていただきました。 メールディーラー チャットディーラー 楽楽労務 発表の紹介 社内最長老のシステムに PHPUnit で立ち向かう方法 リリースから18年ほど稼働しているメールディーラーを担当中の柳瀬から、 EOLを迎えた PHP をバージョンアップした際の経験を紹介させていただきました。 当時 PHP 歴3カ月だった柳瀬が直面した突然の全機能テストを乗り越えた事例について、語られています。 speakerdeck.com 正攻法はあるのか !? 泥臭く戦った Node.js バージョンアップ一部始終 次は同じくEOLを迎えたNode.jsを 6系 → 10系にバージョンアップすることとなったチャットディーラーでの濃密な戦いを、西原が発表させていただきました。 調査・テスト（× 3回）・リリース後のトラブル対応、そこから得た学びが示されています。 タイトルの通り「泥臭いバージョンアップ」にピンと来る方には、共感をいただけるはずです。 Rakus MeetUp 正攻法はあるのか!?泥臭く戦ったNode.jsバージョンアップ一部始終 from masatonishihara www.slideshare.net ArchUnit で Java / Kotlin アプリケーションの アーキテクチャ を CI する 最後は当社のリードエンジニアである川並です。 開発プロセス の中でコードレビューは取り入れられていても、 アーキテクチャ 観点でのレビューや全員が同じ設計レベルで開発を行うのは、難易度が高いことかと思います。 川並が担当する楽楽 労務 ではそんな問題に対し、 ArchUnit を使った アーキテクチャ 観点での品質担保に取り組んでいます。 speakerdeck.com 終わりに 初のオンライン開催となりましたMeetupですが、ご参加いただきました皆様のおかげで、 高い満足度をいただくことができました。 Meetupは来月・再来月も開催を予定しておりますので、ご興味のある方はお申込みいただけますと幸いです。 詳しいイベント情報については、Connpassをご確認ください。 ありがとうございました！ rakus.connpass.com

今後の新サービスの立ち上げに向けて技術検証を行う技術推進課に所属している鈴木（ @moomooya ）です。今年度から新設の部署に（課長とふたりぼっちで）異動となりました。 最近マイクロサービスと関連して オブジェクト指向 について取り組んでいるので、 デメテル の法則に関する記事を書いてみようと思います。タイトルは1度くらい煽りタイトルをつけてみたかったので出来心です。 デメテル の法則って？ デメテル の法則(LoD: Law of Demeter)は ノースイースタン大学で作成されたガイドライン が原典となり、 達人プログラマー でも（あまり詳しくは書かれていませんが）紹介されています。 ちなみにみんな大好き Wikipedia ではこのように説明されています。 簡潔に言うと「直接の友達とだけ話すこと」と要約できる。基本的な考え方は、任意のオブジェクトが自分以外（サブ コンポーネント 含む）の構造やプロパティに対して持っている仮定を最小限にすべきであるという点にある。 ―― Wikipedia - デメテルの法則 より抜粋 なんとなくわかりますが、実装レベルでどうすればいいのか理解するにはもう少し説明がほしいところです。具体的な対応方法としては 「メンバを直接参照せずにアクセッサ（getter/setter）経由で参照すればいい」 とか 「オブジェクトのメンバを直接参照しない」 「オブジェクトのメンバのメンバを直接参照しない」 とよく言われています。 Java のサンプルコードで見てみましょう。お題は乗り物です。 // Demeter1.java class Engine { // エンジンクラス String status; } class Vehicle { // 乗り物クラス Engine engine; Vehicle() { engine = new Engine(); } } public class Demeter { public static void main(String[] args) { Vehicle vehicle = new Vehicle(); vehicle.engine.status = "発進" ; // ×××オブジェクトの内部を直接操作しない××× System.out.println(vehicle.engine.status); } } これは vehicle.engine.status で直接参照しているため デメテル の法則に違反している例です。 「メンバを直接参照せずにアクセッサ（getter/setter）経由で参照すればいい」んでしょ？ // Demeter2.java class Engine { protected String status; // ★getter/setter作った String getStatus() { return status; } void setStatus(String status) { this .status = status; } } class Vehicle { protected Engine engine; Vehicle() { engine = new Engine(); } // ★getter作った Engine getEngine() { return engine; } } public class Demeter { public static void main(String[] args) { Vehicle vehicle = new Vehicle(); vehicle.getEngine().setStatus( "発進" ); // ★getter/setter使って更新 System.out.println(vehicle.getEngine().getStatus()); } } ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ お可愛いこと…… メンバ変数名にそのままget/setをつけたメソッドを用意したところで本質的には何も変わっていません。 ただの素直か！ メンバを protected (または private でも)にしているのでリードオンリー／ライトオンリーなどの制御は可能ですが 疎結合 にはなりません。 このへんは IDE の功罪 というかgetter/setterの自動生成によって洗脳されてしまっている人も結構いる気がします。 さらに言えば vehicle.getEngine().setStatus("発進"); の部分がオブジェクトの内部構造(Vehicle内のEngineの構造)を意識してしまっています。 「オブジェクトのメンバのメンバを直接参照しない」ようにすればいいの？ // Demeter3.java class Engine { protected String status; String getStatus() { return status; } void setStatus(String status) { this .status = status; } } class Vehicle { protected Engine engine; Vehicle() { engine = new Engine(); } Engine getEngine() { return engine; } // ★engine用のgetter/setter作った String getEngineStatus() { return engine.getStatus(); } void setEngineStatus(String status) { engine.setStatus(status); } } public class Demeter { public static void main(String[] args) { Vehicle vehicle = new Vehicle(); vehicle.setEngineStatus( "発進" ); // ★Engineのメソッドを利用 System.out.println(vehicle.getEngineStatus()); } } ・ ・ ・ ・ ・ ・ ・ ・ ・ ・ ` ﾆ|ュ _二,　　　　''''７　 _二,　 | ヽヽ_」_」_　_|＿　:/　ﾍ 入呈 　 _ノ ､　　￣（￣　 _ノ　 |__丿　} .-'　ﾉ よ　{_,,　.| 　｀￣　　　　　　　　 ｀ 　　　,,...-=ミミミミﾐヽ､ 　　/ミ////////////ﾊ 　./ミ;;;;;:////////////} 　{:::ﾐ　　｀ヾ/////////ﾘ 　.{;;;;:　　　: :.////////ﾉ 　r､ﾐ_,,,＿,,;;;::://////ｿ‐, 　{iﾊ〔i77777ﾊ77777!〕:/ 　ヽ.Ｙゝ___ノ　::ゝ_;;;;//ﾉ 　 　 ',　　::i ､,//////{　　　　　　　　,､ 　　 　',　 ,ｨ彡//////＞､＿＿＿__//〉 　　　ノヽ´￣;///////////////////ｧ-=ｭ ─''"{: : :.＼_;;;///////////////////////Ｙ ､: : : |: : : :.Ｙ /＼　//: : /　..:::".:://///////ﾊ : ﾍ: :.|: : : : :{'　　 ｀/: :／...:....::////////////ﾘ ､: :ヽ:{: : : : :.}　　 /／: :＼:://////////////ﾊ : ＼: :{: : : : :.}　 ／:::: : : : :＼/////////////ﾊ : : : ヽﾍ: : : :.!／: :::::::::..: : : : :.ヽ////////////} : : : : : ＼,ｨ'": : :.::::::::::::::.: : : ／////////////ﾊ : : : :＞'i: :::.:.:.: :::::::::::::::::: :///////////////// : ://:./:∪:::::::: ::::::::::::::::://///////////////// :（;': /::: : ::::::::: ::::::::::::://///////////∠////// Ｙ: （:::: : : :::::: ::::::://///////////'''`ミミ:ヽ://// .＼: : : : : :::: :::／///////////ノ: : :::::.: :::::///// 　 /ヽ; : : : ／////////-'''":{::::.: : : :::::::::::///// . /: r.､二､:{: : : ＞':::::: : : ::: : :ゝ: ::.:.::::::::////／ /: : ゝ-､　｀ヽ-{: : : : : : : :::::.:.:.:.:::::://////／ {: : :._／　　　　∨: : : ::::: : : : :.///////／ Vehicle と Engine の関連を Vehicle 内に移譲しているのでだいぶ良くなってはいます。これだと Engine （原動機）が Human （人力）に変わったとしても Vehicle の修正だけで済み、mainメソッドは内部構造（動力）を意識しなくてよくなりました。 しかし Engine のステータスが "発進" なのか 1 なのかはmainメソッド側では意識する必要がないものです。 さらに現実的な実装として操作先のオブジェクトが準備完了かどうかを判定してからステータス更新を行うと思います。 // Demeter4.java class Engine { // ...略... } class Vehicle { // ...略... // ★動力があるか返す boolean isReady() { return engine != null ; } } public class Demeter { public static void main(String[] args) { Vehicle vehicle = new Vehicle(); if (vehicle.isReady()) { // ★動力があるかチェック vehicle.setEngineStatus( "発進" ); } System.out.println(vehicle.getEngineStatus()); } } こんな感じ。 尋ねるな、命じろ (Tell, Don't Ask) で、結局どうするんだ。という話ですが、こうするのが良いとされています。 // Demeter.java class Engine { // ...略... } class Vehicle { protected Engine engine; Vehicle() { engine = new Engine(); } // ★進むための処理 // engineへの操作はここで行う void start() throws Exception { if (engine != null ) { engine.setStatus( "発進" ); } else { throw new Exception( "エンジン盗まれた" ); } } // ★Vehicleの状態として返す String getStatus() { // 必要に応じて整形（ここではそのまま返す） return engine.getStatus(); } } public class Demeter { public static void main(String[] args) { Vehicle vehicle = new Vehicle(); try { vehicle.start(); // ★ただ「進め」と命じる System.out.println(vehicle.getStatus()); // ★vehicleの状態として取得 } catch (Exception e) { System.out.println(e); // ★ダメなら例外処理（場合によってエラーコード処理でも） } } } こうすることでmainメソッドからは Vehicle のみを意識すればよく、 Engine とのことはすべて Vehicle 内に閉じることになります。 むかしばなし ずいぶん昔に所属していたチームで「getter/setterを経由しなければならないんDA!!」というお可愛いコードを主張する方がいたのですが int getA() { if (A == null ) { return B; } return A; } といったコード書いてたのを発見したときに、「[検閲削除]」「[検閲削除]」「[検閲削除]」といったことを心の中で叫んだ記憶が蘇りました。 まとめ イケてるインタフェース設計を心がけましょう。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 rakus.hubspotpagebuilder.com ラク スDevelopers登録フォーム https://career-recruit.rakus.co.jp/career_engineer/form_rakusdev/ イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ ◆TECH PLAY techplay.jp ◆connpass rakus.connpass.com

はじめに こんにちは、 id:FM_Harmony です。 Rakus Developers Blogでは約一年振りの投稿になります。 さて、今年から楽楽精算の スマートフォン アプリ開発 に携わることとなり、業務知識としてSwiftを学習しています。 そこで、今回はSwiftのいいなと思った箇所について、簡単にまとめてみました。 これからSwiftの学習を始める方に、Swiftの良さが伝えられれば幸いです。 はじめに いいところ①：型推論 いいところ②：nullの取り扱い いいところ③：文字列補完 おわりに 参考文献 いいところ①： 型推論 Swiftは静的型付け言語ですが、 型推論 を持っています。 そのため、変数宣言時は定数かどうかのみを意識すればよく、簡潔なコードを書くことができます。 var n = 1 print(type(of : n )) // → Int いいところ②：nullの取り扱い Swiftでは、変数にnull（ nil ）を代入するためには、Optional型として宣言する必要があります。 // var m = nil → コンパイルエラー var n : Int ? = nil print(type(of : n )) // Optional<Int> Optional型はアンラップしなければ利用できないため、nullかもしれない値を安全に利用することができます。 アンラップする方法の一つに、 if - let 構文があります。 var n : Int ? = 1 print(n) // Optional(1) // n += 1 → コンパイルエラー if let m = n { print(m) // 1 m += 1 } また、 guard - else 構文により、Optionalの値がnullだった場合はリターンし、そうでない場合はアンラップした値を変数に代入する、といったこともできます。 guard let n = hoge() else { return } print(n) // → hoge()の戻り値がnilでなければ、その戻り値を表示する guard - else 構文では、複数の変数に代入することもできます。 guard let m = hoge(), let n = fuga() else { return } print(m) print(n) // ↑ hoge()、fuga()の戻り値がnilでなければ、その戻り値を表示する いいところ③：文字列補完 文字列 リテラル に、 \(変数) という形で変数の値を埋め込むことができます。 変数の値と文字列 リテラル の結合もできるのですが、文字列補完を利用した方が簡潔なコードを書くことができます。 let year = 2020 let month = 6 let day = 24 print( " \(year) 年 \(month) 月 \(day) 日" ) // 2020年6月24日 おわりに いかがでしたでしょうか。 Swiftを使うことで、簡潔かつ安全なコードを書けるということが伝えられていれば幸いです。 他にも、extensionやprotocol、 クロージャ というように、過去の記事で紹介されている文法があります。 tech-blog.rakus.co.jp tech-blog.rakus.co.jp そういったものについても今後理解を深めていき、 スマートフォン アプリの機能開発に活かせればと思います。 参考文献 詳細！Swift 4 iPhoneアプリ開発 入門ノート Swift 4+Xcode 9対応 作者: 大重 美幸 メディア: Kindle 版

はじめに こんにちは。itoken1013です。 今回は Markdown （マークダウン） の超入門として、利用度が高い記法10選を紹介します。 入社研修が終わって配属先の上司や先輩とコミュニケーションをとられている新入社員の方や、在宅勤務で以前よりもオンラインコミュニケーションの機会が増えた方には是非とも覚えていただきたい記法ばかりです。 皆様の日々のコミュニケーションにお役立てください！ はじめに そもそもMarkdown（マークダウン）とは何か Markdownが使えると何が便利か コミュニケーションがスムーズ になる ツールが変わっても使える これだけ覚えれば安心な記法10選 1. 見出し オープニング Meetupの発表内容 ①Twelve-Factor Appで読み解く、モダンなアプリの理想とレガシーなアプリの現実 ②開発グループが開発チームになるまでの歩み ③結果整合性ができない開発者のドメインイベント活用例 2. 改行 3. リスト（箇条書き） 4. 番号付きリスト 5. 表（テーブル） 6. 強調、太文字 7. 取り消し線 8. リンク 9. 引用 10. 水平線 終わりに そもそも Markdown （マークダウン）とは何か 文章に見出しや箇条書きなど、文章に簡単に装飾を施すための記述法が Markdown （マークダウン）です。 簡単な記述ルールに従って文章を作成するとHTMLへ変換され、装飾が施された文章が出来上がります。 例として以下は ラクスのConnpassページ でのイベントの紹介文ですが、ただの文字の羅列である上図よりも、 Markdown によって装飾された下図の方が圧倒的に読みやすいことがお分かりいただけるかと思います。 Markdown なし Markdown あり ちなみに ラク スでは社内のチャットツールにMattermostを採用していることもあり、 若手から部長まで Markdown を使ったコミュニケーションが毎日行われています。 エンジニア以外でも利用できる方は多いです。 Markdown が使えると何が便利か コミュニケーションがスムーズ になる 上述のように文章に手軽に装飾を加えることができ、圧倒的に意見を伝えやすくなります。 日常のコミュニケーションの他、議事録やIssueでも読みやすい文章を作成することができるようになるでしょう。 ツールが変わっても使える Markdown を採用しているツールやサービスは数多く（以下）、一度記法を覚えてさえしまえば、利用するツールが変わっても同様の記法で文章を作成することが可能です。 ちなみにこのブログも Markdown で書いています。 GitHub Qiita 各種エディタ Mattermost Backlog ...etc これだけ覚えれば安心な記法10選 それでは代表的な記法を紹介していきます。 ここで紹介する10個の記法を身につければ、普段のコミュニケーションに困ることは無くなるはずです。 1. 見出し まずは見出し（例. 1章、第5節など）です。 見出しを表現するには 「 # + 半角スペース 」 の後、見出し名をつけることで表現できます。 また # を重ねることで、見出しの階層を表現することもできます。 議事録や アジェンダ を示す際には、以下のような見出しがあると読みやすいですよね。 例として、以下では見出し4と5を組み合わせています。 書き方例 #### オープニング #### Meetupの発表内容 ##### ①Twelve-Factor Appで読み解く、モダンなアプリの理想とレガシーなアプリの現実 ##### ②開発グループが開発チームになるまでの歩み ##### ③結果整合性ができない開発者のドメインイベント活用例 表示例 オープニング Meetupの発表内容 ①Twelve-Factor Appで読み解く、モダンなアプリの理想とレガシーなアプリの現実 ②開発グループが開発チームになるまでの歩み ③結果整合性ができない開発者の ドメイン イベント活用例 2. 改行 次はシンプルですが、改行です。 改行は文末に 半角スペース2つ をつけることで実現できます。 書き方例 文末に半角スペースを2つ付けると、改行できますよ→ 改行できました。 表示例 文末に半角スペースを2つ付けると、改行できますよ→ 改行できました。 3. リスト（箇条書き） 先頭にハイフン をつけることで、箇条書きを表現することができます。 また 半角スペース2つでインデント をつけることで、階層構造を示すことできます。 ロジカルに考えを伝えたい場合など、多用するシーンが非常に多い記法です。 書き方例 - 好きな言語 - Java - PHP - 好きなエディタ - VSCode - Vim - Typora - 好きなメディア - はてなブックマーク - Qiita 表示例 好きな言語 Java PHP 好きなエディタ VSCode Vim Typora 好きなメディア はてなブックマーク Qiita 4. 番号付きリスト 先頭に番号をつけたリストを表示したい場合には、 先頭に番号 を付けて表現します。 また箇条書きと同様、インデントによって階層構造を示すことも可能です。 書き方例 1. 住みたい町 1. 鎌倉 1. 神楽坂 1. 荻窪 1. 部屋の条件 1. 騒音 1. ペット可 1. 駅から徒歩3分 表示例 住みたい町 鎌倉 神楽坂 荻窪 部屋の条件 騒音 ペット可 駅から徒歩3分 5. 表（テーブル） 表は少し複雑ですが、 パイプ と ハイフン で作成できます。 またヘッダーと各行の間の1行にはハイフンを指定する必要がありますが、 ハイフンの左右に コロン を指定することで 右寄せ、左寄せ、中央揃え を指定することができます。 書き方例 |日付 | カテゴリー | イベントテーマ | |---:| :---: | :--- | |2020/6/17 | Meetup | SaaSを支える品質担保術| |2020/6/19 | PHP | TechCafe| |2020/6/24 | Meetup | SaaSを支える開発原則| |2020/6/26 | オブジェクト指向 | オブジェクト指向LT会| |右寄せ| 中央揃え | 左寄せ | 表示例 日付 カテゴリー イベントテーマ 2020/6/17 Meetup SaaS を支える品質担保術 2020/6/19 PHP TechCafe 2020/6/24 Meetup SaaS を支える開発原則 2020/6/26 オブジェクト指向 オブジェクト指向 LT会 右寄せ 中央揃え 左寄せ 6. 強調、太文字 文章の中で強調したい文言がある場合、 文言の前後を アスタリスク で囲む ことで表現できます。 一見して注目ポイントがアピールできるため、利用頻度が高い記法の一つです。 ※ツールによって アスタリスク の個数が異なる場合があるため、各ツールのガイド等を確認ください。 書き方例 7月もラクスの** Meetup **と** 勉強会 **が目白押しだよ！！ 表示例 7月も ラク スの Meetup と 勉強会 が目白押しだよ！！ 7. 取り消し線 取り消し線は 文言の前後を チルダ （~~）で囲みます。 一度書いた文面に誤りや変更があった場合、私はよくこの取り消し線を使います。 書き方例 アンケートの結果、先月は実に~~80%~~ 90% の方から高い満足度が得られました！ 表示例 アンケートの結果、先月は実に 80% 90% の方から高い満足度が得られました！ 8. リンク 日々のコミュニケーションで、参照先のURLを紹介することは多いかと思います。 URLを貼り付けて示してもよいですが、分量が多くなってしまう場合、こちらのリンク記法が便利です。 リンクは 角カッコと丸カッコ を組み合わせて記述します。 書き方例 ラクスのイベント情報は、[Connpass](https://rakus.connpass.com/)をチェックしてね！ 表示例 ラク スのイベント情報は、 Connpass をチェックしてね！ 9. 引用 メールの返信で、複数の話題に触れる際には引用を使うことがあるかと思います。 Markdown でも引用をする際には、 > を使うことで表現をします。 書き方例 > 次回の勉強会のテーマについて オブジェクト指向です。 > イベント開催日 6/26(金)です。 > 場所 オンラインです。 https://rakus.connpass.com/event/178556/ 表示例 次回の勉強会のテーマについて オブジェクト指向 です。 イベント開催日 6/26(金)です。 場所 オンラインです。 https://rakus.connpass.com/event/178556/ 10. 水平線 まとまった情報を示したり 文面にメリハリを加えることができます。 水平線は ハイフン3つ を挟むことで、簡単に記述できます。 書き方例 ラクスのイベント情報を紹介したいと思います。 下記の内容をご確認ください。 --- - [【オンライン】SaaSを支える開発原則/DDD、心理的安全性、Twelve-Factor](https://rakus.connpass.com/event/178046/) - [【オンライン】PHP::LT会 【LT枠@2：途中参加OK】](https://rakus.connpass.com/event/178724/) - [【オンライン】オブジェクト指向LT会 vol.2（途中参加OK）](https://rakus.connpass.com/event/178556/) --- たくさんの皆様のご参加、お待ちしています！ 表示例 ラク スのイベント情報を紹介したいと思います。 下記の内容をご確認ください。 【オンライン】SaaSを支える開発原則/DDD、心理的安全性、Twelve-Factor 【オンライン】PHP::LT会 【LT枠@2：途中参加OK】 【オンライン】オブジェクト指向LT会 vol.2（途中参加OK） たくさんの皆様のご参加、お待ちしています！ 終わりに 利用度が高い Markdown の記法を紹介してきました。 まだまだ便利な記法はありますが、この10記法を覚えておけば、 十分にご自身が伝えたいことを読みやすく文章を起こすことができるはずです。 Markdown が使えるツールやサービスは日々増えていますので、このブログをご活用いただけましたら嬉しいです。 ではでは。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 rakus.hubspotpagebuilder.com ラク スDevelopers登録フォーム https://career-recruit.rakus.co.jp/career_engineer/form_rakusdev/ イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ ◆TECH PLAY techplay.jp ◆connpass rakus.connpass.com

こんにちは、技術広報の syoeshin です。 当社 ラク スの開発では様々ツールを使ってますが テキストエディタ を使用するケースも多く 若手もベテランも自分に合う テキストエディタ ”マイ・エディタ” を愛用してます。 テキストエディタ って種類が多くて ・結局どれを選ぶか？ ・となりのあの人は何を使っているか？ 気になりますよね。 そこで、今回は当社の若手からベテランにまで 普段愛用している テキストエディタ ーと おすすめポイントを聞きました。 質問：「愛用のエディタは何ですか？」 当社調査結果のグラフは以下 ●愛用エディタの調査結果 やはりと言いますか 当社 ラク スで1位のおすすめエディタは ●VisualStudioCode ヤングからベテランまで幅広い層で支持 以下、愛用者達からのおすすめコメント 今や最主流なので便利 プラグイン や記事なども VSCode 前提のものが多い。 Atom やBracketと比べて軽かった（今はわからない） GIT MarkDown Python PHP Docker AWS なんでもあり 軽い。多機能！ 発表資料を Markdown で書いてプレビュー、からのPDF出力まで VSCode でできちゃう（marp） 新しいものに惹かれて Atom から乗り換えました 軽い、Remote Containerが便利。最近校正くん対応したので文章書くときにも使える 見易さ。編集し易さ。 デフォルトのHTML スニペット が素晴らしい。さくさくHTMLコーディングしつつ、Live Serverで保存→即時サーバ反映で良い感じ WSL と繋げて使うのもできる。npm スクリプト の実行もクリック操作で可能なので、Node.js使う系の作業に特に重宝している マークダウンでの原稿作成チェック。目に優しいので好きです。 ファイルサーバ上のテキストファイルを同時編集可能 → 他者による上書き防止 会議中の議事作成や多拠点間での同時作業時など、リアルタイムでテキストの共有を行う時に便利 明示的に保存していなくても再起動時に編集中の内容が再表示される 単純な テキストエディタ にも、開発にも使える。 プラグイン がとにかく豊富。その気になれば自分でも プラグイン を作れる。 息子も使っていて幅広い用途や年齢層で使われているところが良い。 etc... 世間的にも全世代で幅広く支持され 当社ではついに親子で使っている例も登場！ 次いで、当社で2位のおすすめエディタは ● サクラエディタ ※意外にも こちらもヤングからベテランまでの幅広い層で支持 (筆者も markdown チェックで利用) 以下、愛用者達からのおすすめコメント ちょい使いには楽。巨大なテキストファイルでも割と軽い。テキスト エンコーディング の操作で慣れている。 テキスト整形とかする時、ショートカットキーがなじんでいるのがこっちなのでこっち使っちゃう 目に優しい 新人の頃、先輩に サクラエディタ の超絶技巧を見せていただき感動したため テキスト操作がやりやすい 自分なりの最適化が サクラエディタ で出来上がってしまった。いくつかのショートカットキーを多用しています。（ソート：Alt＋A、マージAlt＋M） 使用ソフトに厳しい客先でもなぜか使うことが許されている Sier 御用達エディタ 割と起動が軽いので大きなログファイルなどはサクラで開きます。 grep からのジャンプやマクロが便利。 軽いしプロセスが落ちたりとかもしないのでいつも重宝してます 起動が早い。メモ用、 文字コード 変換用 メモや SQL をサッと書く時には便利 置換はこれに限る。 文字コード 変換も便利。はるか昔に jar ファイルを base64 エンコーディング してコピペ => base64 デコードして保存 で手を入れていたのが懐かしい。 メモ書きから、ちょっとした編集まで大抵これを使っています 置換、マージ＆ソート、矩形選択辺りを多用しています 正規表現 での置換や 文字コード 、改行コードの変換に利用しています Java や SQL の シンタックス ハイライトが使えるのも嬉しいです etc... Grep 機能、アウトライン解析はとても便利！ 当社で同率3位のおすすめエディタは”Typora”と” Vim ” ●Typora 無料で、Win/ Mac / Linux に導入可能 シンプルなHTMLにエクスポートできる 強力な Markdown エディタ 以下、愛用者達からのおすすめコメント Markdown エディタ、書いた瞬間変換されるので書いていて気持ちいい リアルタイムにマークダウンを反映してくれて、手軽に綺麗に書けるため マークダウンがリアルタイムで反映され文章作成がしやすいため Markdown のエディタ。スタイルされた状態で編集できるのがいい "マークダウン見るときはこれ。とにかく見やすいと感じています。" etc... リアルタイムプレビューのUI シンプルデザイン、直感的操作を好む人におススメ！ ● Vim 二大エディタの一つ 誰かが言われてました テキストエディタ には三種類しか存在しない。 " Vim " か " Emacs " か "それ以外か" だ。 ※ 引用元 以下は当社の愛用者達からのおすすめコメント 覚えてしまうとあちこちに指を伸ばさなくて良くて楽だなと思います。使いこなせるようになりたい。 ターミナル操作してる流れでは Vim を使用。一時は プラグイン 入れたりカスタマイズに凝っていたが、今はデフォルトで使用。 Viでも可。設定を変えたけど、どこに設定あるか忘れるので、検証機移行時にあせる vi よりも vim がいい派。サーバー上でちょっとした編集をしたいときにあると嬉しい Web系エンジニアでviを使わない人はいないはず。その延長で Vim を日常的に使うのは必然。 etc... Vim は、古くから多くのエンジニアに愛されてきたエディタです。 故に、"愛"も"圧"も強め！ 次いで、当社で5位のおすすめエディタは ● emacs 以下、愛用者達からのおすすめコメント サーバ上で CLI でちょこっと編集するのに○。 Lisp で拡張できるので細かいところも自分好みにできる 手元メモ用とターミナル上での作業用。他のエディタを emacs 風 キーバインド にするのは嫌い。 現在、もはやメモ帳としてしか使っていないがおすすめ etc... 拡張性が高く、自由にカスタマイズができる！ これにつきるのでは？ 次いで、当社で6位のおすすめエディタは ●cotEditor 以下、愛用者達からのおすすめコメント ちょい使いに楽。テキスト エンコーディング の変換がかんたん。 手軽に使える。メモによく使ってる etc... 以下エディタ群は利用者が同率でした。 ● Atom 以下、愛用者達からのおすすめコメント 拡張性と操作性で選んでます 軽快に動作してくれたらもっと嬉しい etc... ● Eclipse ( IDE ) 以下、愛用者達からのおすすめコメント 学生の頃からプライベートでは一番使っています 重いという人がいますが、重くなるようなPC使ってるのがいけないのですｗ etc... ●JetBrains ( IDE ) 以下、愛用者達からのおすすめコメント ス クラッチ ファイルを軽い気持ちで使っている プロジェクトに属さずにコーディングができ、 IDE の支援も受けられる etc... ● Sublime Text 以下、愛用者達からのおすすめコメント ちょっとした スクリプト を見るときに使います 特に理由があるというより昔から使っていた無償版を今も使っています etc... ●nano 以下、愛用者達からのおすすめコメント 操作が直感的なのでviが使いこなせない方にはおすすめです etc... ● TeraPad 以下、愛用者達からのおすすめコメント 個人的に サクラエディタ よりもアイコンが好きです etc... ●Textastic 以下、愛用者達からのおすすめコメント WorkingCopy(gitクライアント)と併せて iOS からブログ更新用に etc... 最後に 「愛用のエディタは何ですか？」と 当社メンバーに ヒアリ ングしていた際 ・ sublime 派は今？ ・ emacs 派は？ vim 派は？なし？ など 世にいう"エディタ戦争"の少し手前まで 盛り上がり、各メンバーが回答してくれました。 戦争手前で論争を終える事ができたのは きっと『愛』という言葉のおかげだと 勝手に解釈しております。 2020年、皆さんの愛用のエディタは何ですか？ エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

はじめに こんにちは、mrym_618です。 今回は、普段業務で使用しているPhpStormの プラグイン のうち、個人的におすすめの3つを紹介したいと思います。 はじめに Rainbow Brackets deep-assoc-completion String Manipulation おわりに Rainbow Brackets Rainbow Brackets とは、対応する括弧の色を変えて見やすくする プラグイン です。 複数のif文などによりネストが重なっていくと、どの括弧とどの括弧が対応するか分かりにくくなり、コードが読みにくくなってしまいます。 そこで、この プラグイン を導入することで対応する括弧が分かりやすくなりますので、コードが読みやすくなります。 導入方法は、 Setting > Plugins で 「Rainbow Brackets 」を検索し、インストールしてPhpStormを再起動するだけです。 また、 Editor > Color Scheme > Rainbow Bracket より括弧の色をカスタマイズできますので、自分の見やすいようにカスタマイズして使用してもらえればと思います。 deep-assoc-completion deep-assoc-complatetionとは、配列の補完をしてくれる プラグイン です。 連想配列 の予測補完やDocCommentに配列の構造を定義するとそれも解釈してくれるなど、配列の操作が楽になる プラグイン です。 導入方法は、上記と同様で Setting > Plugins で 「deep-assoc-completion」を検索し、インストールしてPhpStormを再起動するだけです。 String Manipulation String Manipulationとは、文字列操作をできる プラグイン です。 文字列をキャメルケースやスネークケースに変換したり、 エス ケープや エンコード などができます。 使用方法は、 String Manipulation を導入後に、操作したい文字列を選択し、 Alt + m を押すことで表示されるドロップダウンから操作したい処理を選択するだけです。 導入方法は、上記と同様で Setting > Plugins で 「String Manipulation」を検索し、インストールしてPhpStormを再起動するだけです。 おわりに 今回はPhpStormの個人的におすすめの プラグイン を3つ紹介しました。PhpStormには、今回紹介した プラグイン 以外にも多くの プラグイン がありますので、いろいろ試して業務効率を上げていきたいと思います。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

はじめに こんにちは。新卒3年目のchoreii です。 今回は PostgreSQL の実行計画について記事を書こうと思います。 私が初めて実行計画について知った時は難しそうなイメージが先行しており、実際に調べてみても情報量が多くハードルが高かったです。ですが調べていくうちに自分が難しく感じていた理由がわかりました。 それは、 多くの記事が「実行計画の基礎知識」と「実行計画をどのようにパフォーマンス改善に活かすか」という2種類の情報を織り交ぜて記載されていたから です。 今回はできるだけ情報量を削減し、 「実行計画の基礎知識」 にフォーカスした記事を作成しました。これから実行計画を学ぶ人の最初の一歩となれば幸いです。 実際のパフォーマンスのチューニング方法や、検証するための大量データの登録に興味がある方は下記のブログもご覧ください。 tech-blog.rakus.co.jp tech-blog.rakus.co.jp 目次 はじめに 目次 1. 実行計画とは 2. 実行計画の出し方 3. 実行計画の読み方 3-1. 実行計画を読む順番 3-2. スキャン演算子 3-3. 結合演算子 3-4. その他の演算子（検索結果の整形など） 4. おまけ（コストとANALYZE） おわりに 参考文献 1. 実行計画とは 実行計画とはユーザが問い合わせたクエリ（ SQL 文）を実行する手順書になります。「どの順番にテーブルを結合するか」「ソート方法」「検索方法』などの作業内容や、想定される実行コストが記述されています。 2. 実行計画の出し方 実行計画の出し方ですが、実行計画を確認したい SQL 文の先頭に EXPLAIN と付け足すだけです。 例として、itemテーブルから全件取得する SQL は SELECT * FROM item; となりますが、この SQL の実行計画を知りたい場合は EXPLAIN SELECT * FROM item; とするだけで実行計画が取得できます。 ※ オプションで出力内容や方法を設定できますがここでは割愛します。 EXPLAIN SELECT * FROM item; QUERY PLAN --------------------------------------------------------- Seq Scan on item (cost=0.00..12.20 rows=220 width=328) 3. 実行計画の読み方 前項の通り実行計画を表示することはできました。次はもう少し複雑な SQL の実行計画を使って実行計画の読む順番や、それぞれの行が何を意味しているかを解説していきます。以下が解説に使用する SQL 文とその実行計画です。 EXPLAIN SELECT * FROM item INNER JOIN customer ON item.customer_id = customer.id WHERE customer.name = '佐藤' ORDER BY item.id; QUERY PLAN --------------------------------------------------------- Sort (cost=27.07..27.08 rows=1 width=574) Sort Key: item.id -> Hash Join (cost=14.03..27.06 rows=1 width=574) Hash Cond: (item.customer_id = customer.id) -> Seq Scan on item (cost=0.00..12.20 rows=220 width=332) -> Hash (cost=14.00..14.00 rows=2 width=222) -> Seq Scan on customer (cost=0.00..14.00 rows=2 width=222) Filter: ((name)::text = '佐藤'::text) 3-1. 実行計画を読む順番 実行計画はよく見るとツリー構造になっており、インデント下げや「->」などで表されます。（出力方法によって異なります。）以下に先の実行計画のツリー構造を簡単に図にしたものがあります。 図1: 実行計画のツリー構造 読む順番のルールは2つだけです。 順番に子要素をたどり一番子孫の要素から実行し、親要素に遡っていく 兄弟要素がある場合は先に記述されている行から順に子要素をたどる 今回の場合、一番深い子要素は7,8行目になりますが、5行目と6行目が兄弟要素にあたります。そのため最初に5行目を実行してから6行目の子要素をたどっていくことになります。図に読む順番を追記すると以下のようになります。 図2：実行計画のツリー構造（読む順番） 読む順番に迷った際はツリー構造がどうなっているかを一度図にしてみるとわかりやすいと思います。 3-2. スキャン 演算子 次に個別の行の解説をします。最初に実行される以下の行の先頭に Seq Scan と書かれています。 -> Seq Scan on item (cost=0.00..12.20 rows=220 width=332) これは、単語の意味通りitemテーブルの中から必要な行を順番に検索することを意味する行で、もっとも基本的な検索（スキャン）方法になります。スキャン 演算子 は Seq Scan 以外にもインデックスが利用できる場合に選択される Index Scan などがあります。 3-3. 結合 演算子 3,4行目ではテーブルの結合を行っています。ハッシュとついているのは一方のテーブルから作られたハッシュ表を元に結合しているからで、最初のハッシュ表の作成は6行目でおこなわれています。メモリ上にハッシュ表が作成されるため、メモリに余裕がある場合は高速に動きます。結合 演算子 は他に Nested Loop や Merge Join が存在します。 -> Hash Join (cost=14.03..27.06 rows=1 width=574) Hash Cond: (item.customer_id = customer.id) 3-4. その他の 演算子 （検索結果の整形など） 1,2行目ではソートを行っています。スキャンや結合よりも直感的に何をしているかが分かりやすいと思います。（ここでは SQL のORDER BY句で指定したようにitemテーブルの‪‪id列でソートがかかっています。） Sort (cost=27.07..27.08 rows=1 width=574) Sort Key: item.id 他にも Group や Limit など、特定の SQL を記述した際に検索結果を整形するための 演算子 が存在します。 4. おまけ（コストとANALYZE） 演算子 の意味について解説しましたが、 演算子 の後ろにカッコ書きで数値などが記載されています。 -> Seq Scan on item (cost=0.00..12.20 rows=220 width=332) これは、実行計画通りに SQL を実行した場合の推測値で、左から順に以下の数値になっています。 初期コスト：検索結果の1行目を返すまでにかかる準備のコスト（秒数ではない） 総コスト：初期コストを含めた処理完了までにかかるコスト（秒数ではない） 行数：返却される検索結果の行数 行の長さ：返却される1行あたりの長さ（横幅） パフォーマンスを確認する際は総コストを確認して、 SQL の組み方を変更することによってコストを抑えることができないかを調節することが多いです。 しかし、出てくる結果はあくまで推測値なので実際に SQL を実行してみた結果と食い違うことがあります。その場合は ANALYZE オプションを使用し実際に SQL を実行してみた結果、実行計画のどの部分にどれだけの時間やコストがかかったかを確認する必要があります。（以下のような出力になります） ※ 「EXPLAIN」の直後に「ANALYZE」と付け足す EXPLAIN ANALYZE SELECT * FROM item INNER JOIN customer ON item.customer_id = customer.id WHERE customer.name = '佐藤' ORDER BY item.id; QUERY PLAN --------------------------------------------------------- Sort (cost=27.07..27.08 rows=1 width=574) (actual time=0.037..0.037 rows=4 loops=1) Sort Key: item.id Sort Method: quicksort Memory: 25kB -> Hash Join (cost=14.03..27.06 rows=1 width=574) (actual time=0.025..0.027 rows=4 loops=1) Hash Cond: (item.customer_id = customer.id) -> Seq Scan on item (cost=0.00..12.20 rows=220 width=332) (actual time=0.006..0.006 rows=8 loops=1) -> Hash (cost=14.00..14.00 rows=2 width=222) (actual time=0.008..0.008 rows=1 loops=1) Buckets: 1024 Batches: 1 Memory Usage: 9kB -> Seq Scan on customer (cost=0.00..14.00 rows=2 width=222) (actual time=0.005..0.005 rows=1 loops=1) Filter: ((name)::text = '佐藤'::text) Rows Removed by Filter: 1 Planning time: 0.159 ms Execution time: 0.062 ms (actual time=0.008..0.008 rows=1 loops=1) が行末に追加されたり、QUERY PLANの最後に実際の実行時間などが出力されるようになっています。この記事では詳細は割愛しますが、このように実際に実行してみた結果を取得することも可能です。 おわりに 今回は実行計画の最低限の知識に絞って解説してみました。できるだけ初心者の人が最初に疑問に思うことをピックアップしたつもりなので、この記事を読んでからさらに詳しい解説記事を見ていただければ学習がはかどると思います。私自身まだ浅い基礎知識しか定着しておらず、業務で実行計画を使いこなせているとは言い難いです。今回、基本的な情報を整理する中での気づきもありましたので、さらに学習を深め身につけていきたいと思います。 参考文献 EXPLAIN PostgreSQLクエリ実行の基礎知識 ～Explainを読み解こう～ PostgreSQLの実行計画について調べてみた | キャスレーコンサルティング株式会社 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 rakus.hubspotpagebuilder.com ラク スDevelopers登録フォーム https://career-recruit.rakus.co.jp/career_engineer/form_rakusdev/ イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ ◆TECH PLAY techplay.jp ◆connpass rakus.connpass.com

はじめに こんにちは。新卒３年目になりましたtaku_76です。 今回は SQL についての記事を書こうと思います。その経緯としては、業務で SQL を少し書くことはあったのですが、 必要な情報を取り出せたらいいや、くらいの意識しかなく、あまりパフォーマンス面を意識するということはありませんでした。 しかし、今後の新規開発で SQL の改修があった際、パフォーマンスの考慮は必ず必要になってきますので学習することにしました。 学習にあたっては以下の書籍を用いて学習しました。1部と2部に分かれているのですが、今回の記事では1部について、パフォーマンス面に注視して印象に残ったことを具体例とともに取り上げています。あくまで考え方を取り上げたかったため、文法の説明などは割愛しています。 www.shoeisha.co.jp はじめに パフォーマンスの向上のために覚えるべきこと CASE式 CASE式の中で集約関数を使う EXISTS述語 述語とは 全称量化と存在量化 テーブルに存在「しない」データを探す ウィンドウ関数 ウィンドウ関数 vs 相関サブクエリ おわりに パフォーマンスの向上のために覚えるべきこと CASE式 CASE式を使うことで複数の SQL 文を1つにまとめ、可読性もパフォーマンスも向上することができます。それを以下に示します。 CASE式の中で集約関数を使う 以下のような社員と所属サークルを一覧化するテーブルを考えます。主キーは、社員番号とサークルIDとします。 shain_cricleテーブル shain_id circle_id circle_name main_circle_flag 1000 1 野球 YES 1000 2 サッカー NO 2000 2 サッカー NO 2000 3 バスケットボール YES 2000 4 バレーボール NO 3000 4 バレーボール NO 4000 5 吹奏楽 NO 5000 6 水泳 NO 社員は複数のクラブに所属している場合と、1つにしか所属していない場合があります。 複数のクラブを掛け持ちしている社員は、メインのサークルを示すフラグ列にYESまたはNOの値が入ります。そうでない社員はNOが入ります。 このテーブルから次のような条件でクエリを発行するとします。 1つだけのクラブに所属している社員については、そのサークルIDを取得する 複数のクラブを掛け持ちしている社員については、メインのサークルIDを取得する 1.2.についてそれぞれ以下のようなクエリを発行すれば抽出が可能です。 -- 1つのサークルに所属している社員を抽出 SELECT shain_id, MAX(circle_id) AS main_circle FROM shain_circle GROUP BY shain_id HAVING COUNT(*) = 1 ORDER BY shain_id; -- 結果 shain_id | main_circle ----------+------------- 3000 | 4 4000 | 5 5000 | 6 (3 行) -- サークルを掛け持ちしている社員を選択 SELECT shain_id, circle_id AS main_circle FROM shain_circle WHERE main_circle_flag = 'YES' ORDER BY shain_id; -- 結果 shain_id | main_circle ----------+------------- 1000 | 1 2000 | 3 (2 行) 上記でも条件を満たした抽出ができるのですが、場合によって複数の SQL が必要になりパフォーマンスの問題が発生します。 これをまとめたものを、CASE式を使えば1つの SQL で書くことができます。(UNIONでは結局クエリの発行回数は変わらないためパフォーマンスは同じ) SELECT shain_id, CASE WHEN COUNT(*) = 1 THEN MAX(circle_id) ELSE MAX(CASE WHEN main_circle_flag = 'YES' THEN circle_id ELSE NULL END) END AS main_circle FROM shain_circle GROUP BY shain_id ORDER BY shain_id; -- 結果 shain_id | main_circle ----------+------------- 1000 | 1 2000 | 3 3000 | 4 4000 | 5 5000 | 6 (5 行) ポイントとしては、「１つだけのサークルに所属しているのか、複数のサークルに所属しているのか」という条件分岐をCASE式で表現することです。 元々、集計結果に対する条件はHAVING句を使うと学んでいましたが、CASE式を使うことでSELECT句でも同じような条件分岐を実現することができました。 CASE式はSELECT句で集約関数の中にも外にも書けたりと自由度が高いのでうまく扱えるようになりたいと思います。 EXISTS述語 EXISTSは複数行を一単位と見なした条件を記述することができ、相関サブクエリを利用するにもかかわらずパフォーマンスが優れているという特徴があります。 結論から言うと、EXISTSは「量化」という述語論理の機能を実現するために SQL に取り込まれました。 述語とは 一言でいうと関数のことですが、EXISTSはSUMなどの普通の関数とは異なり、戻り値が真理値になる関数の事を指します。 例として、=,<,>,などの比較述語や、BETWEEN,LIKE,IN,IS NULLなどがあります。 ここで、=やBETWEENなどと、EXISTSを比較すると「引数に何を取るか」という面で大きな違いがあります。 =やBETWEEN 「x = y」や「x BETWEEN y AND z」などの述語の引数は、数字や名前といった単一の値、スカラ値。 EXISTS 行の集合(例. SELECT * FROM ○○テーブル WHERE ○○=○○) 上記から分かるように、EXISTSは入力のレベルに特徴があります。述語論理では「入力のレベル」に応じて述語が分類されています。 そして、=やBETWEENなど1行を入力とする述語を「一階の述語」、EXISTSのように行の集合を入力する述語を「二階の述語」といいます。 全称量化と 存在量化 述語論理には、量化子という特別な述語が存在します。量化子とは以下の2つの文を書くための道具です。 全称量化子 すべてのxが条件Pを満たす 存在量化 子 条件Pを満たすxが(少なくとも1つ)存在する EXISTS述語は、述語論理の 存在量化 子を実装したものです。ここで重要なことがあるのですが、 SQL にはもう一方の全称量化子に対応する述語は導入されませんでした。 しかし、全称量化子と 存在量化 子は片方が定義されていれば同値変形の規則がありますので、「すべての行が条件Pを満たす」という文を「条件Pを満たさない行が存在しない」と変換することで表現できます。これについてEXIST述語を使って書いていきます。 テーブルに存在「しない」データを探す データベースからデータを検索する場合、一般的にはある条件を満たすものを抽出します。しかし、時にはテーブルに存在「しない」データを抽出する場合もあります。 例えば、複数回行われるミーティングと出席者を記録しておくテーブルがあるとします。 meetingsテーブル meeting shain 1回目 A 1回目 B 1回目 C 2回目 A 2回目 D 2回目 C 3回目 B 3回目 D 今回はこのテーブルから「出席しなかった社員」を求めます。 存在するデータに対して「○○という性質を満たす」という条件を設定するのではなく、そもそも「データが存在するかどうか」という、次数の1つ高い問題設定を行います。 これが「二階の問い合わせ」であり、EXISTS述語を使う機会です。 考え方としては、全員が出席したと仮定した場合の集合から、現実に出席した人を引き算することで求めます。 1.全員が出席した場合の集合を求める SELECT DISTINCT m1.meeting,m2.shain FROM meetings m1 CROSS JOIN meetings m2 ORDER BY meeting, shain; -- 結果 meeting | shain ---------+------- 1回目 | A 1回目 | B 1回目 | C 1回目 | D 2回目 | A 2回目 | B 2回目 | C 2回目 | D 3回目 | A 3回目 | B 3回目 | C 3回目 | D (12 行) 2.meetingsテーブルに存在しない組み合わせに絞り込む SELECT DISTINCT m1.meeting,m2.shain FROM meetings m1 CROSS JOIN meetings m2 WHERE NOT EXISTS (SELECT * FROM meetings m3 WHERE m1.meeting = m3.meeting AND m2.shain = m3.shain) ORDER BY meeting, shain; -- 結果 meeting | shain ---------+------- 1回目 | D 2回目 | B 3回目 | A 3回目 | C (4 行) これでうまく抽出することができました。このようにEXISTS述語を使うことで存在「しない」データを抽出することができます。 SQL を書くときに述語論理を意識的に考えることはなかったので、今後そういう視点からも考えてみたいと思います。 ウィンドウ関数 今回、ウィンドウ関数について基本的なことは割愛します。応用方法としては、特に、これまで行間比較において相関サブクエリを使わなければならなかったケースにおいて、 ウィンドウ関数を使うことでスッキリとした SQL 文を記述することができます。 ウィンドウ関数 vs 相関サブクエリ 相関サブクエリとウィンドウ関数を比較すると以下のような違いがあります。 ウィンドウ関数は、サブクエリを使っているが、「相関」サブクエリではないためサブクエリ単体で実行することができる。 そのため、可読性が高く動作も理解しやすい テーブルに対するスキャンが1度だけで済むので、パフォーマンスが良い。 検証は割愛しますが、相関サブクエリもウィンドウ関数も、集合のカットとレコード単位のループという同じ機能を実現していると言えるので置き換えることができます。 次のような商品の名前や価格を格納するテーブルを見てみます。 shohinテーブル shohin_id shohin_name shohin_bunrui tanka 1 マウス PC 3500 2 扇風機 家電 7000 3 キーボード PC 1500 4 文房具 シャーペン 600 5 ドライヤー 家電 3000 6 電球 家電 600 7 電動歯ブラシ 家電 800 8 ボールペン 文房具 150 このshohinテーブルから、各商品分類について平均単価より高い商品を抽出してみます。(相関サブクエリで解く典型的な問題) まずは、相関サブクエリです。 SELECT shohin_bunrui, shohin_name, tanka FROM shohin s1 WHERE tanka > (SELECT AVG(tanka) FROM shohin s2 WHERE s1.shohin_bunrui = s2.shohin_bunrui GROUP BY shohin_bunrui) ORDER BY shohin_bunrui; -- 結果 shohin_bunrui | shohin_name | tanka ---------------+-------------+------- PC | マウス | 3500 家電 | 扇風機 | 7000 家電 | ドライヤー | 3000 文房具 | シャーペン | 600 (4 行) ポイントとしては、「s1.shohin_bunrui = s2.shohin_bunrui」というs1集合とs2集合に対するバインド条件です。これにより、2つのテーブルの商品分類を同じレコード集合に限定して、その集合の平均単価と各レコードの単価を1行ずつ比較しています。 上記コードと同じ結果を抽出するウィンドウ関数は次のようになります。 SELECT shohin_name, shohin_bunrui, tanka FROM (SELECT shohin_name, shohin_bunrui, tanka, AVG(tanka) OVER(PARTITION BY shohin_bunrui) AS avg_tanka FROM shohin) tmp WHERE tanka > avg_tanka; -- 結果 shohin_name | shohin_bunrui | tanka -------------+---------------+------- マウス | PC | 3500 ドライヤー | 家電 | 3000 扇風機 | 家電 | 7000 シャーペン | 文房具 | 600 (4 行) こちらの挙動としては、まずサブクエリのウィンドウ関数で商品分類ごとの平均単価( avg _tanka)を計算しています。 SELECT shohin_name, shohin_bunrui, tanka, AVG(tanka) OVER(PARTITION BY shohin_bunrui) AS avg_tanka FROM shohin; -- 結果 shohin_name | shohin_bunrui | tanka | avg_tanka --------------+---------------+-------+----------------------- キーボード | PC | 1500 | 2500 マウス | PC | 3500 | 2500 ドライヤー | 家電 | 3000 | 2850 扇風機 | 家電 | 7000 | 2850 電球 | 家電 | 600 | 2850 電動歯ブラシ | 家電 | 800 | 2850 シャーペン | 文房具 | 600 | 375 ボールペン | 文房具 | 150 | 375 (8 行) あとは各行で「tanka > avg _tanka」という条件で簡単に平均単価と単価の比較が行えます。 このウィンドウ関数の結果のよいところは、商品分類ごとの平均単価を計算しますが、この際、レコードを集約せずに元のテーブルに列として結果を追加するだけ、という情報 保全 性が働くところです。 個人的に相関サブクエリは動作の理解が難しくあまり好んではいなかったのですが、ウィンドウ関数で同じことを表現することができ、 パフォーマンスも可読性もよいことが分かったので学習を進めてみたいと思いました。 おわりに いかがだったでしょうか。もし私と同じように、 SQL のパフォーマンスを向上するにはどうすればよいか、何を使えば分からないという方の学習のきっかけになれば幸いです。 今回紹介しているのはほんの一部ですので、他にも知りたい、深掘りをしたいと思った方にはぜひおすすめの書籍です。 SQL を書くときの考え方が変わるかと思います。 私も今回学習してみて新しい気付きがたくさんありましたので、何度か読み直してみて定着させたいと思います。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 rakus.hubspotpagebuilder.com ラク スDevelopers登録フォーム https://career-recruit.rakus.co.jp/career_engineer/form_rakusdev/ イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ ◆TECH PLAY techplay.jp ◆connpass rakus.connpass.com

初めに こんにちは。 mako _makokです。 フロントを Vue + Vuex + TypeScript で新規開発中の SaaS プロダクトに携わることになり、急ピッチでVueを学習しています。 今回はVuexについて学習したので、その結果をまとめました。 Vuexは一言で表すと、単一方向のデータフローを持った状態管理パターンのライブラリです。 記事内でサンプルが登場しますが、Vueのバージョンは2系で書いています。 初めに Vuexをなぜ使うのか？ Fluxについて Vuexのアーキテクチャ Store State Getter Mutation Mutationを書くときのコツ Action まとめ おわりに Vuexをなぜ使うのか？ Vueアプリケーションを開発しているとアプリケーションの状態を参照し、 コンポーネント の動作を変えたくなることがあります。 例えば、カレンダーアプリなどでは"現在表示する月"を状態として持ち、"現在表示する月"を参照して表示する日付・日数・予定を変えたくなると思います。 このような動作をする処理を愚直に実装すると、状態自体が複数の コンポーネント に分散してしまったり、状態を変更するロジックが分散、重複してしまうケースが考えられます。 では状態を抽出し、グローバルなオブジェクトで持てば解決するのでは？と考えるかもしれません。 ですが、これは コンポーネント 分割している意味がありません。 コンポーネント ツリーのどこからでもアクションを実行することや、状態を変化させることができてしまいます。それはもはや巨大な コンポーネント が出来上がるのと同義です。 そこで、状態管理に関わる部分を 定義･分離･ルール化 してコードの構造と保守性の向上を目的としたライブラリがVuexです。 Fluxについて Vuexの話を続けていきたいところですが、Vuexの 公式 には以下のようにあります。 Flux、 Redux そして The Elm Architectureから影響を受けています。 最初に書いた、 単一方向のデータフローを持った状態管理パターン というのはFluxに特に影響を受けています。 まず最初にFluxを知ることによって、Vuexをより理解しやすくなるのではと思います。 Fluxとは、 Facebook が提唱している アーキテクチャパターン です。 以下は Facebook が実際にFluxの実装を行ったサンプル リポジトリ です。 https://github.com/facebook/flux Fluxでは MVC やMVVMと異なり、単一方向のデータフローを有していることが特徴です。 具体的には以下の図のようになります。 Fluxの アーキテクチャ Store アプリケーションのデータ(状態)を保持する Dispatcherから更新される publicなsetter を持ってはならない publicなsetterがあると、無秩序にStoreを書き換えることができてしまう Dispatcher Actionを受け取って Storeを更新 する すべてのアクションを受け取る Action Storeをどのようなロジックで更新するか記載した命令 *1 View VueやReactで言うところの コンポーネント 正直これはだけではパっとしないと思うのでToDoアプリでToDoを追加する動作を例にとってみます。 アプリケーションはToDoを保持しているStoreを持っている ToDoを入力し、追加ボタンを押すとToDoを追加する ActionがDispatcherに命令 命令を受け取った DispatcherがActionを実行 し、StoreにToDoを追加する StoreにToDoが追加されたので、更新を検知したViewは再 レンダリング を行い、追加されたToDoを表示する ActionはToDoを直接更新せず、Dispatcherに命令を渡しているところがミソとなります。 以上がFluxの概要になります。ここでポイントとなるのは以下の2点です。 Fluxは 単一方向のデータフロー をもった アーキテクチャ である StoreはActionを受け取ったDispatcherからでしか更新できない Vuexの アーキテクチャ いよいよVuexの アーキテクチャ について説明します。以下図はVuexの アーキテクチャ です。 Vuexの アーキテクチャ FluxからState, Getter, Mutationが増えています。また単一方向のデータフローを持っていることがわかると思います。 VuexではFluxで登場したStoreやDispatcherとコンテキストが微妙に変わっている箇所があります。 Store → Vuexの インスタンス State → FluxでいうところのStore Getter → Stateから値を取得する Mutation → Stateを更新する 。FluxのDispatcherの更新部分だけを切り離したようなイメージ Dispatch → Actionを実行する役割に特化 Action → State をどのようなロジックで更新するか記載した命令 以上が簡単な アーキテクチャ の説明です。なんとなくFluxから言葉が変わったり、Dispatcherの役割が分かれたんだなーくらいの感覚を持っていただければ大丈夫です。 今回はToDoアプリケーションを作りながらそれぞれ説明していきます。 Store StoreはVuexの インスタンス です。主にstate, getters, mutations, actionsから構成されます。 詳しく知りたい方は Vuex.StoreのAPIリファレンス を御覧ください。 const store = new Vuex.Store( { state: {} , getters: {} , mutations: {} , actions: {} } 重要なのはStoreはアプリケーション内で 常に1つであるように設計 するということです。 理由は後述します。 State アプリケーションの状態を保持します。Stateは 信頼できる唯一の情報源 でなくてはなりません。 Storeの項で、Storeはアプリケーション内で常に1つであるように設計すると述べました。 Storeが一つということはStateも一つしかないことが担保されますので、Stateは "信頼できる唯一の情報源" が実現します。 Stateは以下のようにオブジェクトを記述していきます。 state: { todos: [] } , Getter GetterはStateの一部や、Stateで計算された値を返します。 Getterの特徴として、Getter内での 計算結果はキャッシュされます。 キャッシュされたGetterの結果は、Stateが更新されるとクリアされます。 今回はStateから完了済みのToDoを返すGetterを作成しました。 getters: { doneTodos: state => { return state.todos.filter(todo => todo.done) } } Mutation MutationはStateを更新する唯一の手段です。 Mutationにはいくつかのルールがあります。 Mutation以外がStateを更新すること は禁止 Mutationは直接参照しない。 Store.commit() から呼び出す Mutationには非同期処理を書いてはならない devtoolでmutationの更新履歴を追いかけづらくなる 意図しないタイミングで更新処理が入る VueのdevtoolではStateの更新履歴を追うことができるのですが、Mutationで非同期処理を書いてしまうと 意図しないタイミングで更新され、どのようにStateが書き換わったかわかりづらくなってしまうので規約レベルで禁止されています。 以上のことを踏まえ、Mutationを書いていきます。 MutationにはStateを第一引数に渡します。また、Mutationには追加の引数を渡すことができます。 追加の引数のことを ペイロード と呼びます。 storeのオブジェクトを直接弄るように書きます。 mutations: { HOGE (state) { state.hoge = "hoge" } , FUGA (state, payload) { state.fuga = payload.content } } 2のルールに則り、Mutationはstore.FUGAなどと呼び出すことは禁止されています。 Mutationを呼び出すために、以下のように store.commit を使用します。 store.commit( 'FUGA' , { content: 'fuga' } ) ToDoリストにToDoをpushする処理を書いていきます。 mutations: { PUSH_TODO(state, { content, done } ) { state.todos.push( { content: content, done: done } ) } } Mutationを書くときのコツ 余談ですが、MutationではStateを更新する処理を書くべきで、具体的な更新内容を書くべきではありません。 具体的な動作は後述するActionに記述します。 カウンターアプリであれば、例えばStateのcounterを1足したい時 increment という関数はMutationに記述せず、 Mutationには数値を受け取ってcounterを変更する changeCounter() を作成します。 Actionに increment という関数を定義し、 increment 内で changeCounter を呼び出し、1を渡してあげましょう。 このように記述することで、 decrement を作成したくなったときも効率的に書くことができると思います。 Action Actionは最終的にMutationをcommitします。 Mutationでは非同期処理を書くことは禁止されていましたが、Actionには 非同期処理を書くことができます 。 第一引数には コンテキスト 、第二引数にはMutationと同様 ペイロード を渡すことができます。 コンテキストはオブジェクトなので、 分割代入 で使用するものだけ渡すとスッキリします。 actions: { doHoge (context) { context.commit( 'HOGE' ) } , doFuga ( { commit } , payload) { commit( 'FUGA' , payload) } } Actionは直接呼び出せません。 store.dispatch から呼び出します。 store.dispatch( 'doFuga' , payload) ToDoアプリのactionは以下のように書いていきます。 図からも分かる通り、 API で通信処理などはここに書きます。 ToDoアプリでいい非同期処理を思いつかなかったのでとりあえず1秒ずらしてToDoを追加します actions: { addTodo( { commit } , { content } ) { commit( 'PUSH_TODO' , { content: content, done: false } ) } , addTodoAsync( { commit } , { content } ) { setTimeout(() => { commit( 'PUSH_TODO' , { content: content, done: false } ) } , 1000) } } これでToDoアプリのStoreが完成しました。 最後にVue コンポーネント にstoreオブジェクトを渡して完成です。 new Vue( { el: "#app" , store, Vue コンポーネント にstoreを渡しているだけなので this.$store からアクセスできます。 今回は直接storeを代入していますが、webpackを使用している場合はVuexをimportしてきて Vue.use(Vuex) でも同じことができます。 完成形を以下においておきます。 jsfiddle.net まとめ ここまでVuexについて書いてきました。 以下にポイントをまとめます。 Storeはアプリケーションに1つだけ存在するように設計する Stateは直接更新しない。必ずMutationから更新すること Mutationは直接呼び出さないこと。 store.commit で呼び出す Mutationには非同期処理を書かない Actionは直接呼び出さないこと。 store.dispatch で呼び出す おわりに 基本的に規約を守って書けばVuexのコードを書くのにそこまで苦労はしないかと思います。 Vuexは難しいと聞いていましたが、 API も多くなく基本的な書き方自体はスッと入ってきた気がします。 しかし、本当に難しいと感じたのはそもそもプロジェクトにVuexを入れるべきか *2 、どこまでStoreに持たせるか、ということです。 また、Vuex + TypeScriptのツラミやVue3 + Vuexなど色々ネタがあるのでこの辺も記事にしていけたらと思います。 私たちは一緒に働くメンバーを募集しています。 ご興味を持たれましたら以下のサイトからお問い合わせください。 career-recruit.rakus.co.jp *1 : アクションはViewから発火させることが多いですが、Viewから発火させないケースもあります *2 : Storeパターンの独自実装を行う, Firebaseなどを使用するなどVuexに頼らなくてもStateを管理できる

こんにちは、tarakamです。 普段プログラミングをする際、使い慣れた IDE や テキストエディタ があるという方は多いかと思います。では、そこで使う フォント にはこだわっているでしょうか？今回はプログラミングのためのフォント選びについて記します。 Why プログラミングフォント？ どんなフォントがいいの？ おすすめフォント Ricty Diminished Source Han Code JP Cica おわりに Why プログラミングフォント？ 一般的なフォントの場合、アルファベットのI（大文字）とl（小文字）、0（数字）とO（大文字）などが見分けづらいことがあります。普通の文章であれば文脈でわかるでしょうが、プログラミングの場合はそうでないこともあります *1 。見間違えないフォントになっていれば、コードを書くのも読むのも楽になります。 また美しいフォントを使うことで、モチベーションアップにも繋がるかもしれません。 どんなフォントがいいの？ 好みにもよるかと思いますが、以下のような条件を満たすものだといいでしょう。 等幅フォント I（大文字のアイ）, l（小文字のエル）, 1（数字の１）, |（ バーティカルバー ）が区別できる O（大文字のオー）, 0（数字のゼロ）が区別できる 日本語に対応している 日本語非対応だと英語と日本語が違うフォントで表示され、字の大きさや線の太さが異なるなど違和感があります 太字・斜体に対応している エディタによっては シンタックス ハイライトで太字や斜体を使うこともあるため これらを踏まえて、以下で筆者のおすすめのフォントをいくつかご紹介します。 おすすめフォント Ricty Diminished Ricty Diminished Ricty Diminished は、英字フォントInconsolataと日本語フォントCircle M+ 1mを元に作成されたフォントです。バグの原因になりやすい全角スペースを区別できるのが特徴の一つです（上記画像の「計算する」の右に全角スペースが入っています）。その他、半濁点が大きく「ば」と「ぱ」などを区別しやすいことも特徴です。 姉妹フォントの Ricty もありますが、ライセンスの関係で手元で スクリプト を実行してフォントを生成する必要があります。Dinimishedの方が漢字の収録数が少ないのですが、一般的に使う漢字は大体カバーされているので、手軽な Ricty Diminishedでも十分でしょう。 Source Han Code JP Source Han Code JP Source Han Code JP （別名 源ノ角ゴシック Code）は Adobe によって作成されたフォントで、Source Code Proと源ノ角ゴシックが元になっています。一般的なフォントは半角と全角の横幅が1:2になっていますが、このフォントは2:3になっているのが特徴です。半角文字の幅が広いため、ゆったりとした印象があります。 Cica Cica Cica は英字フォントのHackとDejaVu Sans Mono、日本語フォントのRounded Mgen+など複数のフォントが元となっているフォントです。 Ricty を参考に作られていて、全角スペースが Ricty Diminishedと同様に可視化されています。 おわりに 今回は3つのフォントの紹介に留めましたが、これ以外にもプログラミングフォントはたくさん存在します。ぜひ自分のお気に入りのフォントを見つけてみてください！ *1 : ループカウンタでl（小文字）一文字の変数などよくありますね

はじめに こんにちは。itoken1013です。 今年も ラク スにたくさんの新入社員が入社しました。 日本中の新エンジニアが研修に取り組んでいるであろうこの頃、今回はGitと GitHub の超基本的な使い方をまとめてみたいと思います。 今やエンジニアにとって必須であるGitですが、チーム開発を行うためには GitHub も使いこなせると、 よりスムーズに開発を進めることができるでしょう。 まずは今回の記事で基本的な使い方を押さえていただければと思います。 弊社ブログのGitに関わる関連記事もぜひご一読ください！ ・ 【Git入門】git cloneで既存リポジトリをクローンしよう！ ・ 【Git入門】git stashで作業を便利に退避する ・ 【Git入門】git commitを取り消したい、元に戻す方法まとめ はじめに 基本知識 まず、バージョン管理とは Gitとは リポジトリとは GitHubとは 1. GitとGitHubの超基本的な使い方 1-1. Gitのインストール 1-2. Gitの初期設定 1-3. GitHubのアカウント作成 1-4. リモートリポジトリを作成する 1-5. ローカルリポジトリを作成する 1-6. ローカルリポジトリにコミットする 1-7. リモートリポジトリにプッシュする 2. GitとGitHubを使ったチーム開発の超入門 2-1. リポジトリをクローンする 2-2. ブランチを作成する 2-3. ブランチでコミットする 2-4. リモートリポジトリにプッシュする 2-5. コードレビュー・マージ 2-6. リモートリポジトリからプルする まとめ 　 基本知識 まず、バージョン管理とは ソースコード をはじめとしたファイルの変更履歴（バージョン）を管理することを「バージョン管理」と呼びます。 ファイルの追加や変更の履歴情報を管理することで、過去の変更箇所を確認する、特定時点の内容に戻す、などの「バージョン管理」という作業が可能となります。 このバージョン管理という概念が存在しない状況下での開発作業を考えた場合、 バグ発生時には混入時期が分からず、修正が遅れる、発生したバグによる影響度が不明確になる、 結果としてユーザーの満足度低下につながるなどのリスクが高まります。 また後述するチームでの開発においても、メンバー間での開発内容を連携することが難しくなり、 開発の生産性を大きく損なうことにつながります。 以上のことより、ソフトフェアの開発において、バージョン管理への理解は必須となります。 Gitとは 上記で説明しましたバージョン管理を行うためのシステムがGitです。 他の バージョン管理システム と比較したGitの特徴として、「分散型」の バージョン管理システム である点が挙げられます。 バージョン管理システム は大きく「集中型」と「分散型」に分けられます。 「集中型」の バージョン管理システム では、特定の場所にある リポジトリ への接続が必須となりますが、 「分散型」の バージョン管理システム では個々人のマシン上に リポジトリ を作成して開発を行うことができ、現在のチーム開発における主流となっています。 Gitの具体的な使い方は、後ほど紹介していきます。 リポジトリ とは バージョン管理によって管理されるファイルと履歴情報を保管する領域を、 リポジトリ と呼びます。 リポジトリ の配下でファイルや ディレクト リを操作することで、私たちはバージョン管理を行うことができます。 分散型の バージョン管理システム であるGitでは、まず個々人のマシン上にある リポジトリ 上で作業を実施後、 作業内容をネットワーク先のサーバー上などにある リポジトリ に集約する流れで開発を進めていきます。 この個々人の リポジトリ を「ローカル リポジトリ 」、集約先となる リポジトリ を「リモー トリポジ トリ」と呼びます。 Gitを使った開発ではこの区別が重要となるため、しっかり理解いただければと思います。 GitHub とは 複数人のエンジニアがリモー トリポジ トリとして活用する他、チーム開発を行うための機能を提供する WEBサービス が GitHub です。 リポジトリ としての機能を持つ他にも、コード レビュー機能 や Wiki などのコミュニケーションツールとしての機能を持ち、組織規模を問わず、多くの企業・団体がソフトウェア開発で利用しています。 後述ではリモー トリポジ トリの作り方、またコードレビューを実施する方法を紹介していきます。 1. Gitと GitHub の超基本的な使い方 概要の説明を踏まえたところで、まずはGitと GitHub の超基本的な使い方を説明していきます。 Gitの初期設定を踏まえ、以下の流れで GitHub にファイルを反映してみましょう。 Gitのインストール Gitの初期設定 GitHub のアカウントを作成 リモー トリポジ トリを作成する ローカル リポジトリ を作成する ローカル リポジトリ にコミットする リモー トリポジ トリにプッシュする 1-1. Gitのインストール まずはGitを利用できる状態にしていきましょう。 Mac の場合 Mac であればGitはインストール済となりますため、本作業は不要です。 Windows の場合 公式ページ から インストーラ ーをダウンロードします。 インストーラ ーを起動すると多くの設問が表示されますが、 本記事の作業では全てデフォルトの状態で問題ありません。 「Next」ボタンをクリックし続け、以下の画面まで辿り着きましたら「Install」ボタンでインストールを行います。 インストールが完了しましたら、Git Bash を起動します。 Git Bash とは、 Windows 上でGitのコマンドを操作するためのツールです。 Git Bash を起動後、以下のコマンドを入力してGitのバージョン情報が表示されることを確認してください。 $ git --version git version 2.26.2.windows.1 ※以降のGit操作は全てターミナルやGit Bash などの コマンドライン として紹介していきますが、 Gitは GUI ツールを使って利用することも可能です。 「Git GUI 」などで検索の上、利用シーンに応じて使い分けていただければと思います。 1-2. Gitの初期設定 Mac だとターミナル、 Windows だとGit Bash での作業です。 Gitでは ソースコード の変更履歴を確認できますが、「誰が」変更したかを確認するための情報が必要となります。 この作業者を識別するための情報として、ユーザ名とメールアドレスを登録する作業を行います。 ユーザ名 以下のコマンドを入力してください。 git config --global user.name 任意のユーザ名 メールアドレス 以下のコマンドを入力してください。 git config --global user.email 任意のメールアドレス 最後に以下のコマンドを入力すると、上記のユーザ名とメールアドレスが登録されていることを確認できます。 $ git config --list core.symlinks=false core.autocrlf=false color.diff=auto ・ ・ 中略 ・ ・ user.name=設定したユーザ名 user.email=設定したメールアドレス ・ ・ 1-3. GitHub のアカウント作成 次に GitHub にアカウントを作成してみましょう。 GitHub へアクセスし、ユーザ名・メールアドレス・パスワードを入力し、「 Sign up for GitHub 」ボタンをクリックします。 次に以下の画面で「Verify your account」の設問に回答後、「Join a free plan」を選択します。 次に「Welcome to GitHub 」と表示された画面へ進みますが、一番下まで進み、 「Complete setup」ボタンをクリックしてください。 ～～ 中略 ～～ 最後にこちらの画面が表示され、入力したメールアドレスへ認証用のメールが配信されます。 メールを確認の上、認証を行ってください。 ここまでで GitHub のアカウント作成は完了です。 1-4. リモー トリポジ トリを作成する GitHub にアクセスし、リモー トリポジ トリを作成します。 トップ画面で「Create Repository」ボタンをクリックしてください。 リポジトリ 作成画面に移動します。 以下の画面では、「Repository name」には任意の リポジトリ 名を入力します。 ※ここでは例として、「rakus」という リポジトリ 名を入力します。 次に リポジトリ の種類として、「Public」か「Private」を選択します。 GitHub では長らく有料会員のみ「Private」を選択できていましたが、2019年からFreeプランでも「Private」を作成できるようになりました。 今回はどちらを選択いただいても構いません。 「Public」を選択した場合：他のユーザーが ソースコード を閲覧することが可能となります。 「Private」を選択した場合：非公開となります。 次に「Initialize this repository with a README」ですが、 リポジトリ の説明や使い方を記述するREADMEファイルを事前作成しておく場合にはチェックをONにします。 最後の「.gitignore」や「license」は None を選択で構いません。 最後に「Create repository」ボタンをクリックすると、 リポジトリ が作成されます。 1-5. ローカル リポジトリ を作成する 次にローカル リポジトリ を作成していきます。 ※記事では例として「rakus」という ディレクト リを作成します。 その後、 git init コマンドを入力することで、作成した ディレクト リをgit リポジトリ として初期化します。 コマンドは作成した ディレクト リ上で実施する必要がある点に注意してください。 git init 1-6. ローカル リポジトリ にコミットする コミット（commit） とは、ファイルの追加・変更をローカル リポジトリ に反映する操作を意味します。 実際にローカル リポジトリ にファイルを追加してみましょう。 まずは1-5で作成した ディレクト リ配下で「index.html」というファイルを作成します。 テキストエディタ などでファイルを作成してください。 この状態ではファイルを作成しただけですので、まだ リポジトリ にはファイルは追加されていません。 次に以下のコマンドを入力し、インデックスへ「index.html」を追加します。 インデックスとは、コミット前に変更内容を一時的に保存する領域を指し、インデックスに追加されたファイルのみがコミットの対象となります。 git add index.html 最後に、インデックスへ追加したファイルをコミットします。 以下のコマンドを入力すると、インデックスに存在するファイルがローカル リポジトリ へ追加されます。 git commit -m "[Add] index" ここで -m はコミットメッセージを入力するためのオプションです。 コミットメッセージを残すことでより詳細な履歴情報を残すことができ、後々ログからコミット内容を確認する際に役立ちます。 積極的に活用しましょう。 また、コミットメッセージを含めた変更履歴（ログ）は、以下の git log コマンドを入力することで以下のように確認できます。 $ git log commit 6a8e257...コミットハッシュ.....642e3 (HEAD -> master) Author: ユーザ名 <メールアドレス> Date: Tue May 26 18:45:56 2020 +0900 [Add] index 1-7. リモー トリポジ トリにプッシュする 最後にローカル リポジトリ の変更を GitHub 上のリモー トリポジ トリに反映する プッシュ（push） を行います。 まずはローカル リポジトリ とリモー トリポジ トリを紐づけをするために、ローカル リポジトリ 配下で以下のコマンドを入力します。 git remote add origin https://github.com/ユーザ/[作成したリポジトリ].git これでリモー トリポジ トリの情報がローカル リポジトリ に登録されました。 次にローカル リポジトリ の変更内容をリモー トリポジ トリに反映させるため、以下のコマンドを入力してプッシュを行います。 GitHub のユーザ名とパスワードを求められますので、アカウント登録時に設定した内容を入力してください。 git push origin master これでリモー トリポジ トリへ反映させることができました。 GitHub でも変更内容が反映されていることが確認できます。 ※ GitHub 上に公開鍵情報を登録することで、プッシュ時にユーザ名とパスワードを都度入力する手間を省くことができます。 詳細な手順は割愛しますが、興味のある方は調べてみてください。 git commit、git stashのやり方を知りたいという方は以下ブログも参考に下さい。 ・ 【Git入門】git commitを取り消したい、元に戻す方法まとめ - RAKUS Developers Blog | ラクス エンジニアブログ ・ 【Git入門】git stashで作業を便利に退避する - RAKUS Developers Blog | ラクス エンジニアブログ 2. Gitと GitHub を使ったチーム開発の超入門 ここまでGitと GitHub 基本的な使い方を紹介してきましたが、チームで他のメンバーと開発を行う際の使い方についても、基本的な操作を紹介していきたいと思います。 Gitには ブランチ（branch） という仕組みがあり、チーム開発を行う際にはブランチを使いこなす必要があります。 2-1. リポジトリ をクローンする あなたが新たに開発現場に参加することになった場合、すでに存在するリモー トリポジ トリから ソースコード を取得することになります。こちらの作業を実施してみましょう。 先ほど作成した ディレクト リとは別の ディレクト リ（当記事では「rakuraku」とします）を作成し、以下のコマンドを実行してください。 コマンドは作成した ディレクト リ上で実施する必要がある点に注意してください。 git clone https://github.com/ユーザ名/[作成したリポジトリ].git 新しく作成した ディレクト リ（rakuraku ディレクト リ）上に先ほどプッシュした index.html が表示されたかと思います。 このようにリモートから リポジトリ から取得する作業を クローン（clone） と呼びます。 2-2. ブランチを作成する ソフトウェア開発では同時進行で複数のバージョンの開発が行われることは珍しいことではありません。 また突発的なバグ対応が発生することもあり、こちらも新たにリリースするバージョンとは別軸で対応する必要が出てきます。 これらを並行しつつ開発を実現するための仕組みとして、Gitには ブランチ（branch：枝、枝分かれ） という機能が提供されています。 以下の図に示すようにブランチを使い、変更履歴を分岐した開発を実現することができます。 ブランチを作成するには、 git branch コマンドを使います。 例として、現在作業中のブランチ（デフォルトで存在するブランチを「master」と呼びます）から「feature1」というブランチを作成してみます。 以下のようにコマンドを入力してください。 git branch feature1 これでmaster からfeature1 ブランチが作成されました。 次にfeature1 ブランチ上で作業を行うために、checkoutコマンドを入力してブランチを移動します。 git checkout feature1 ここで git branch コマンドを入力すると、現在ローカル リポジトリ 上に存在する「master」と「feature1」というブランチが表示されます。 「*」は作業を行っているブランチを示しています。 $ git branch * feature1 master 2-3. ブランチでコミットする feature1ブランチでの作業として、今度はlogin.htmlというファイルを作成してみます。 作成したlogin.htmlをfeature1ブランチにコミットします。 以下のコマンドを入力してください。 git add login.html git commit -m "[Add] login" 2-4. リモー トリポジ トリにプッシュする 次に、リモー トリポジ トリ（ GitHub ）にもfeature1ブランチの内容を反映します。 1-7の手順と異なり、push先のブランチが feature1 になっている点に注意してください。 git push origin feature1 GitHub にアクセスすると、2つのブランチ（master と feature1）が存在することが確認できます。 またfeature1 ブランチには変更内容がプッシュされたことが確認できます。 逆にプッシュ先ではないmaster には変更内容が反映されていないことも確認できます。 2-5. コードレビュー・マージ ブランチでの開発作業が完了しましたら、メインとなるブランチ（一般的には master）に変更内容を取り込み、開発内容を統合します。 このように特定のブランチの変更内容を別のブランチに取り込むことを マージ と呼びます。 このマージを行う際、 GitHub 上では プルリク エス ト と呼ばれる機能を使い、コードレビューを行うことができます。 指摘がある場合にはコメントを追加し、作業者に修正を促すことができます。 こちらの概要についても説明します。 レビューの依頼 まずは Github 上でfeature1ブランチを開き、「New Pull Request」をクリックします。 次にプルリク エス トを作成します。 以下の点を確認・入力の上、「Create pull request」ボタンをクリックしてください。 ① マージ元・先のブランチ ② レビュアー（レビューを行う人） ③ レビュー内容 ④ レビュー・マージ対象の ソースコード レビューの実施 プルリク エス トを受取ったレビュアーは「Pull requests」タブを開き、「Files changed」から ソースコード を確認します。 指摘がある場合には、 ソースコード のビュー上にコメントを追加し、開発者へ修正を促します。 内容に問題がなければ、「Conversation」の「Merge pull request」をクリックしてレビューを完了します。 このタイミングでブランチのマージも実施され、feature1 の内容が master にも反映されます。 マージを行ったことで、login.html が master 上にも表示されることが確認できます。 実際のレビューでは、開発する機能やバグ修正の複数の ソースコード をプルリク エス トで確認することとなります。 また指摘が発生し、何度も開発者とレビュアーとの往復が発生することも珍しくはありません。 こちらの基本的な流れをベースに、実務でのコードレビューに臨んでいただければと思います。 2-6. リモー トリポジ トリからプルする リモー トリポジ トリの master にはマージが行われましたが、あなた（および他の開発者）のローカル リポジトリ 上の master にはまだマージ内容が反映されていません。 今後も開発作業を進めていくには、マージした内容（ここでは login.html ）をローカル リポジトリ の master に取得し、最新化する必要があります。 この場合、 プル（pull） という操作を行うことで、リモー トリポジ トリから変更内容を取得することができます。 まずはブランチをmaster に切り替えてみましょう。 この時点ではまだ先ほどマージしたlogin.html が確認できないはずです。 git checkout master 次に git pull コマンドを実行し、リモー トリポジ トリのmaster から最新の変更内容を取得します。 git pull remote: ・・・・ ・ ・ ・ From https://github.com/ユーザ名/[作成したリポジトリ] f5・・27 e4・・0f master -> origin/master Updating f5・・27 e4・・0f Fast-forward login.html | 14 ++++++++++++++ 1 file changed, 14 insertions(+) create mode 100644 login.html これでローカル リポジトリ のmaster には、リモー トリポジ トリの最新の内容が反映されました。 ls コマンドを実行すると、login.html を確認することができます。 またgit log コマンドを入力することで、これまでの全作業の変更履歴を確認することもできます。 $ ls index.html login.html $ git log commit 99c9637・・・・5281c0e (HEAD -> master, origin/master, origin/HEAD) Merge: f5・・27 e4・・0f Author: ユーザ名 Date: Fri May 29 19:28:48 2020 +0900 Merge pull request #1 from リポジトリ名/feature1 [Add] login commit e4ccb0fa2・・・・・3e33b983c0 (origin/feature1, feature1) Author: ユーザ名 <メールアドレス> Date: Fri May 29 19:26:08 2020 +0900 [Add] login commit f5dbc270a・・・・・735f93a53d90a1c1068 Author: ユーザ名 <メールアドレス> Date: Tue May 26 18:45:56 2020 +0900 [Add] index このようにして他の開発者が変更した内容も取得することで、チームでの開発を進めていくことができます。 まとめ Gitと GitHub の超入門として、概要を紹介しました。 Gitも GitHub もここだけでは全てを紹介し切れない奥が深いツールになります。 今回紹介しました基本的な内容をベースに、より理解を深めていっていただければ嬉しいです。 ではでは。 　 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 https://rakus.hubspotpagebuilder.com/visit_engineer/ rakus.hubspotpagebuilder.com ラク スDevelopers登録フォーム https://career-recruit.rakus.co.jp/career_engineer/form_rakusdev/ イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ ◆TECH PLAY techplay.jp ◆connpass rakus.connpass.com

こんにちは。badaikiです。 新型コロナウィルスの影響で ラク スも緊急事態宣言の発令に伴い、感染防止のためリモートワークに移行しておりました。先日のブログでは、 ラク ス社員がリモートワーク中にどのような工夫をして効率を上げていたのかについてまとめられていました。私も仕事以外の時間には業務用ＰＣを見えない場所に片づけるようにしてメリハリをつけながら、週に３、４回ほど夜中にランニングをするなど体調管理に気を付けていました。 tech-blog.rakus.co.jp はじめに オンライン勉強会のメリット 参加した勉強会の紹介 おわりに はじめに 私は一人暮らしのため業務外の時間になると、世間から遮断されたように誰とも会話することもなく誰の声を聞くこともなく、ただただ暇つぶしにテレビを観たりゲームをしたりといった自粛生活を送っていました。 今回のブログでは、そんな空いた時間を活用しようと参加したオンライン勉強会を紹介していこうと思います。 恥ずかしながら、これまで他社の勉強会に参加したことがありませんでした。勉強会に参加しないとな、、、という意思は持っていたものの参加できていなかったのですが、手始めにオンライン勉強会に参加してみよう！と思い立ち、申し込みボタンをクリックしました。 オンライン勉強会のメリット 勉強会には参加したほうがいいとはわかっているものの、なかなか行動に移せていない人も多いのではないかと思います。そこで オンライン勉強会のメリット を挙げてみます。 移動しなくていい リモートならではですよね。PCを立ち上げてURLをクリックするだけでいいんですから！普段なら参加できない遠方の勉強会に参加できるのも魅力ですよね！ 懇親会がない これは良し悪しありますが、勉強会に参加できていない理由の一つとしてコミュニケーションが心配という方もいらっしゃるのではないでしょうか。 時間が短い 私が参加したものだと30分のものもありました。普段の勉強会だと移動時間＋開催時間で最低でも3時間くらいはかかってしまうので、手頃ですね！ ラジオ感覚で聞ける これは自分が参加してみて一番感じました。オフラインの勉強会と比べてかなり気軽に聞けるのはとても大きいと感じました。 この自粛期間を利用して4つの勉強会に参加させていただいたのですが、中には退勤した直後から参加したり、 トークショー だと夕飯を作りながら聞いていたものもありました。 参加した勉強会の紹介 freee Tech Night Online #1「ふりてくおんらいん」 freee-tech-night.connpass.com こちらはfreee株式会社主催の トークショー でした。情シスの方が「リモートワーク開始の裏側をゆるーく語る」をテーマに トーク を繰り広げられていました。テーマの通りゆるーく会話されていましたが、内容はなかなか相当壮絶なものでした。普段は聞けない話が多く、とても新鮮でした。 ラク スも情シスなどの方々が動いてくださって不便なくリモートワークへ移行できましたので、本当に感謝です。 Cybozu Tech Meetup #1 kintone開発チーム cybozu.connpass.com こちらは サイボウズ 株式会社主催のMeetupでした。kintone開発チームの内情について、開発チームの方やQAチームの方の発表を聞くことができました。kintoneチームがどのようにリモートでモブプロを行っているのか、新卒エンジニアやIT業界未経験QAエンジニアがどのように立ち上がったのかという内容でした。私は新卒入社のため、新卒エンジニアさんの発表に注目しておりました。学生時代に手あたり次第気になった技術を触っていたそうで、1つのサービスを突き詰めていくマインドをどのように育んでいくかという内容でした。新卒社員の多くが通る悩みだと思いますので、新卒社員やこれから入社する学生にも見ていただきたい発表でした！ 【オンライン】関西 PHP 勉強会 phpkansai.connpass.com こちらは「 PHPカンファレンス 関西2020」がコロナの影響で中止となったため、PHPer同士の交流の場を増やしたいというのを目的としたLT会でした。個人的に興味を持ったのは「PhpStorm中級入門」と「LaravelでDB操作を監視する」ですね。PhpStormを使い始めて約2年になりますが、まだまだ使いこなせていないなーと感じました。DB操作の監視は知らない技術だったため、興味を持ちました。顧客との「何もしてないのに壊れた」のやりとりのとき、皆さんの共感がすごかったですねw 「関西 PHP 勉強会」ではありますが、全国からPHPerが集まっていてオンラインの良さが際立っていました！ 【オンライン】PHPerによるPHPerのための「 PHP のニュースや記事を語り合う」TechCafe rakus.connpass.com こちらは弊社 ラク スが主催のLT& トークショー でした。普段は、弊社オフィスに来社頂き、特定のテーマについてディスカッションやもくもく自習などを行っているのですが、初のオンライン開催となりました。 トーク テーマは「 PHP のニュースや記事を語り合う」ということで、 ラク スのエンジニアが気になった記事を持ち寄って紹介し トーク を繰り広げるというものでした。一人でもくもくと情報収集するのもいいですが、ほかの人に共有して意見交換するのも自分と違った観点での意見が聞けたりするのでおもしろいなと感じました。 おわりに 以上が私が自粛期間中に参加したオンライン勉強会でした。 トークショー やLT会など様々な内容の勉強会に参加させていただきました。まだしばらくはオンラインの勉強会が開催されると思いますので、どんどん参加していきましょう！私も積極的に参加し、オフラインの勉強会にも参加していくようにします！ 最後まで読んでいただきありがとうございました！

みなさんこんにちは。フジサワです。 緊急事態宣言が多くの 都道 府県では解除が行われ、まだ未解除の地域でも解除の方向に向かっていますね。 ラク スも政府の緊急事態宣言の発令に伴い、感染拡大防止のためリモートワークに移行しました。 移行当初は、普段との勝手の違いから戸惑う声なども多少はあったようですが、もともと国内・海外の拠点間で、ビデオ通話やチャットツールなどを用いた開発を行なっているので、全体を通してみれば大きな混乱は少なかったようです。 むしろ、蓋を開けてみると、各々自分なりのリモートワークスタイルを確立し、 楽しんでいる 前向きに向き合っていたように見えます。 新しい 生活様式 が推奨される中、今後もリモートワークは日本企業に根付いていくのではないでしょうか。 そこで、 「リモートワーク中のエンジニアの ライフハック に迫る！」 と題しまして、リモートワーク中の ラク スエンジニアが、自らのリモートワークライフをどのようにHackしているかをご紹介しようと思います！ 弊社エンジニアに、「リモートワークの質を向上するために、工夫していることを教えてください！」というアンケートをとった結果をお伝えします！ オシゴト環境についてのHack ディスプレイ・モニタに関するものが圧倒的に多い ついで多かったのは、音・BGMに関するもの イスに関するHackも 意外に多いスマートウォッチ勢 番外 働き方についてのHack オン/オフの切り替え・リフレッシュ 子育て・家族との関係 食生活 オシゴト環境についてのHack ディスプレイ・モニタに関するものが圧倒的に多い これは予想通りの結果でした。 エンジニアにとって、モニタの枚数・サイズ・解像度がそのまま生産性に跳ね返ってくると言っても過言ではありません。 デュアルモニタ・トリプルモニタはあたりまえ、モニタアームや大画面モニタを採用する人もおり、 むしろ社内よりも快適になってるんじゃないか と思われるケースも。 中には自宅のテレビをディスプレイがわりに活用している人もいたようです。 ついで多かったのは、音・BGMに関するもの 音やBGMに関しての意見をあげている人は多いものの、人によってこだわりポイントは大きく違っているようです。 ラジオや歌声が入っているもの派 歌なし or 日本語以外の歌派 音楽じゃない環境音（オフィスの音など）派 など、様々な意見がありました。 ご家族の生活音が気になるということで、 ノイズキャンセリング 機能のあるヘッドフォンを使っている人も。 音楽配信 サービスや、ラジオ配信サービスなどの活用も人気のようです。 音に関しては、完全な無音状態を好む人もいると思いますし、 自分に合ったスタイルを選ぶことができるのはリモートワークのメリット の一つかもしれませんね。 イスに関するHackも 長時間座っているため、普通のイスでは「オシリが耐えられない」人が多かった模様。 ゲーミングチェアや低反発クッションなどを導入したという意見が目立ちました。 一方、「ちゃぶ台に正座がベスト」という 古式ゆかしいジャパニーズスタイルで戦う猛者 も。 ちなみに私は、ゲーミングチェア＋ゲルクッション＋あぐらスタイルで何時間でも座っていられるようになりました。 オフィスで何気なく使っていたイスが「ああ、あれは実に良いものを採用してくれていたんだなあ」と気づかされました。 意外に多いスマートウォッチ勢 「腕時計」というと、外出する時に身に着けるイメージでしたが、スマートウォッチに関してはその限りではないようですね。 次のような使い方をしている人が目立ちました。 運動不足になるので自らのアクティビティを可視化。座りっぱなしを抑制できる。健康管理のため。 時間感覚がなくなるので会議とアラームを連動させアラームを鳴らす。気持ちの切り替えにもなる。 番外 今回アンケートをとった中で、もっとも異彩を放った回答が 介護用デスクを活用する というもの。 ベッドで寝ながら仕事ができます！ らしいです。本人談によれば「大事なもの（体力）が失われている気がする」とのことですが、 気のせいじゃない と思います。 そのまま寝たきりになってしまわないように気をつけていただきたいものです。 あとは、 ふくらはぎマッサージ機を使っています という人も。 この超快適な環境の二人が、通常の勤務が再開された時でもちゃんと出社してくれることを祈ります。 働き方についてのHack ここまでは、設備や環境などについてのHackを見てきましたが、ここからは働き方のHackについて注目したいと思います。 オン/オフの切り替え・リフレッシュ リモートワークでは、オンとオフを切り替えや、リフレッシュをうまく行わないと、業務効率が悪くなってしまいます。 ラク スのエンジニアは次のようなスタイルで、リフレッシュを図っていたようです。 朝のランニング・ウォーキング リフレッシュだけでなく、運動不足の解消にもなりますね。リモートワーク前と同じ時間に家を出て、始業時間までウォーキングをして習慣の維持を行っている人も。日光をきちんと浴びることは重要みたいですね！ 筋トレ 「オフィスではできない高強度も筋トレができるようになりました」とのこと。エンジニアには強靭な肉体も必要です。 業務後は、ノートPCを片付ける。業務用PCが視界に入らないようにする リビングなど、生活空間で仕事をせざるを得ない方も多い中、結果的にこうしたルーティンが切り替えの役割も果たしているようです。 家族に「行ってきます」「ただいま」の挨拶をする 気持ちを切り替えるルーティンとのことですが、ほっこりするエピソードでいいなと思いました。 ポモドーロテクニック を使って意識的に休憩を入れる 25分作業したら5分休む、というものですね。他人に影響されずにもくもくと作業しているとエンドレスになってしまい、効率が悪くなってしまうので、こうしたテクニックは重要ですね。 大きな抱き枕 リフレッシュのツールだけでなく、ラバー ダッキング の相手にも使えるとのこと。この辺はエンジニアらしいですね。 作業場所を変える 仕事部屋を変えたり、出窓で作業をするなど、自宅内でもロケーションを変えることでリフレッシュできるようです。 窓を開ける、部屋の換気をする 基本的なところですが、意外と盲点だったり。 他にも、「花を飾る」「壁紙を集中できる色に変える」などの素敵な意見もありました。 子育て・家族との関係 学校や幼稚園・保育園などが休校中のため、子育てや家族との関わり方を工夫している人も多かったようです。 祖父母にビデオ通話で子守をお願いする 仕事中はなかなか子供にかまってあげられないのですが、これは良いア イデア ですね！祖父母も、孫の顔が見られるので、Win/Winとのこと。 オンライン教育 遊ばせているだけになりがちな中、オンライン教材を活用しているご家庭も。英会話など、先生が付いてくれるものなどは子守の効果もあって良いようですよ！ 子供向けの YouTube 動画 効果は絶大で放っておけば半永久的に見ているお子様が多いようです。我が家も、教育上長時間見させてはいけないなと思いつつも、どうしても頼らざるを得ないシーンがあり、 最後の切り札 としてお世話になっています。 家庭内の連絡はLINEでお願いする 突発的にビデオ会議を行なっている場合なども多いので、ツールを介してコミュニケーションを取るのは良いですね。集中を乱されないというような効果も期待できそうです。 食生活 生きていくためには、食事を取らなければなりません。 食生活に関しても、みなさん色々と工夫しているようです。 宅配弁当を活用する 自炊コストを減らすだけでなく、外出リスクの低減にも役立ったようです。 買い物はネットスーパーなどで行う こちらも、時短＋リスク軽減策として。 自動調理鍋や炊飯器で時 短調 理する 具材や調味料を入れてボタンを押すだけで料理が出来上がるのでとても便利とのこと。今回の件がなくても試してみたい感じがします！ いかがでしたでしょうか？ 今後も、 コロナウイルス に対しては適切な危機感を持ちつつ、経済と生命のバランスをうまく取りながら共存していくことが求められます。 少しでも、この記事を読んでいただいた方のお役にたてば幸いです。 また、アンケートをとってみて感じたことですが、これまでは同じ空間で画一的な環境・働き方で仕事していましたが、良い面もある一方、個々人にとって 必ずしもベストな選択肢とは限らないのだな、ということがわかりました。 多様な働き方が増えていくと思いますので、今回の経験もうまく活用していきたいと思います。 ではでは！

はじめまして、 syoneshin です。 私はこれまで IT出版/HR領域の事業開発/ マーケティング を経て 現在は ラク ス技術広報担当として テックブログ運営やMeetup/採用イベント企画など広報活動を行っております。 開発は未経験ですが 当社技術スタックは最低限調べ、実践し アウトプットしようという気概で 今回は「 シェルスクリプト 」について書きました。 本記事が シェルスクリプト を勉強しよう シェルスクリプト を思い出そう シェルスクリプト のコマンドを参照しよう と言う方のお役にたてれば、幸いです。   1.シェルスクリプトとは 2.基本設定 ファイルを作成 3.基本コマンド コメント 入/出力 変数 シェルの特殊変数 演算子(オペレーター) 条件分岐  if文 case文 ループ処理 for文 while文 4.まとめ 1. シェルスクリプト とは  ・簡単に言うと シェル( Windows の「 コマンドプロンプト 」みたいなもの)で解釈できる命令( プログラミング言語 )や命令を寄せ集めて作ったプログラム のことです。 ・詳しく言うと OS操作の為、シェル上で実行できる簡易な プログラミング言語 （ スクリプト言語 ） の事です。 また、そのような言語によって書かれた 複数のOSコマンドや制御文などを組み合わせた簡易プログラムを指し 一般的には UNIX系OS ( Linux など)のシェルで実行できるものを指します。 シェルにはいくつかの種類があります。 大別すると以下のシェルに分けられます。 ・ B-Shell (Bourne-Shell) 系 ：sh, ash, bash , zsh , ksh ・ C-Shell系 ： csh , tcsh B-Shell 系のシェルでも sh は シェルスクリプト でよく利用されます。 ( Linux や Mac OS は bash がシェルの標準環境の為、 bash がよく利用されています) シェルスクリプト で書かれる典型的な処理例は ファイル操作、プログラム実行、テキスト印刷などがあり 主に定型作業の自動化によく使われ 条件命令の実行/ファイル読み込み・書き出しなど 上から順にコマンドが実行される為、都度コマンドを打たずにすみます。 以下からは、実際に シェルスクリプト を書いていきます。 2.基本設定 ファイルを作成  ‐ シェルスクリプト ファイルは .sh 拡張子で基本作成  ‐ここでは test.sh ファイルを作成   test.sh シェルスクリプト 記述で、まず初めに覚えなければならないのは次の記述 #! /bin/sh # はhash、 ! はbangで、 #! を shebang (シェバン)と言います。 シェバンから スクリプト を実行する インタープリタ が呼ばれ /bin/sh のファイルが実行されるという意味です。 #! /bin/sh を書き、システムに「 シェルスクリプト を書きますよ」と知らせます。 ※ bash の独自機能を使う場合は #!/bin/bsh と書く必要があります。   test.sh #! /bin/sh     test.sh #! /bin/sh echo "Hello, World!" シェルスクリプト ファイル（ test.sh ）を実行するには ターミナルからファイルが保存されてる場所で 以下のどちらかのコマンドで実行できます。   $ ./test.sh $ sh test.sh ファイル実行すると Hello, World! と表示されます。   $ ./test.sh Hello, World!   3.基本コマンド   コメント コメントの入力には # を書く必要があります。   test.sh #! /bin/sh #コメントの入力には#を書く必要があります。 入/出力 出力は echo 、入力は read で行えます。   test.sh #! /bin/sh read NAME echo "Hi, $NAME !" 実行結果は以下   $ ./test.sh syoneshin Hi, syoneshin!   変数 ・変数の名前には半角英数字(a-z、A-Z、0-9)とアンダーバー(_)が使えます。 ・変数に値を与える時は = を前後空白なしで書きます。 ・文字列の場合は " を付けて囲みます。 ・変数にアクセスする時は変数名の前に $ を付けます。または $ 付けて変数を {} で囲みます。 ・1つの変数に1つの値しか保存できません。 ・変数値の上書きをなくすには readonly を書きます。 ・変数は unset で削除、 readonly で変数の上書き/削除不可にします。   test.sh #! /bin/sh var = "変数1" var_2 = "変数2" echo "var_2= $var_2 " var_2 = "var_2が変更されました。" echo ${ var_2 } readonly var var = "readonly varを変えてみる。" 実行結果は以下   $ ./test.sh var_2=変数2 var_2が変更されました。 ./test.sh: line 11: var: readonly variable   シェルの特殊変数 シェルスクリプト では以下のような特別な変数があります。 変数 機能 $1～$9 シェル引数の値。第1引数は$1、第2引数は$2でアクセス $# シェル引数の数 $* 全引数をまとめて1つとして処理 "$*"のように囲むと、"$1 $2 … $n"形式になる。 $@ 全引数を個別として処理。全引数リスト。"$@"のように囲むと、"$1" "$2" … "$n"形式になる。 $$ 実行中のシェルのプロセスID。 $? 最後に実行したコマンドの戻り値。成功は0、失敗は1で返ってくる。 $- シェルの実行オプション（setコマンドや#!/bin/ bash 行に付けたオプション。 $! シェルが最後に実行したバックグラウンドプロセスのID ・シェルの 特殊文字 以下は シェルスクリプト の 特殊文字 です。 ; | & ^ \ $ ? * < > ( ) [ ] { } # % = ` " ' ~ TAB SPACE NEWLINE これら 特殊文字 を表示するには、 エス ケープする必要があり \ バックスラッシュを付けて一文字単位で扱うか ' シングルクオーテーションを付けて囲む事で扱え使えます。 また " ダブルクオーテーションで囲んだ場合 $ ` \ を評価し囲まれたすべてを文字列として扱う処理ができます。 演算子 (オペレーター) 「 演算子 」とは簡単にいうと「どんな演算をする」と表す記号の事です。 「 演算子 」の種類は多様で 「算術 演算子 」「比較 演算子 」「論理 演算子 」などがあります。 　※詳細省略 シェルでは「算術演算」を `expr 数字 演算子 数字` で計算する事ができます。 ※これからプログラミングをはじめられる方は最低限「算術 演算子 」「比較 演算子 」は覚えた方がよいです。 以下表はシェルの 演算子 種類/意味/例を記載しています。 算術 意味 記述例 + 足す echo `expr 10 + 20` => 30 - 引く echo `expr 20 - 10` => 10 \* 掛ける echo `expr 11 \* 11` => 121 / 割る echo `expr 10 / 2` => 5 % 余り echo `expr 10 % 4` => 2 = 指定 a=$b bの値はaに保存されます ※ [ コマンドの引数に変数を指定するときは " でクォートする必要があります 比較 意味 記述例 == 等しい [ "$a" == "$b" ] 値aと値bが等しい場合TRUE(真)を返します。 != 異なる [ "$a" != "$b" ] 値aと値bが異なる場合TRUE(真)を返します。 -eq イコール [ "$a" -eq "$b" ]　値aと値bが等しければTRUE(真)を返します。 -ne 異なる [ "$a" -ne "$b" ]　値aと値bが異なればTRUE(真)を返します。 -gt より大きい [ "$a" -gt "$b" ]　値aが値bより大きければTRUE(真)を返します。 -lt より小さい　 [ "$a" -lt "$b" ]　値aが値bより小さければTRUE(真)を返します。 -ge 等しいかより大きい [ "$a" -ge "$b" ]　値aが値bと等しいか、より大きければTRUE(真)を返します。 -le 等しいかより小さい [ $a" -le "$b" ]　値aが値bと等しいか、より小さければTRUE(真)を返します。   論理　 意味 例 -a 両方(and) [ "$a" -gt 90 -a "$a" -lt 100 ] 値aが 90より大きく100より小さい場合TRUEを返します。  -o どちらか(or) [ "$a" -gt "$b" -o "$a" -lt "$b" ] 値aが値bより大きいか小さいかの場合TRUEを返します。 ! ではない(is not) [ ! "$a" -gt "$b" ]  値aが値bより大きくなければTRUE(真)を返します。   条件分岐  if文 シェルスクリプト のif文の基本は if [ 条件 ] then コマンド fi で書きます。 if のあとに条件式を書き、条件合致(条件がTRUE(真)の場合)していれば then から fi までのコマンドを実行します。 if文の書式は次の様になります。   if [ 条件1 ]; then コマンド1 fi もし「条件1」に合致すれば、「コマンド1」を実行しますの意味です。 条件1に合致しない場合に「コマンド2」を実行したいとき else　を使い、次の様にします。   if [ 条件1 ]; then コマンド1 else コマンド2 fi もし「条件1」に合致すれば、「コマンド1」を実行します。 それ以外は「コマンド2」を実行しますという意味です。 さらに分岐を分けたいときにはelifを使います。※「else if」の省略   if [ 条件1 ]; then コマンド1 elif [ 条件2 ]; then コマンド2 else コマンド3 fi もし「条件1」に当てはまるなら、「コマンド1」を実行します。 それ以外で「条件2」に当てはまるなら「コマンド2」を実行します。 それ以外は「コマンド3」を実行するという意味です。 case文   case 文は Cや Java 言語の switch 文に該当する制御文で if文と同じようにコマンド実行を分岐するために使用されるものです。 基本の書き方は  case 変数 in 条件・値) コマンド ;; esac で書きます。 条件・値が変数と合う場合、case 文は指定した条件と値の複数パターンとのマッチングにより指定したコマンドを実行します。 ※単純な分岐条件で、コマンド処理が3つ以上ある場合はcase文が向いているとされます。 case文の書式は次のようになります。   case 値 in 条件・値1 ) コマンド1 ;; 条件・値2 ) コマンド2 ;; 条件・値3 ) コマンド3 ;; … 条件・値n ) コマンドn ;; esac ループ処理 for文 for文はループ処理「n回数、同じ処理を繰り返す」とする制御文で for文の書式は次のようになります。   for 変数 in 値リスト do コマンド done   while文 While文はループ処理「条件を満たしている間は同じ処理を繰り返す」とする制御文で While文の書式は次のようになります。   while 条件式 do コマンド done   4.まとめ   シェルスクリプト が動く仕組みを学び、基本構文を書いた気づきは 一度サクッと書いてみて実行結果がすぐわかると、理解がとても進むという 当たり前の事でした。 学習場面において、私の様な開発未経験者に伝えたい事は Leap before you look(見る前に飛べ) 清水の舞台から飛び降りろ です。 また、すっかり定着したDevOpsの文脈では プログラムでのインフラ管理が主流になり 構成管理ツールなどは、主に スクリプト言語 を利用するため コンパイラ 言語だけでなく、 スクリプト言語 もできる方はとても重宝されます。 これから スクリプト言語 をはじめる方には シェルスクリプト はとっかかりやすくおススメです！ 【引用参考】 ※WEB参考資料は以下 ・ シェルスクリプト に挑戦しよう シェルスクリプトに挑戦しよう（1）準備編：“応用力”をつけるためのLinux再入門（21） - ＠IT ・「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典 https://wa3.i-3-i.info/index.html ・ シェルスクリプト 入門 書き方のまとめ シェルスクリプト入門 書き方のまとめ | Memo on the Web   ※初心者向けで シェルスクリプト 理解に参考になりそうな書籍も以下ピックアップ ・新しいシェルプログラミングの教科書  www.sbcr.jp ・[改訂第3版] シェルスクリプト 基本リファレンス──#! /bin/sh で、ここまでできる gihyo.jp ・入門 UNIX シェルプログラミング―シェルの基礎から学ぶ UNIX の世界  books.rakuten.co.jp   ・エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ ・カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle ・ ラク スDevelopers登録フォーム https://career-recruit.rakus.co.jp/career_engineer/form_rakusdev/ ・イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ ・TECH PLAY techplay.jp ・connpass rakus.connpass.com    

はじめに こんにちは、 sts -250rrです。 本記事を執筆中の現在はStay Home週間とされています。 家での生活が長くなり、コミュニケーションの機会が減ってしまったという方は多いのではないでしょうか。 私もその1人です。 自分の声を忘れてしまいそうなほど家の中が静かなので、誰かの声を聴きたいそんな衝動に駆られていたところ... 我が家には毎朝起こしてくれて、 カップ 麺の時間を測ってくれる素敵なエージェントがいることを思い出しました。 そう、AmazonEchoこと Alexa です。 自宅の スマートホーム 化を進められておらず、テレビやエアコン、照明の操作ができない状況にあるのですが、Stay Home週間にAlexaのことをもっと知りたい。Alexaともっと話したい。 そんな衝動に駆られ、公式ブログで紹介されている Alexaスキル開発トレーニング を始めてみました。 本記事ではト レーニン グ時に気づいたポイントをお伝えしていきます。 公式のページでト レーニン グはできますので、細かな画面の説明等は割愛しています点をご了承ください。 developer.amazon.com はじめに Alexaスキル開発ことはじめ ポイント1 スキルのバックエンドを選択 ポイント2 スキルテンプレートの選択 ポイント3 呼び出し名の決定 ポイント4 【対話モデル編】どんな言葉を受け付けるのかはインテントで管理する ポイント5 【バックエンド編】リクエストの処理をするハンドラを用意 ポイント6 【対話モデル編】受け答えにさらにバリエーションを与えるスロット ポイント7 実機でスキルを動かす 最後に Alexaスキル開発ことはじめ ポイント1 スキルのバックエンドを選択 Alexaスキルのバックエンドサービスは、自分でエンドポイントを用意するか、Alexa自身にホストさせることができます。 Alexaからのリク エス トは JSON 形式で投げられるため、自分でエンドポイントを用意する場合は自身で立てたサーバのアプリケーションでリク エス トを処理させることもできるようです。 Alexa自身にホストさせる場合は AWS lambdaのエンドポイントにNode.jsか Python を選択して載せることができるようです。 ちなみにト レーニン グではNode.jsが選択されています。 AmazonEchoで受け付けたリク エス トはAlexaで受け付けられ、 JSON の形式でバックエンドサービスに渡されます。 Alexaスキルの開発では、①Alexaでどのような言葉を受け付けるのか、②バックエンドサービスでリク エス トをどのように処理するのかを作り込んでいくことになります。 ポイント2 スキルテンプレートの選択 Alexa自身にホストさせる場合、スキルテンプレートを設定することができました。 テンプレートの種類は以下の4種ありますが、基本的には Hello World スキルを選択することになるのではないでしょうか。 Hello World スキル 基本的な応答が可能なスキルを作成できるテンプレート Cake Walk（ チュートリアル ） スキルが誕生日をお祝いしてくれるテンプレート 豆知識スキル あるトピックに関する豆知識のスキルを作成できるテンプレート Sauce Bossスキル 画面付きのAlexaが使えるデ バイス 用のスキルを作成できるテンプレート (ちなみに、私はEcho bot などの画面付き Amazon Echo を持っていないので、Sauce Bossスキルの出番はしばらくなさそうです。) ポイント3 呼び出し名の決定 Alexaにスキルの起動を促す際に「Alexa、○○をして」と声をかけますが、この○○の部分が呼び出し名になります。 呼び出し名には以下のような要件があります。 シンプルに考えて自分が呼びやすい名称を付けてあげるとよいでしょう。 公式にも以下のように記載があります。 呼び出し名の要件 - 呼び出し名は2語以上でなければなりません。また、使用できるのはひらがな、カタカナ、漢字、小文字のアルファベット、スペースのみです。数字などは文字で表現しなければなりません。(例: 「二十一」など） - 呼び出し名には、「起動して」、「開いて」、「聞いて」、「教えて」、「読み込んで」、「開始して」、「有効にして」などの起動フレーズを使用することはできません。「アレクサ」、「アマゾン」、「エコー」、「コンピューター」などのウェイクワードや「スキル」、「アプリ」などの単語は使用できません。 勘の良い方はお気づきかと思いますが、今回のタイトル『Alexa、Stay Homeを助けて』という呼び出し名は要件から外れてしまうのでNGになります。 泣く泣く呼び出し名は『Stay Home』としました。 ポイント4 【対話モデル編】どんな言葉を受け付けるのかは インテント で管理する Alexaがスキルを起動したら、次に言葉の入力を与える必要がありますが、同じ言葉でもバリエーションがあります。 例えば、Alexaが「おはようございます」といってくれたら私たちは「おはよう」「おはようございます」「ハロー」など、バリエーションがあるでしょう。 これらのバリエーションを受け付けるために インテント として言葉を管理します。 インテント によって、Alexaが言葉を認識し、 バックエンドの作りによりますが、 Alexaはきっと素敵な返事を返してくれることでしょう。 この インテント を受けたAlexaは以下のような JSON をバックエンド側へ投げつけます。 "request": { "type": "IntentRequest", "requestId": "amzn1.echo-api.request.44cd0613-9ffe-4613-bd6b-49529a86c4d3", "timestamp": "2020-05-16T11:22:59Z", "locale": "ja-JP", "intent": { "name": "HelloWorldIntent",# 受け付けたインテントをHelloWorldIntentと認識している "confirmationStatus": "NONE" } } ポイント5 【バックエンド編】リク エス トの処理をするハンドラを用意 Alexaが投げてきたリク エス トをバックエンド側がどう処理しているかを抑えていきます。 Alexa自身にホスト + Node.jsを選択しています。 # スキル起動時の処理 const LaunchRequestHandler = { canHandle(handlerInput) { return Alexa.getRequestType(handlerInput.requestEnvelope) === 'LaunchRequest'; }, handle(handlerInput) { const speakOutput = '今日もStayHome頑張りましょう。何かあれば声をかけてください。'; # 返答の内容 return handlerInput.responseBuilder .speak(speakOutput) .reprompt(speakOutput) .getResponse(); } }; # HelloWorldIntentを受けた場合の処理 const HelloWorldIntentHandler = { canHandle(handlerInput) { return Alexa.getRequestType(handlerInput.requestEnvelope) === 'IntentRequest' && Alexa.getIntentName(handlerInput.requestEnvelope) === 'HelloWorldIntent'; # HelloWorldIntentを受けた場合の分岐 }, handle(handlerInput) { const speakOutput = 'おはようございます！'; # 返答の内容 return handlerInput.responseBuilder .speak(speakOutput) .getResponse(); } }; （省略） # ハンドラの登録 exports.handler = Alexa.SkillBuilders.custom() .addRequestHandlers( LaunchRequestHandler, HelloWorldIntentHandler, HelpIntentHandler, CancelAndStopIntentHandler, SessionEndedRequestHandler, IntentReflectorHandler, ) .addErrorHandlers( ErrorHandler, ) .lambda(); LaunchRequestHandler は「Alexa、○○をして」によって起動したスキルのはじめの対話を返してくれます。 このご時世なので「今日もStayHome頑張りましょう。」と励ましてくれるようです。 HelloWorldIntentHandler でHelloWorldIntent（おはよう・おはようございます）を受けた時には「おはようございます！」と元気に返事をしてもらえます。 これで毎朝頑張れるというものです。 ポイント6 【対話モデル編】受け答えにさらにバリエーションを与えるスロット 5つのポイントを抑えることで、対話ができるスキルが出来上がりました。 ただし、実はこのままの HelloWorldIntentHandler は「おやすみ」といっても「おはようございます！」と元気に返事をしてくれます。。。 もう少し賢くしてあげる（対話のバリエーションを増やす）ためにスロットという機能を使っていきます。 朝だけでなく昼や夜に話したいときもあるので、「おはよう」「こんにちは」「おやすみ」の3つのスロットを作成します。 さらに同類語もスロットで登録することができます。 「おはよう」のバリエーションに「おはようございます」と「Good morning」を登録してみました。 スロットを設定した際に登録済みの「おはよう」を発話したときのリク エス トです。 slots属性が増え、身構えてしまいそうですが対話のポイントにになってくるのは バックエンドに言葉を送信する slots.slot_sample.value と、言葉の一致状態を示す slots.slot_sample.resolutions.resolutionsPerAuthority[0].status.code です。 言葉の一致状態を確認することで、 "request": { "type": "IntentRequest", "requestId": "amzn1.echo-api.request.d7f9bd50-aa78-4768-919b-e7f92bdf8783", "timestamp": "2020-05-17T05:21:25Z", "locale": "ja-JP", "intent": { "name": "HelloWorldIntent", "confirmationStatus": "NONE", "slots": { "slot_sample": { "name": "slot_sample", "value": "おはよう", "resolutions": { "resolutionsPerAuthority": [ { "authority": "amzn1.er-authority.echo-sdk.amzn1.ask.skill.6f6d3418-edc7-4567-a7e5-10170a022f41.slot_sample", "status": { "code": "ER_SUCCESS_MATCH" // slot_sampleの語句と一致しているかを返す。不一致の場合はER_SUCCESS_NO_MATCH }, "values": [ { "value": { "name": "おはよう", "id": "896c87c2017e74cf8c7ccf42d339ca66" } } ] } ] }, "confirmationStatus": "NONE", "source": "USER" } } } } スロットを利用することで言葉の一致状態を取得することができるようになりました。 Alexaが賢くなるまでもう一押し、バックエンド側を以下のように改修します。 const HelloWorldIntentHandler = { canHandle(handlerInput) { return Alexa.getRequestType(handlerInput.requestEnvelope) === 'IntentRequest' && Alexa.getIntentName(handlerInput.requestEnvelope) === 'HelloWorldIntent'; }, handle(handlerInput) { // スロットの値を取得 let requestWord = handlerInput.requestEnvelope.request.intent.slots.slot_sample.value; let matchCd = handlerInput.requestEnvelope.request.intent.slots.slot_sample.resolutions.resolutionsPerAuthority[0].status.code; let speakOutput = `すみません。${requestWord}がわかりません。`; if(matchCd !== 'ER_SUCCESS_MATCH'){ // スロットに存在しない場合 return handlerInput.responseBuilder .speak(speakOutput) .getResponse(); } switch (requestWord){ case 'おはよう': speakOutput = 'おはようございます！'; break; case 'こんにちは': speakOutput = 'こんにちは！'; break; case 'おやすみ': speakOutput = 'おやすみなさい'; break; default : // スロットに存在するが処理を用意していないものはとぼける speakOutput = `${requestWord}ってなんでしたっけ？`; } return handlerInput.responseBuilder .speak(speakOutput) .getResponse(); } }; 知っている（＝スロットに登録されている）言葉に対して、知らないものはわからないと返すようにしました。素直なことはよいことです。 少し賢くなったAlexaと対話テストしてみると以下のように返してくれました。 ポイント7 実機でスキルを動かす シミュレーションのみでなく、自宅のAlexaと対話するためには開発者アカウントを Amazon Echo と紐づけしている Amazon のアカウントとしておきます。このようにしておくと、 スマホ のAlexaアプリもしくは https://alexa.amazon.co.jp/spa/index.html で開発中のスキルを有効にし、自宅のアレクサに話しかけるだけです。 （実機で動かすのがここまで簡単と思っていなかったので驚きでした。） 最後に さすがにアプリを起動してただ返事をしてくれるだけではコミュニケーションをしている気にはならないので作りこみが必要です。 微妙に心的な弊害も感じたりもします。特に自分で対話の動きを決めているのでなにやらムズムズします。 普段はエディター上でコードを眺めて開発しているので、ブラウザ上で開発するのは新鮮味があって楽しいですし、シュミレータやそばにある実機ですぐ動かすことができるのはかなり良い感触でした。 簡単なものであれば、ちょっとした息抜きに開発できるのでお勧めできます。 また、公式から紹介されているデザインモデルを軽く眺めてみると「対話」に重きを置いたデザイン（例えば、長文な返答をさせるのはNGなど）を考える必要があるようで目からウロコ気分で新鮮でした。 ただし、スキル開発を通して「対話をすることで何をさせるのか」 これを見つけることが最も難しいと改めて痛感しました。

id:radiocat です。多くの企業がリモートワークに移行して試行錯誤されていることと思います。緊急事態宣言が延長されて、もうしばらくこの状況が続きそうということもあり、今回はリモートワークへの移行によって試行錯誤している私たちのチーム開発の事例をお伝えします。 組織的な取り組みやルール 朝はニコニコカレンダーを更新してチェックイン 終業時はひとこと感想でチェックアウト 連絡事項は履歴を残す リモートワークのノウハウやトラブルを記録する チーム開発の現場 タスクはなるべく小さく分解する Web会議は常時つないでおく 1対1の相談は電話感覚でWeb会議をコールする マインドマップでふりかえり さいごに 組織的な取り組みやルール 私たちの所属する配配メール開発課はメンバー10人で構成されるチームです。まずはその全員に関係する組織的な取り組みやルールを紹介します。 朝はニコニコカレンダーを更新してチェックイン チーム全員の朝会では、事前にニコニコカレンダーを更新し、一言ずつその日の気分や意気込みを共有してチェックインをしています。季節の変わり目で体調を崩すこともありましたし、自宅の作業環境に慣れるまでは肩こりや腰痛になる人もいました。電気工事、水道のトラブルのような自宅のトラブルの共有もありました。家族がいる人から「今日は子供が隣の部屋で遊んでいるので騒がしいかも」というようなご家庭の状況の共有もリモートワークならではです。 ja.wikipedia.org 終業時はひとこと感想でチェックアウト 終業時にもチーム全員の夕会でその日の仕事の感想と仕事で起きた課題の共有を行っています。リモートワークによってちょっとした相談がしづらくなった、チャットの量が増えて情報が追いづらくなった、などの課題は夕会でのちょっとした共有から改善に繋げました（後述）。仕事のやり方を変えたり、新しいルールを作ったり、リモートワークによって日々小さな変化が起きているため、実際にやってみて感じたこと、課題に感じたことなどをタ イムリ ーに共有し合って変化に対応することができています。 朝と夕方の情報共有用 スプレッドシート リモートワークはお互いの状況が把握しにくいですし、生活環境と切り離せない問題が起きることもあります。全体での朝会・夕会は事務連絡が中心だったオフィス勤務時よりも少し時間がかかるようになりましたが、体調や自宅の状況を把握したり、お互いの状況に共感したり励まし合ったりすることで、制約のある中での1日の仕事を協力や工夫で乗り越える力になると感じています。リモートワークで健康面への課題意識が高まり、仕事の前に走ってきた、散歩してきた、ベランダで体操したと、お互いに刺激しあって健康面の取り組みが増えているのも新しい変化です。 連絡事項は履歴を残す リモートワークでチャットの量が増えたことによって、全体への共有事項が取りこぼされて伝わらないケースが発生するようになりました。対面で話をしない分、テキスト情報の価値が高まって取りこぼさないように注意が求められるのは当然ですが、情報過多なのもまた事実です。開発の業務に集中している合間に事務的な連絡事項が流れてきたら見落としや対応漏れが起きても仕方ない面があります。また、朝会や夕会は休暇等で参加できなかったり、通信が不安定できちんとキャッチアップできない場合もあります。連絡事項の伝達で言った言っていないというやりとりが何度も発生するのはもったいないので履歴に残しておくことにしました。 連絡事項の履歴 リモートワークのノウハウやトラブルを記録する リモートワークでのノウハウやトラブルは記録を残すようにしています。みんなが未経験の状況なので、ノウハウにしろトラブルにしろ誰かが経験していれば小さなことでも参考になるかもしれません。インターネットの利用が世界的に増大しているため、解決しようがない通信等の問題も多々ありますが、記録しておくことで別の誰かが昨日も同じ時間に同じ問題が起きたことに気づき、落ち着いて対処できることもあります。 リモートワークのトラブル記録 チーム開発の現場 次に、チーム開発の現場の取り組みをご紹介します。10人のチームは、4人で構成される2つのサブチームと、2人のマネジャー（プロダクトと組織）で構成されています。実際の開発現場はサブチームでの活動が中心です。 タスクはなるべく小さく分解する オフィス勤務の時はホワイトボードのカンバンで仕事を進めていましたが、現在は Trello に移行しました。 オフィス勤務時代のホワイトボードのカンバン チーム全体の朝会の後、サブチームに分かれてWeb会議でTrelloのカンバンを共有しながら朝会を行っています。お互いの状況が直接見えなくなったことにより、1つのタスクが大きかったり、他のメンバーが想像しづらいタスクが進行しているとカンバン上で状況を把握することが今まで以上に難しくなりました。追加タスク、割り込みタスクも漏れなくカンバンに追加し、開発と並行で運用業務も行っているサブチームでは運用タスクも漏れなく登録しています。1つ1つのカードで、お互いのタスクの進行状態を共有することの重要性と難しさを改めて感じています。 Trelloのカンバン Web会議は常時つないでおく サブチーム単位でのWeb会議を1日中オープンして常時つないだ状態にしています。オフィス勤務の時に自然と行っていたメンバー同士のちょっとした相談や、隣同士の世間話からの状況把握、なんとなく困っている雰囲気を察知してサポートするなどのチームワークがリモートワークに移行したことでできなくなり、漠然とした不安を感じるという意見が出ました。オンラインで常時繋がっていることで、オフィス勤務と同じとまではいかないものの、相談しやすい雰囲気やなんとなくお互いの状況を把握することはできるようになりました。 カメラや音声については、自宅の業務環境によっては常時ONにするのが難しいメンバーもいるためルールは決めていません（個人の判断におまかせ）。業務の不安をなるべく解消するという目的に全員が向き合ってオンラインで繋がることが重要だと考えています。 1対1の相談は電話感覚でWeb会議をコールする 常時つないでいる相手はサブチーム内のメンバーなので、サブチームを越えた相手への相談がしにくい問題が残ります。チャットだと内容が伝わりにくかったり、なかなか相手から返事がもらえないなど、ここでもリモートワークならではの課題がありました。チャット文化の浸透によって最近は減っていましたが、以前はこういうケースは直接電話をして聞いていました。なので、チームで決めたルールは以下の通り、ほぼ電話と同じです。 ちょっとした確認事項でも直接コールOK ただし、相手が出れない場合があることを前提とする 相手が出ない場合は、時間を置いて再度コールするか、チャットで折り返しを依頼する 呼び出された側は無理のない範囲で応答する（忙しい場合は出なくても良い） チーム全体で一斉にこれをやるとコール地獄に陥りそうですが、活動の中心となるサブチーム内では常時つながっているうえで、それ以外の必要なときにこの手段を選択するので成り立っていると思います。 マインドマップ でふりかえり ふりかえりなどの議論中心のミーティングでは、色々なオンラインツールを活用する手法が一般に公開されています。しかし、我々のチームでは開発用のPC環境の問題でWeb会議につないだ状態でこれらのオンラインツールを使うことが難しいケースがあります。オフィス勤務の時は、業務中いつでも思いついた時に KPT 方式でTrelloに登録しておき、ふりかえりの時間は ファシリテーター だけがPCを持ち込んで内容を確認しつつ、ホワイトボードに整理していく方式でした。リモートワークでも同じやり方であれば、Web会議につなぐだけで進行できますが、オンラインのホワイトボードツールをオフィスのホワイトボードと同じ要領で使うのが難しかったため マインドマップ ツールに移行しました。 マインドマップ はオフィスのホワイトボードよりも自由度が下がりますが、Web会議でのコミュニケーションにも制限があることから、あまり不便さは感じていません。一定の制限下で思考を整理するうえで マインドマップ のツールとしての制限はむしろ効果的に作用しています。 ホワイトボードがわりの マインドマップ さいごに リモートワークに移行して様々な変化に直面していますが、その中で気づいたことは、チームで働くうえでのコミュニケーション、 言語化 、可視化の難しさなどです。これらは、見えていなかっただけで実際はオフィス勤務の時から 潜在的 な課題だったことも多くあると感じています。そのため、慌てずしっかり向き合って対処していけば、今後オフィス勤務に戻ったときもチームにとって良い効果に繋がるのではないかと思います。 世界中が大きな変化に包まれる中で、これから我々の働き方は大きく変わっていくという話も聞こえてきます。私たちもまだまだ試行錯誤の連続ですが、このような変化の中で私たちと同じように働くみなさんにとって、何かの参考になれば幸いです。 私たちは一緒に働くメンバーを募集しています。興味を持たれましたら以下のサイトからお問い合わせください。 career-recruit.rakus.co.jp

こんにちは、goldminer です。 はじめに 昨年から新しいプロジェクトに携わることになり、そのプロジェクトでは ドメイン 駆動設計（DDD）を取り入れています。 それまで DDD をやったことがなかったので色々と試行錯誤しながら進めていて、特に ドメイン サービスについては自分の中での捉え方の変化が激しかったのでまとめてみました。 これから DDD を始めようという方の一助になれば幸いです。 以下の フレームワーク 、 アーキテクチャ を採用した例を記述しています。 Spring Boot ヘキサゴナル アーキテクチャ ドメイン サービスとは ドメイン サービスについて調べてみると概ね次のように説明されています。 ドメインにおける重要なプロセスの内、エンティティや Value Object の責務とするべきではないものを ドメインサービスとして定義する 最初に作った ドメイン サービス 「ログ インパス ワードはハッシュ化してデータベースに保存する」というセキュリティ要件を対応した際に作成した ドメイン サービスです。 パスワードは Password クラス（エンティティ）が保持しますが、それをハッシュ化する責務までをも Password クラスに負わせるのは適切でないと考えました。 そこでハッシュ化する責務を持った ドメイン サービスを作成することにしました。 ハッシュ化の（ストレッチ回数などの） アルゴリズム は技術的にすぎるということで ドメイン サービスはインターフェースで定義し、実装クラスはインフラスト ラク チャ層に配置することにしました。 public interface HashPasswordService { /** * 平文のパスワードをハッシュ化する. */ String hash(String plainPassword); // インフラストラクチャ層に配置 @Service public class HashPasswordServiceImpl implements HashPasswordService { public String hash(String plainPassword) { // ハッシュ化のアルゴリズムを実装している. } この ドメイン サービスについて今の時点では次のように評価しています。 良: エンティティが負うべきでないハッシュ化の責務を ドメイン サービスとして分離できている 良: 技術的にすぎるハッシュ化の アルゴリズム をインフラスト ラク チャ層に分離できている 悪: @Service はアプリケーションサービス *1 にも使用しており、 @Service の用法が混乱している 総じて悪くないと思っているのですが、最初に作成した ドメイン サービスがそうであったことで「 ドメイン サービスはインターフェースと実装クラスを分離したもの」という間違った思い込みをしてしまったように思います。 その後 ドメイン サービスを全く作成しない 上述したように「 ドメイン サービスはインターフェースと実装クラスを分離したもの」という間違った思い込みをしてしまったため、技術的な要素がほとんどない ドメイン では ドメイン サービスの出番がありません。 そして本来は ドメイン サービスとして作成すべきクラスを別のモデルで作成するという迷走を始めてしまいました... 「消費税を計算する」という例で書いています（実際は別の計算だったのですが、それを説明するのはとても大変なので日本人になじみのある消費税計算に置き換えています）。 public interface CalculateTaxPolicy { /** * 税込価格を計算する. * @param priceExcludingTax 税抜価格 */ BigDecimal priceIncludingTax(BigDecimal priceExcludingTax); /** * 標準税率（10%）で計算する CalculateTaxPolicy の実装クラス. */ public class CalculateStandardTaxPolicy implements CalculateTaxPolicy { @Override public BigDecimal priceIncludingTax(BigDecimal priceExcludingTax) { BigDecimal taxRate = BigDecimal.valueOf( 10 ); // 標準税率（10%） BigDecimal coefficient = BigDecimal.valueOf( 100 ).add(taxRate) .scaleByPowerOfTen(- 2 ); BigDecimal priceIncludingTax = priceExcludingTax.multiply(coefficient); priceIncludingTax = priceIncludingTax.setScale( 0 , RoundingMode.HALF_UP); // 四捨五入する return priceIncludingTax; } /** * 軽減税率（8%）で計算する CalculateTaxPolicy の実装クラス. */ public class CalculateReducedTaxPolicy implements CalculateTaxPolicy { @Override public BigDecimal priceIncludingTax(BigDecimal priceExcludingTax) { BigDecimal taxRate = BigDecimal.valueOf( 8 ); // 軽減税率（8%） // 以降は標準税率の場合と同じなので省略 } この設計についての評価は以下です。 良: エンティティ（おそらく税抜価格は「商品」のようなクラスが持っている）が負うべきでない税込価格の計算の責務を分離できている 悪: 「税込価格の計算」というプロセスを記述しているにもかかわらず ドメイン サービスではなくポリシーとして作成している 8%と10%という 複数税率 からポリシーを使うことを発想したところまではよかったのですが、プロセスまでをもポリシーに記述してしまって ドメイン サービスを使うという発想には至りませんでした。 もっと ドメイン サービスを活用しようと考える ドメイン サービスを作成する機会がまったくなく「これでよいのか？」と疑問に思ったことがきっかけです。 現時点での ドメイン サービスの捉え方は冒頭にも書いたとおり「エンティティが負うべきでない ドメイン におけるプロセスを記述したもの」です。 「消費税を計算する」の設計も今では次のような設計を考えています（実際に リファクタリング 予定です）。 public interface TaxPolicy { /** * 税率を返す. */ int rate(); /** * 標準税率（10%）を返す TaxPolicy の実装クラス. */ public class StandardTaxPolicy implements TaxPolicy { @Override public int rate() { return 10 ; } /** * 軽減税率（8%）を返す TaxPolicy の実装クラス. */ public class ReducedTaxPolicy implements TaxPolicy { @Override public int rate() { return 8 ; } public class CalculateTaxService { /** * 税込価格を計算する. */ public BigDecimal priceIncludingTax(BigDecimal priceExcludingTax, TaxPolicy policy) { BigDecimal taxRate = BigDecimal.valueOf(policy.rate()); BigDecimal coefficient = BigDecimal.valueOf( 100 ).add(taxRate) .scaleByPowerOfTen(- 2 ); BigDecimal priceIncludingTax = priceExcludingTax.multiply(coefficient); priceIncludingTax = priceIncludingTax.setScale( 0 , RoundingMode.HALF_UP); // 四捨五入する return priceIncludingTax; } ちゃんと ドメイン サービスを活用できています。 今後もこんな感じで ドメイン サービスを組み込んで設計を考えていきたいです。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 rakus.hubspotpagebuilder.com ラク スDevelopers登録フォーム https://career-recruit.rakus.co.jp/career_engineer/form_rakusdev/ イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ ◆TECH PLAY techplay.jp ◆connpass rakus.connpass.com *1 : ヘキサゴナル アーキテクチャ の用語

はじめに 名前に情報を詰め込む 明確な単語を選ぶ 汎用的な名前を避ける（あるいは使う状況を選ぶ） 抽象的な名前よりも具体的な名前を使う 接尾辞や接頭辞を使って情報を追加する 名前の長さを決める 名前のフォーマットで情報を伝える 制御フローを読みやすくする おわりに 参考 はじめに こんにちは。新卒2年目のnr_1228です。 ボリュームの大きい実装に携わるようになって、重要だと再認識したことがあります。 コードを書くときは、他の人(未来の自分も含む)でも理解しやすいように書くべき。 自分が書いたコードや既存のコードを読む際に、この変数は何が入ってるのだろう？となったことが何回かありました。 これはあの本を読み返すべきでは… ということで、研修時に読んだ「リーダブルコード」を再び読むことにしました。 前回読んだ時よりも実体験などもあり、理解・納得できる部分が増えていました。 そこで今回は、改めて「リーダブルコード」を読んで、最近引っかかることの多かった 命名 のポイント と ロジックの単 純化 についてまとめてみることにします。 名前に情報を詰め込む コードを書いていると名前を付けなければならない時が必ずあります。 関数や変数名を見た時点で、これは何をしている関数なのか、何の変数なのかが パッとわかるようにした方が、他の人にも親切です。 名前の付け方のポイントは以下の6点です。 明確な単語を選ぶ その関数・変数が何を表しているのか明確にすることが、分かりやすい名前を付ける必須事項です。 自分の中ですぐに出てくる単語を使うのもいいですが、状況に合わせて単語を選ぶようにしましょう。 単語 代替案 send deliver, dispatch, announse, distribute, route find search, extract, locate, recover start launch, create, begin, open make create, set up, build, generate, compose, add, new 汎用的な名前を避ける（あるいは使う状況を選ぶ） 戻り値にいい名前が思いつかなければ、 retval などと付けたくなりますが、 「戻り値である」という以外の情報はありません。 戻り値として何を返しているのかが分かるような名前にしなければなりません。 例えば、xの2乗の合計を戻り値とするならば、 sum_squares というような名前を付けた方が retval よりも変数の目的を伝えることができます。 抽象的な名前よりも具体的な名前を使う ServerCanStart という名前の、任意のポートをサーバがリッスンできるか確認するメソッドがあるとします。 その時、この名前は具体的で分かりやすいと言えるでしょうか？ もっと具体的な名前にすると、 CanListenOnPort とした方が、メソッドの動作をそのまま表すことができ、 他者にも分かりやすく伝わります。 接尾辞や接頭辞を使って情報を追加する 時間はバイト数のように計測できるものであれば、変数名に単位を入れるのも良いです。 例えば、秒を返すのかミリ秒を返すのかが分かりにくい場合は、変数に _ms を追加すれば明確になります。 名前の長さを決める 良い名前を選ぶときには、長い名前を避けて簡潔なものをと思いがちです。 長い名前を避けると1つの単語だけの名前になってしまいます。 変数の使い方によって違ってきますが、以下を参考にするとよいでしょう。 スコープが小さければ短い名前でもいい 長い名前を入力するのは問題ではない 頭文字と省略形 BackEndManager を BEManager にすると他の人全員に伝わるでしょうか？理解できるなら問題はありませんが、全員に伝わるか分からないような省略の仕方はやめた方がいいです。 しかし、evaluationをeval、documentをdoc、stringをstrのように省略するのは理解ができるので問題ありません。 不要な単語を投げ捨てる 名前に含まれる単語を削除しても情報が全く損なわれないこともあります。 例えば、 ConvertToString を ToString にしたり、 DoServeLoop を ServeLoop に変えても明確さは変わりません。 名前のフォーマットで情報を伝える アンダースコア・ ダッシュ ・大文字を使って、名前に情報を詰め込むこともできます。 クラス名はキャメルケース、変数名はアンダースコアで単語を区切るなどの決まりを作っておけば、 文字列を見た時点で何を表しているのかが明確になります。 制御フローを読みやすくする コードの制御フローを読みやすくするためにできることはいくつかあります。 比較を書くときには、変化する値を左に、より安定した値を右に配置する if/else文のブロックは適切に並び替える 　一般的には、肯定系、単純・目立つものを先に処理する。 深いネストを避ける 　複雑な処理を書いていると知らない間にネストが深くなってしまうことがあります。 　ネストが深くなってしまった場合は、別の処理でどうにかできないかなど、 　一歩下がって全体を見るようにするのがいいかもしれません。 おわりに 初めてこの本を読んだ時は、まぁできるでしょうと特に引っかかることもなく読んでいました。 しかしコードを読み書きする機会が増えて読み直したら、こうやるのがいいのかと思うところが出てきてなるほどと思える部分が結構見つかるのです。 自分だけしか見ないコードならまだしも、他の人も見るコードは見やすさや分かりやすさを重視し、 少し分かりづらいロジックになってしまったのなら、せめて変数やコメントなどで分かりやすく伝わるようにしていくことが 大切です。 迷ったときにこの本を読み直してみると、自分のコードのどこに改善点があるのか見つかると思います。 定期的に読んで自分のコードを確かめてみるのもいいかもしれません。 自分もまだまだなので、改善していこうと思います。 参考 リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (Theory in practice) 作者: Dustin Boswell , Trevor Foucher オライリージャパン Amazon