はじめに こんにちは。 ラク スのstrongWhiteです。 今回は Google Chrome (以下、 Chrome ) の旧バージョンをインストールする手順について書きます。 ここ最近、会社で Selenium を動かす機会があり、そのときに Chrome の旧バージョンが必要になったので、インストールする手順をいろいろ調べていました。 これから調べたインストール手順を書いていきますが、私自身、実際に手順を試していません。 なぜ試さなかったかというと、これから書く手順は レジストリ に手を加える必要があり、PCに重大な不具合を引き起こす可能性があるからです。上記を承知した上で試したい方は以下を読み進めてください。 旧バージョンは公式にはない まず前提として、 Chrome の旧バージョンは公式では提供されていません。 Chrome は、セキュリティアップデートなどで最新のバージョンが利用可能になったときに自動更新できる仕組みになっており、常に最新のバージョンを保てるようになっているからです。旧バージョンを利用すること自体、想定されていないということですね。 そのため、旧バージョンをインストールするには有志が公開している非公式なサイトから インストーラ を入手する必要があります。 ただインストールするだけじゃダメ 前述の通り Chrome は自動更新する仕組みになっているので、ただインストールするだけではダメです。自動更新を停止させる設定を行わなければいけません。 自動更新の停止設定は Chrome 側からは行えず、ターミナルなどで外部から設定しないとけません。 Windows だと レジストリ を変更する必要があり、 Mac だとdefaultsコマンドを実行しなくてはいけません。 レジストリ は不用意に変更するとPCに重大な不具合が起こる可能性があります。ひとつひとつの操作が理解できた上で慎重に行うことを強く強くオススメします。 自動更新を復活させる方法 自動更新は停止させたあとでも以下の方法で復活させることができます。 Windows の場合は レジストリ エディタから HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Google\Update に、DWORD値で DisableAutoUpdateChecksCheckboxValue という値を作成し、0に設定すればOK。 Mac の場合は defaults write com.google.Keystone.Agent checkInterval 1 を実行すればOKです。 これらは Google Update 関連のタスクを有効にする設定です。 インストールの手順 これまでのセクションを読んで察することができるかもしれませんが、 Chrome の旧バージョンをインストールする手順は公式がサポートしている手順ではないのでご自身の責任でお試しください。 以下、調べた手順。 ■ Windows 手順 すでに Chrome がインストールされている場合はアンインストールする 旧バージョンの インストーラ を取得する ネットワーク接続を切断する インストールする レジストリ エディタから HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Google\Update に、DWORD値で DisableAutoUpdateChecksCheckboxValue という値を作成し、1に設定する ネットワーク接続を有効にする ■ Mac 手順 1～4までは上と同じ ターミナルを起動し、 defaults write com.google.Keystone.Agent checkInterval 0 と実行する ネットワーク接続を有効にする ※手順を補足すると、インストール前にネットワーク接続を切断しているのは、インストール後に Chrome が自動更新しないようにするためです。その他、 Windows 手順の5と Mac 手順の2では、 Google Update 関連のタスクを無効にする設定を行っています。 おわりに 今回は Chrome の旧バージョンをインストールする手順を書きました。 冒頭でなぜ実際に手順を試していないと書いたのか、ここまで読んでいただいた方は意味がわかったかと思いますが、公式でサポートされている手順ではなく、かつPCが壊れる危険性を孕んでいますので、何度も言いますが試す際は自己責任でお願いします(汗) 参考 https://news.mynavi.jp/article/20100602-chrome-no-update/ http://yanor.net/wiki/?Windows-%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%2FChrome%2F%E5%8F%A4%E3%81%84%E3%83%90%E3%83%BC%E3%82%B8%E3%83%A7%E3%83%B3%E3%82%92%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%EF%BC%88%E8%87%AA%E5%8B%95%E3%82%A2%E3%83%83%E3%83%97%E3%83%87%E3%83%BC%E3%83%88%E5%81%9C%E6%AD%A2%EF%BC%89 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 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:radiocat です。大阪本店で社内勉強会の運営をしています。 今回は「IT勉強会/コミュニティ運営 Advent Calendar 2017」の21日目の記事として投稿します。 qiita.com 社内の勉強会イベント 大阪では大きく2つの勉強会イベントが開催されています。 ビアバッシュ 大阪の開発部で毎月実施している勉強会です。参加自由ですが会社予算で飲み物と軽食を出してもらっています。私は主にこの運営に関わっています。先日はクリスマス版で実施しました。 もくもく勉強会 有志の呼びかけで毎週木曜日に実施する勉強会です。月末の木曜日はLT形式で発表会をします。特に予算や制約はなく、やりたいメンバーが集まってゆるくやっています。こちらは運営メンバーが以前このブログに投稿していますので詳細はそちらをご覧ください。 tech-blog.rakus.co.jp これらの運営に関わって実際にやってみた事についてまとめてみました。なお、やってみて思ったほどうまくいかなかった事も知見を得たという点では価値があると思うので惜しみなくご紹介します。 コンテンツ編 テーマを決める 自己紹介LT 開発外の部署の人にもプレゼンしてもらう ハッカソンしてみる 質問タイムを削る 会場セッティング編 会場を社外にしてみる サテライト会場で同時中継する 食べ物や飲み物を工夫してみる ツール編 スマホ三脚 Chromecast 掲示板と立て看板 スライド共有 おまけ クリスマスを楽しむ コンテンツ編 テーマを決める ビアバッシュでは毎月テーマを決めて発表者を募集しています。同じ開発部のメンバー同士とはいえチームによって文化が違ったり、使っている技術が違っていたりするため、ある程度テーマを絞ったほうが発表者が発表しやすく参加者も参加しやすいだろうと考えて運営側でテーマを決めています。ただし、あくまで参加しやすい場を作る事が目的なので、多少テーマから外れた発表であっても指摘することはありません。 過去に実施したテーマをいくつかご紹介します。 テーマ 概要 各サービスのお仕事発表会 各サービスで取り組んでいる課題やチャレンジしていることを共有してもらいました。 各サービスのトラブル特集 その名の通りトラブル事例の共有ですが、ビアバッシュでやってみると業務報告とは違った本音や苦労話が聞けました。 読書特集 技術書の紹介や効率よく読むための工夫などの読書術について共有してもらいました。 QAセッション大会 他のサービスの担当者に聴いてみたいことを事前に募集して回答してもらいました。 爆LT大会 時間の許す限りみんなでLTをやります。 自己紹介LT オフショア先の ベトナム 子会社からの出張者や中途入社、新卒の配属などで新しいメンバーが参加する場合、LT形式の自己紹介をしてもらっています。本当にただプレゼン資料を使って自己紹介するだけです。入社していきなりLTするのは敷居が高いですが、自己紹介ならば敷居は高くないと考えてお願いしています。新メンバー全員に必ずお願いする事も重要であったりします。結果的に新しいメンバーの事を知る良い機会になっています。次回以降で発表してもらう時の 心理的 敷居が下がることも密かに期待しています。 開発外の部署の人にもプレゼンしてもらう たまには開発部外の発表も聴いてみたいと考えて募集したところ、営業、人事、総務、 経理 、情シス、インフラチームといった他部門の方々からたくさん応募いただくビックイベントになりました。二部構成にして第二部は開発部のLTも行ったところ、開発部外の人も開発部の発表が聞けて新鮮だったとコメントをもらえました。ただ、ここまで大々的にやるといつもの会場に人数が収まりきらないなど、運営側はそれなりに大変です。 ハッカソン してみる ビアバッシュの特別回として ハッカソン もやってみました。ビアバッシュ2回分の枠を使い、1回目にア イデア ソンとチーム分けを行い、次の回までに ハッカソン して発表してもらいました。私も参加して同僚とチームを組んでIoT的な鳩時計を会議室で鳴らす仕組みを作ってみたりしました。 qiita.com 普段の仕事とは違った開発にチャレンジできて刺激的なイベントですが、参加者も運営側もビアバッシュよりは時間を使うことになるのでそれなりの覚悟で臨む必要はあります。ただ、この取り組みが評価されて社内で表彰していただきました。 質問タイムを削る これは結果的に バッドノウハウ でした。色々ア イデア を考えて実行すると思った以上に発表者が集まったり内容が濃くなりすぎて全体の時間が長くなりすぎることがあります。そこで質問時間を削るという苦渋の決断をしました。結果的に時間は短縮できましたが、後ほどアンケートを取ったところ反応はあまり良くなかったです。質問タイムを設けても質問が出ない事はありますが、質問タイムが無いとその場の雰囲気としてはやはり物足りないのだと思います。質問タイムは無くすのではなく時間を区切るなどで場をうまくコン トロール するほうが効果的です。 会場セッティング編 会場を社外にしてみる 開発部では四半期に一度、部全体で懇親会を実施しています。その機会を利用させてもらい、懇親会の会場でビアバッシュを行いました。今年の7月にはカフェラボという グランフロント大阪 内の施設を借りて実施しました。 kc-i.jp また、昨年は結婚式の二次会などで使う水槽のあるオシャレなお店を借りて、前出の ハッカソン イベントの発表会を実施しました。 自社のカフェスペースよりも巨大なスクリーンでマイクも使ったりなど、ちょっとしたビックイベント感が演出できました。 課題としては準備の過程でネット環境が無かったりプロジェクタがDVIしか対応していないなどが分かって事前の調整が普段以上に大変でした。部の懇親会の場を使わせてもらうので、懇親したい人もいる事を考えると懇親会の全ての時間をプレゼン発表に割り当てるのも目的が変わってしまうため、タイムスケジュールの調整も難しいところはあります。 サテライト会場で同時中継する 前出の開発部外からも参加者を招いてビアバッシュを実施したところ、人数が集まり過ぎてしまい会場に入り切らないという問題が発生しました。その対策として社内の会議室をサテライト会場にして Google ハングアウトを使って同時放映する方式を試してみました。しかし、映像が途切れたり中継の声が聞き取れなくて隣の本会場から笑い声だけが直接聞こえてくるなど、残念ながらこの試みは不評でした。 ただ、 ベトナム 出張中のメンバーからの要望で同じ仕組みを使って ベトナム オフィスと中継した時は大きな問題はなく、最低限の内容は ベトナム に伝わって楽しめているようでした。明らかに現場で見ることができないと分かったうえでの中継であれば、参加者もその前提で見るため多少の映像や音声の途切れなどは気にならないのかもしれません。 食べ物や飲み物を工夫してみる ビアバッシュの定番といえばビールとピザですが、毎回ピザも飽きるんじゃないかという仮説のもと、色々な食べ物にチャレンジしてみました。勉強会なのに食べ物にうるさいあたり、大阪っぽさが滲み出ていますがお察しください。 注意点といては予算が限られているのと、配達してもらえるか会社の近くで受け取りができる必要があり、選択肢は限られます。 実際に手配してみた食べ物を一部紹介します。 マクド ナルド ひとりあたり100円台のバーガー各種3つとチキンを手配しましたが若手はともかく中堅以上にはややキツかったようです。あと、一定金額以上になると配達の注文手続きがかなりやっかいなのが運営泣かせです。 たこ焼き 会社の近くで受け取りできるお店がソース無しタイプの 会津 屋のたこ焼きだったので、ピザを離れるにしても一足飛びにチャレンジしすぎた感はありました。 お弁当 事前に人数を確定させて人数分のお弁当を手配しました。ハンバーグ弁当、焼肉弁当などの注文も1人ずつ受付ました。ドタキャンや飛び入り参加に対応できない難しさはあります。 スパークリングワイン 12月の回ではビールの代わりにスパークリングワインを出してクリスマスを演出してみました。過去に社内で営業目標の達成イベントが行われた時に使った シャンパ ングラスを発掘してきて活用しました。 以上のように食べ物・飲み物も色々チャレンジしてみましたが、アンケートを取ってみたところ何だかんだピザの評判が良くて結局のところピザで充分という結論になっています。 ツール編 スマホ 三脚 前出の Google ハングアウトを使った同時中継で使用しました。この三脚に スマホ を固定して Google ハングアウトアプリを使うだけなので、撮影の手間がかからず高価な テレビ会議 システムなどを使わずに海外にも同時中継ができる点は運営の強い味方です。 Chromecast Chromecastを購入してプロジェクタの HDMI 端子につないでPC側はコードレスでプレゼンできるようにしました。 Chrome がインストールされたPCなら画面をそのままキャストできるのはもちろん、 Android 端末であれば手持ちの スマホ だけでプレゼンができて便利です。注意点は弊社のネット環境は社内向け環境と自由に外部接続出来る環境が分離されており、Chromecastは後者の環境に接続するため社内環境のデモなどにChromecastを使うことができません。お金をかければもっと高度な実現方法はあると思いますが、手軽に利便性を上げる事が出来る点ではこれも運営の強い味方です。 掲示 板と立て看板 ビアバッシュは開発部内のイベントとして実施するため事前に出欠をとりますが、もくもく勉強会・発表会はその日参加できる人だけでゆるく実施しているので事前に出欠はとっていません。自由でゆるくやれるメリットはありますが、参加したいと思っていてもイベント自体を忘れていて参加できなかったという事が起こります。そのためカフェスペースの 掲示 板に予定を貼り出したり、開催当日に立て看板を設置して周知するようにしました。アナログな手法ですが、以前よりもイベントの存在に気づいて社内で声をかけてもらったりするケースが増えており、意外と効果が出ているように感じています。 スライド共有 プレゼンで使った資料は共有フォルダに置いて参加できなかった人にも共有していますが、ファイルを置いてパスを共有してもなかなか見ないのが人情です。 SlideShare などのパブリックなサービスを使えばスライド共有できますが、内輪だけで楽しみたいケースもあるため全部をパブリックにしてしまうと逆に発表者のネタを縛ってしまう可能性があります。このハードルが意外と大きいのではないかという仮説のもと、社内にスライド共有の仕組みを導入しました。 現在はまだ試験運用中ですが、Knowledgeという OSS の情報共有ツールを使ってみています。 information-knowledge.support-project.org おまけ クリスマスを楽しむ 昨年の12月のもくもく発表会ではクリスマス版としてLT後に参加者同士でプレゼント交換をしました。今年もちょうどこの記事を投稿している当日に実施する予定です。ちなみに去年はプレゼント交換しようとした時に「自分の持ってきたプレゼントが自分に回ってこないように、全員にランダムにプレゼントを割り当てるプログラムってどう書くの？」という話題になりLTで使ったプロジェクタがそのまま使われて即席でモブプロが始まるというハプニングもありました。 アドベントカレンダー といえば今やクリスマスまでの期間を楽しむエンジニアのイベントの1つですが、プレゼント交換は弊社大阪のエンジニアにとってのもう1つのクリスマスイベントとして定着していきそうです。 おわりに 大阪開発部では楽しみながらエンジニアのスキルやノウハウをあげていけるように、運営メンバー同士で様々なア イデア を出し合って取り組んでいます。まだまだ色々なア イデア を試してみたいと思っていますが、社外の方との共同開催やゲスト参加なども大歓迎ですので、このブログを見て一緒に勉強会をやってみたいと感じた方がいらっしゃいましたら、是非 id:radiocat までご連絡ください。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

はじめに エンジニアのnorthmkyです。 ラク スに新卒で入社し、今年で2年目になります。 業務ではシステムの運用保守チームに所属しているので断然サーバ周りの作業が多いということで今回はその中でも yum コマンドについてまとめてみました。 おそらくこれを読めば yum と rpm との違いって？とりあえず yum 使ってるけど... yum install [package] って打つだけでなんでDL＆Installできるの？ という疑問は少し解消されるかと思います。 まだまだ浅い知識なので間違っているところがあれば指摘いただけると嬉しいです。 はじめに yumとは リポジトリとは yum/rpm/リポジトリの関係性 yum installを見てみる 1. ミラーサイトの中で一番地理的に近いミラーサーバを各レポジトリごとに探す CentOS-Base.repo 2. 必要なパッケージ情報を取得する おわりに yum とは まずものすごく大雑把にいいますと yum は下記になります。 パッケージ管理システム rpm というパッケージ管理システムをラッパーしている yum = rpm + 「 リポジトリ 」による自動更新機能 + 依存関係の管理(検出だけじゃない) yum は RedHat 系 ディストリビューション のパッケージ管理システムです。 パッケージというのは「ソフトウェアを構成するファイルらをまとめたもの」で、設定ファイルやドキュメント、プログラム本体、プログラム本体が動くためのライブラリなどがそれにあたります。 1 Linux では「パッケージ読み解き、ソフトウェアを正しく動作させるようにする」「パッケージの情報を管理する」ことでソフトウェアを使える/管理する仕組みを採用していて、今回取り上げる yum は Linuxディストリビューション のなかで RedHat 系のパッケージ管理システムとなります。 この yum ですが実際裏側では rpm というパッケージ管理システムを使っています。 「 rpm ではできなかった点を yum ができるようにしている」という立ち位置になっています。 この出来なかった点が冒頭に述べた 「 リポジトリ 」による自動更新機能 依存関係の管理(検出だけじゃない) です。 リポジトリ とは 意味のあるまとまりでパッケージを複数格納している場所のことです。 この場所には下記が格納されています。 複数のパッケージ( ./*.rpm ) その リポジトリ のメタ情報ら( ./repodata ) パッケージが複数存在してもその場所は リポジトリ とは言えません。メタ情報があって リポジトリ となります。 2 yum ではこの リポジトリ の情報を元にパッケージを検索したり、installを行います。 yum / rpm / リポジトリ の関係性 yum と rpm と リポジトリ の配置場所との関係性は下記のようになっています。 yum は /etc/yum.repos.d/*.repo に記載されている リポジトリ 場所にあるパッケージら に対して rpm 経由でDLしたり、インストールしたり、必要であればインストール時に依存関係のあるパッケージを検出して一緒にインストールしたりします。 逆をいえば、 /etc/yum.repos.d/*.repo 以外のレポジトリは情報がないので yum は取得することができませんので注意してください。 では、実際によく打つコマンドを例にしてどのようになっているか見てみます。 yum install を見てみる 「このコマンド(ソフトウェア)、インストールしてないからインストールしよう」というのはよくあると思うので 今回は yum isntall [package] を通してどんなことが行われているかを見ていきたいと思います。 大枠の流れは上記のようになっています。 今回は php をインストールしてみたいと思います。 (OS:CentOS6) [root@localhost ~]# yum install php こちらを実行すると、下記のようによく見る インストールしますか？ という対話モードになります。 この中身を見ていきましょう。 [root@localhost ~]# yum install php 読み込んだプラグイン:fastestmirror, security インストール処理の設定をしています Loading mirror speeds from cached hostfile /* 1.ミラーサイトの中で一番地理的に近いミラーサーバを各レポジトリごとに探す */ * base: ftp.jaist.ac.jp * epel: ftp.jaist.ac.jp * extras: ftp.jaist.ac.jp * remi-safe: mirrors.mediatemple.net * updates: ftp.jaist.ac.jp 依存性の解決をしています --> トランザクションの確認を実行しています。 ---> Package php.x86_64 0:5.3.3-49.el6 will be インストール --> 依存性の処理をしています: php-common(x86-64) = 5.3.3-49.el6 のパッケージ: php-5.3.3-49.el6.x86_64 --> 依存性の処理をしています: php-cli(x86-64) = 5.3.3-49.el6 のパッケージ: php-5.3.3-49.el6.x86_64 --> トランザクションの確認を実行しています。 ---> Package php-cli.x86_64 0:5.3.3-49.el6 will be インストール ---> Package php-common.x86_64 0:5.3.3-49.el6 will be インストール --> 依存性解決を終了しました。 依存性を解決しました /* 2.必要なパッケージ情報を取得する */ ============================================================================================================================= パッケージ アーキテクチャ バージョン リポジトリー 容量 ============================================================================================================================= インストールしています: php x86_64 5.3.3-49.el6 base 1.1 M 依存性関連でのインストールをします。: php-cli x86_64 5.3.3-49.el6 base 2.2 M php-common x86_64 5.3.3-49.el6 base 530 k トランザクションの要約 ============================================================================================================================= インストール 3 パッケージ 総ダウンロード容量: 3.8 M インストール済み容量: 13 M これでいいですか? [y/N] 1. ミラーサイト の中で一番地理的に近いミラーサーバを各レポジトリごとに探す 結果として リポジトリ の場所(URL)のほとんどが .jp ドメイン つきなため、一番地理的に近い ミラーサイト をレスポンスを計測して選んだというのがわかります。 これは yum が、前述した /etc/yum.repos.d/*.repo の リポジトリ の情報からインストールする リポジトリ の場所を決定しています。では php のパッケージが存在する 「base」という リポジトリ の情報が記載されている CentOS-Base.repo を見てみます。 CentOS-Base.repo 1 # CentOS-Base.repo 2 # 3 # The mirror system uses the connecting IP address of the client and the 4 # update status of each mirror to pick mirrors that are updated to and 5 # geographically close to the client. You should use this for CentOS updates 6 # unless you are manually picking other mirrors. 7 # 8 # If the mirrorlist= does not work for you, as a fall back you can try the 9 # remarked out baseurl= line instead. 10 # 11 # 12 13 [base] /* 1.リポジトリ名 */ 14 name=CentOS-$releasever - Base 15 mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=os&infra=$infra /* 2.ミラーサイトリスト */ 16 #baseurl=http://mirror.centos.org/centos/$releasever/os/$basearch/ 17 gpgcheck=1 18 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-6 19 20 #released updates 21 [updates] 22 name=CentOS-$releasever - Updates 23 mirrorlist=http://mirrorlist.centos.org/? ... ... *.repo の中には基本的には リポジトリ 情報が複数記載されています。 mirrorlist に設定されているURLを実際に叩くと、 [root@localhost ~]# curl 'http://mirrorlist.centos.org/?release=6&arch=x86_64&repo=os&infra=' http://ftp.yz.yamagata-u.ac.jp/pub/linux/centos/6.9/os/x86_64/ http://ftp.iij.ad.jp/pub/linux/centos/6.9/os/x86_64/ http://mirror.fairway.ne.jp/centos/6.9/os/x86_64/ http://ftp.tsukuba.wide.ad.jp/Linux/centos/6.9/os/x86_64/ http://ftp.riken.jp/Linux/centos/6.9/os/x86_64/ http://ftp.nara.wide.ad.jp/pub/Linux/centos/6.9/os/x86_64/ http://ftp.jaist.ac.jp/pub/Linux/CentOS/6.9/os/x86_64/ http://www.ftp.ne.jp/Linux/packages/CentOS/6.9/os/x86_64/ http://mirror.0x.sg/centos/6.9/os/x86_64/ http://mirror.nus.edu.sg/centos/6.9/os/x86_64/ [root@localhost ~] ミラーサイト のリストが返ってきます。 このリストから yum は一番近い場所を選定して、 リポジトリ 内のパッケージを取得する、ということをしているようです。 今回は ftp.jaist.ac.jp でした。 2. 必要なパッケージ情報を取得する php パッケージを対象にしただけですが、実際には依存してる他パッケージもインストールの準備をしています。 パッケージが依存しているソフトウェアは、 パッケージ(. rpm )のSPECファイルというパッケージのメタ情報（ソースバージョンなど）を記載したファイルに記載してあります 。 3 この情報を RPM データベース( /var/lib/rpm ) 4 と呼ばれるパッケージの情報を保存しておくDBに登録し、install前に検索をかけ、依存関係の有無を見ています。 このような処理が走ったあとでDL&installが行われます。 おわりに yum についてまとめてみました。 yumとは に記載した パッケージ管理システム rpm というパッケージ管理システムをラッパーしている が伝えることができていれば幸いです。 ネットでは チートシート や「 rpm より yum をまずは使うべし」などのハウツーの記事は多いのですが、 改めてどういった仕組み、処理でインストールが行われているかの記事はあまり見なかったので試行錯誤しながら執筆しました。 少しでも知識の助けになれば幸いです。(そして私自身の正しい知識の定着のためにもご指摘頂けると非常に助かります...!!) エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 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 http://itpro.nikkeibp.co.jp/article/Keyword/20110427/359976/?rt=nocnt ↩ http://kazmax.zpp.jp/linux_beginner/yum_createrepo.html#an3 ↩ https://mag.osdn.jp/14/01/10/090000/2 ↩ http://www.itmedia.co.jp/enterprise/0309/05/epn05_5.html ↩

こんにちは、 west-c です。 スマートスピーカー 、国内でも各社から販売され盛り上がっていますね。 私も弊社開発チーム内での GoogleHome モニター選考に当選し *1 、自宅で使い方を模索中です。 GoogleHome（厳密には GoogleHome 内蔵の Googleアシスタント ）は、ユーザが自由にアプリを開発したり公開したりすることができます。 簡単な対話アプリであればノンプログラミングで作成することも可能です。 今回は、自分で作成した スクリプト と組み合わせたアプリの作成手順を説明したいと思います。 作成するアプリの説明 Action on Googleでプロジェクトを作成する Dialogflowでエージェントを作成する Entitiesを作成する Intentsを作成する Fulfillmentを実装する 動作確認をする おわりに お知らせ 参考 作成するアプリの説明 今回は「 指定した路線の遅延有無を教えてくれるアプリ 」を題材に説明します。以下のような会話が行えることを目標としましょう。 ユーザ：「OK Google, XX線の遅延情報を教えて」 GoogleHome： （遅延が発生している場合）「XX線で遅延発生中です。」 （遅延が発生していない場合）「現在XX線では遅延は発生していません。」 このアプリの流れを図にすると以下のようになります。 図内に登場する単語を簡単に説明します。 Action on Google ： Google アシスタント対応の アプリ開発 を行えるプラットフォームです。Action on Google で作成するアプリの単位を プロジェクト と呼びます。 Dialogflow： 自然言語 対話のプラットフォームです。Dialogflowを使うことで、 GUI で簡単に会話形アプリを作成することができます。Dialogflowで作成するアプリの単位を エージェント と呼びます。 遅延情報取得プログラム：今回作成する スクリプト です。遅延情報の取得処理はこの スクリプト で行います。Dialogflow 上で Fulfillment として設定することで Dialogflow と連携することができます。 以下から詳細な手順を説明します。 Action on Google でプロジェクトを作成する GoogleHomeと連携している Google アカウントで Action on Googleのコンソール にアクセスし、 Add/import project から新しいプロジェクト TrainDelayInfo を作成しましょう。 作成したプロジェクトをクリックし、 ADD ACTIONS から Dialogflow の BUILD を選択します。 CREATE ACTIONS ON DIALOGFLOW をクリックすると、Dialogflowのコンソールに遷移します。 Dialogflowでエージェントを作成する ここからDialogflow上での設定になります。 コンソールには以下のような画面が表示されるので、 CREATE をクリックします。 今回 Dialogflow で設定することは大きく以下の3点です。 順番に設定していきましょう。 Entitiesの作成 Intentsの作成 Fulfillmentの実装 Entitiesを作成する Entities では、ユーザからの入力として受け付ける単語を定義します。例えば、Dialogflowで提供しているEntityに @sys.color がありますが、これは色名の単語（赤色・青色・黄色など）が定義されています。 「赤」という入力を「赤色」と判断するなど、単語の揺れを補正することも可能です。 今回は電車の路線名を入力として受け取る必要があるため、路線名を定義する @train-route というEntityを新しく作成します。 Entityの作成は Entities > CREATE ENTITY から行います。 左側（reference value ）には「パラメータの単語」を、右側（synonym）には「その単語の同義語」を入力します。 日本語の場合、ひらがなで認識される可能性もあるため synonym にひらがなも入力すると良いでしょう。 上記の場合、ユーザが「おだきゅうせん」や「 小田急 」と発言しても、「 小田急 線」として認識されます。 作成が完了したら SAVE で保存しましょう。 Intentsを作成する Intents ではユーザの会話によってどの処理を実行するのかを定義します。 今回は「 路線名 の遅延情報を教えて」という会話に反応するIntentを作成するため、 Intents > Default Welcome Intent で以下のように編集しました。 User says ：このIntentとして認識される例文を入力します。追加で「 路線名 は遅延している？」という呼びかけでも認識するようにしました。黄色背景部分（路線名）はパラメータとなる部分です。 Action ：上のテキストボックスにはアクション名を指定します。後述のFulfillmentの実装で利用します。2つ目のテーブルではパラメータを指定します。 REQUIRED ：必須有無を選択できます。必須の場合、このパラメータが入力されないと次の Intent には遷移しません。 PARAMETER NAME ：パラメータ名です。Fulfillmentにてパラメータを識別するために利用します。 ENTITY ：このパラメータのEntityです。今回は先ほど作成したEntityの @train-route を指定しています。 IS LIST ：複数の値を受け取る場合に指定します。 PROMPTS ：パラメータの入力を促す文章を定義します。REQUIREDにチェックしたパラメータについて、ユーザからの入力が無かった場合やEntityに存在しない単語を入力された場合に使われます。 Response ：このIntentでのユーザへの返答を定義します。今回はFulfillmentを使って返答するため、デフォルトで設定されているものは削除します。 作成が完了したら SAVE で保存しましょう。 Fulfillmentを実装する IntentとEntityを使って路線名は取得できましたので、いよいよFulfillmentで遅延情報を確認する スクリプト を書いていきましょう。 今回は、Fulfillmentの実装に Firebase というサービスを利用します。 DialogflowはFirebaseと連携しているため、Dialogflow上でFulfillmentの実装・デプロイをすることができます。 Fulfillment > Inline Editor > ENABLED で表示されるエディタに スクリプト を記述しましょう。 今回実装したコードは以下のようなものです。 遅延情報を取得する処理は割愛しますが、 API 等を利用するなどして遅延有無を isDelay フラグにセットする想定です。 'use strict' ; process.env.DEBUG = 'actions-on-google:*' ; const App = require( 'actions-on-google' ).DialogflowApp; const functions = require( 'firebase-functions' ); // Intentのアクション名を指定 const NAME_ACTION = 'confirm_delay' ; // パラメータのPARAMETER NAMEを指定 const ROUTE_ARGUMENT = 'train-route' ; exports.dialogflowFirebaseFulfillment = functions.https.onRequest((request, response) => { const app = new App( { request, response } ); function confirmDelay (app) { // 路線名を取得する let route = app.getArgument(ROUTE_ARGUMENT); let isDelay = false ; /* 指定した路線の電車遅延情報を取得する処理をここに書く */ if (isDelay) { app.tell(route + 'で遅延発生中です。' ); } else { app.tell( '現在' + route + 'では遅延は発生していません。' ); } } let actionMap = new Map(); actionMap.set(NAME_ACTION, confirmDelay); app.handleRequest(actionMap); } ); 下部の DEPLOY ボタンを押せばFirebaseへのデプロイが完了します。 IntentからFulfillmentを呼び出すためには、 Intents > Default Welcome Intent > Fulfillment > Use webhook にチェックを付けてください。 動作確認をする これで設定は概ね完了したので、動作確認をしてみます。 右側のテキストエリアに会話文を入力することで、Dialogflowでの動作確認を行えます。 早速「おだきゅうの遅延情報を教えて」と入力してみましょう。 USER SAYS にはユーザが入力した文章が表示されます。 作成したEntity @train-route にて、「おだきゅう」は「 小田急 線」の同義語と定義したため、パラメータ train-route には 小田急線 がセットされています。 このパラメータがセットされた状態でFulfillmentが呼び出され、レスポンスとして「現在 小田急 線では遅延は発生していません」という文章が返ってきました。 GoogleHome実機でのテストは、 Integrations > Google Assistant > TEST で Googleアシスタント と連携することで実施できます。 おわりに 以上でGoogleHome上で動作するアプリを作成することができました。 Dialogflow自体はSlackや Twitter とも連携しているため、今回説明した内容を応用すれば アプリ開発 や Bot 開発の幅が広がりそうですね。 ほぼすべての設定をWeb上で実施でき敷居も低いと思いますので、皆さんもぜひお試しください。 お知らせ ラク スでは 去年 に引き続き、 ラク ス Advent Calendar 2017 を実施いたします！ Qiitaにカレンダーを公開していますのでお楽しみに。 qiita.com 参考 Build Actions for Google Assistant using Actions Builder (Level 1) Google Developers Japan: Google アシスタント対応アプリを日本語で開発してみよう Actions on Google: Building Assistant Actions using API.AI - YouTube *1 : 選考方法：じゃんけん

id:radiocat です。楽楽精算の大阪開発チームのリーダーを担当しています。 11月8日、Japan IT Weekが開催された 幕張メッセ に行ってきました。 Japan IT Weekとは Japan IT Weekは様々な IT技術 を持った出展企業とソリューションを求めるビジネスマンが商談を交わす日本最大級のIT専門展です。BtoBサービスを展開する我々にとってはスーパー重要なイベントです。東京ビックサイト、 幕張メッセ 、 インテックス大阪 の3箇所で時期を分けて開催されています。今回は数々のバンドが伝説を作り サカナクション が アルク アラウンドした 幕張メッセ にスーツを身にまとったビジネスマンが集結し列を作りました。毎年多くの人が熱狂するこの場所をビジネスマンが埋め尽くす超ビックなオトナのフェスなのです。 Japan IT Week秋＠ 幕張メッセ 11/8〜10の3日間、 幕張メッセ で開催されました。今回私は各業界の動向をウォッチしたり弊社のサービスとの機能連携の可能性を考えてみたりなど、今後の製品開発の参考にすることを目的にそれぞれのブースを回ってきました。会場は10種類の展示区画に分かれています。 http://www.japan-it.jp/seminar/ www.japan-it.jp クラウドコンピューティング EXPO Web&デジタル マーケティング EXPO データセンター展 通販ソリューション展 店舗ITソリューション展 情報セキュリティEXPO モバイル活用展 ビックデータ活用展 IoT/M2M展 AI・業務自動化展 中でもビックデータ、IoT/M2M、AI・業務自動化は近年とても注目されている分野ということもあり、多くの人で溢れかえっていました。それぞれ独立した分野というよりも、センサーを活用してビックデータを集め、AIを活用して業務を分析、改善するような、それぞれの分野を融合させた製品が多数出展されていました。まだまだ発展途上の分野でもあり、今後も注目され続けそうな熱気を感じることができました。 通販ソリューション展は弊社製品のメールディーラー／チャットディーラー、配配メール、クルメルが出展していました。そして クラウドコンピューティング EXPOには私も開発に携わっている楽楽精算と働くDBが出展していました。どちらも大変盛況で主に営業チームのメンバーが休む間もなく対応していました。一言ぐらい激励を…と思い近づこうとしたものの多忙そうで入る隙間もなく、社員なのにコンパニオンさんに勧誘されそうになってこれはまずいと思い立ち去りました。。 自分が開発に関わっている製品が多くの人達に支えられて、さらに多くのユーザーに届けられようとしているその瞬間を見られることはとても貴重なことであり良い体験になりました。 総務・人事・ 経理 ワールド＠ インテックス大阪 幕張メッセ との関連展示会として11/15〜17に大阪でも総務・人事・ 経理 ワールドという展示会が開催されました。こちらは私も関係者の1人として楽楽精算の出展のお手伝いをしてきました。 来訪頂いた人にコンパニオンさんが簡単な説明を行い、興味をもって頂いた場合はスタッフがデモをしました。僭越ながら私もスタッフの1人としてデモしました。中小企業の 経理 部門が抱えている課題は会社によって様々なので、こうして少しだけデモのお手伝いをするだけでも様々なご意見が聞けてとても参考になります。 ちなみに、私が開発に関わった機能の1つに ICリーダーアプリ がありますが、コンパニオンさんが手に持っている タブレット 端末ではこのアプリを使った説明をされていました。自分が開発に関わったアプリをお姉さまたちが手にとってコンパニオン活動をされているのを見るだけでも、慣れないスタッフ作業の疲れが吹き飛ぶほど価値ある経験でした。 まとめ 以上のように来訪者側とスタッフ側の両方を体験して私のこの秋のフェスシーズンは幕を閉じました。しかし年明けにはまた インテックス大阪 で、そして春には東京ビックサイトで次の展示会が予定されているようです。ビジネスマンの活動は既に次に向けて動き出しているのです。 おわりに なお、 ラク スでは一緒に働く社員やパートナー企業の方を募集しています。このような経験を一緒に堪能してみたいと感じられたかたがいましたらぜひお声がけください。Web技術だけでなく iOS や Android といったモバイル技術やAIなどの先進的な技術を持ったエンジニアのかたも大歓迎です。 株式会社ラクス｜採用情報

はじめに 記事をご覧のみなさん、はじめまして。新卒1年目エンジニアのkasuke18と申します。 ブラウザは圧倒的に Chrome 派です。 今回の記事では私が作ってしまった2大 脆弱性 の XSS と SQLインジェクション について、ソース例を踏まえて原因を追及します。なお、ソースの言語については PHP を利用しています。 この記事が初めてのブログ投稿ですので、「この書き方はヘンだな」と感じるときがあると思いますが、そこは温かい目で見守ってくださると幸いです。。 もくじ はじめに もくじ この記事の想定する読者 XSS XSSとは XSSが発生したソース例 なぜXSSが発生したのか 実施した対処 この件を通して感じたこと SQLインジェクション SQLインジェクションとは SQLインジェクションが発生したソース例 なぜSQLインジェクションが発生したのか 実施した対処 この件を通して感じたこと おわりに 参考文献 この記事の想定する読者 新人エンジニアの方々 「2大 脆弱性 は知ってるけど、具体的にダメな実装例が実感できない」という方が読まれた際に、理解の手助けとなれば幸いです。 つきましては「 XSS とは」「 SQLインジェクション とは」ということは今回はさらっと流します。それらをお探しの方は他のサイトをご覧ください。 IPAのサイト は国の機関なので信頼できると思われます。 「こんなパターンで 脆弱性 が発生するのか」や「ここの実装するときは気を付けないと！」などと感じていただくのが目的です。とはいっても実際のソースは 大人の事情で 載せられないので、実際のソースとは少しズレてしまいますが、そこはご容赦ください。。 XSS XSS とは いきなりですが、新人エンジニアの私から見てもわかりやすくまとまっていると感じた記事があるので引用します。「 XSS とは何か」ということをお探しの方は こちら をご確認ください。 XSS (Cross Site Scripting)は、あるWebページにアクセスした標的のブラウザ上で、攻撃者が任意のコードを実行し得るバグ、あるいはそれを用いた攻撃手法のこと XSS が発生したソース例 XSS が発生した原因などは次で説明するとして、まずは XSS が発生してしまったソース例を示します。 <!DOCTYPE> < html > < head > </ head > < body > < form action = "" method = "post" > <!-- ↓ここでXSSが発生 --> < input name = "hoge" type = "hidden" value = " <?php echo $ _POST [ 'hoge' ] ; ?> " > </ form > </ body > </ html > この時実現したかったことは、フォームから入力値を受け取り、その入力値をパラメータにセットすることです。 なぜ XSS が発生したのか ソース例を見ていただければわかるかと思いますが、直接の原因は単純に エス ケープが漏れていたことです。言い方は悪いですが半ば思考停止気味に「とりあえず エス ケープしておこう」で防ぐことはできたミスです。 ではなぜ エス ケープが漏れてしまったのかと言い訳をしますと、単純に注意不足で エス ケープをしなかったことに加えて、 「入力値検証をしっかりと行っているから大丈夫」 という無意識のうちに安心感を持っていたことです。 むしろ今回の件では見事にその意識の甘さが 脆弱性 を生み出しました。どういうことかと申しますと、具体的には以下の流れで発生していました。 Chrome のdeveloperツールでパラメータを変更し スクリプト を仕込み、確定する サーバは入力値検証を行い、エラーと入力値を返す 戻った画面では受け取った入力値をセットする XSS が発生!! 今回 XSS を発生させてしまったのは <input> の type="hidden" パラメータでした。これは通常の画面操作からは直接変更できませんが、developerツールではできてしまいます。 それでは好き放題に変更された入力値を受け入れてしまうので、普通は入力値検証を行い、決められた値以外は許可しないようにします。 また、ユーザの使いやすさを考えると、エラー時に戻った画面ですでに入力されていた内容をセットしておくことも必要です。（入力内容を1か所間違えただけで全部やり直しというのはあまりに不親切ですので。） 今回の件でもそれに乗っ取り入力値検証を行い、数値以外は許可しないようにしていました。また、エラー時に入力値をセットするということもしていました。 XSS を発生させる原因となった処理はこの「エラー時に入力値をセットする」という処理で、この入力値を出力する際に エス ケープしなかったために XSS が発生しました。 実施した対処 今回の件では エス ケープが漏れていたことが原因なので、 エス ケープを実施して対処しました。 PHP では htmlspecialchars() という関数を利用することで エス ケープできます。 以下が修正後のソース例となります。 <!DOCTYPE> < html > < head > </ head > < body > < form action = "" method = "post" > <!-- ↓ htmlspecialchars() を使用 --> < input name = "hoge" type = "hidden" value = " <?php echo htmlspecialchars ( $ _POST [ 'hoge' ]) ; ?> " > </ form > </ body > </ html > この件を通して感じたこと この XSS脆弱性 は被害という意味ではほぼ問題ないと考えています。その理由は、 入力値検証ではじかれるため、サーバが スクリプト を許容していない 1を考慮すると、 スクリプト が実行されるのは スクリプト を埋め込もうとした攻撃者のみである 以上の2点から被害はほぼないと考えました。 しかし、 エス ケープが漏れてしまっていたことは問題なので、今後は忘れないように十分に注意します。 SQLインジェクション SQLインジェクション とは XSS 同様に SQLインジェクション も詳しい説明は省略させていただきます。詳しくは IPAの資料 をご覧ください。 SQLインジェクション が発生したソース例 SQLインジェクション が発生した原因などは次で説明するとして、まずは SQLインジェクション が発生してしまったソース例を示します。 <?php $ id = $ _POST [ 'id' ] ; $ status = $ _POST [ 'status' ] ; $ conditions = '' ; $ isFirst = true ; if ( $ id !== null ){ if ( $ isFirst ){ $ conditions .= ' WHERE ' ; $ isFirst = false ; } else { $ conditions .= ' AND ' ; } $ conditions .= 'id = :id' ; } if ( $ status !== null ){ if ( $ isFirst ) { $ conditions .= ' WHERE ' ; $ isFirst = false ; } else { $ conditions .= ' AND ' ; } // ここでSQLインジェクションが発生 $ conditions .= 'status = ' . $ status ; } $ sql = 'SELECT is, name, status FROM table' . $ conditions ; $ sth = $ dbh -> prepare ( $ sql ) ; $ sth -> bindValue ( ':id' , $ id ) ; $ sth -> execute () ; ?> この時実現したかったことは、フォームから入力値を受け取り、その入力値によりDB検索を行うことです。また、フォームで入力されるパラメータは毎回すべて入力されるわけではないので、 SQL のWHERE句は動的に組み立てる必要があります。 なぜ SQLインジェクション が発生したのか 上記のソース例を見ていただければ一目でわかりますが、パラメータ id は正しくプリペアード ステートメント が使用されていますが、パラメータ status は単なる文字列結合となってしまっています。このことが SQLインジェクション を発生させていました。 また間接的な原因として、パラメータ status についての入力値検証が全く行われていなかったことがあります。ただの言い訳でしかありませんが、入力値検証を行わなかった理由はパラメータ status の入力方法がプルダウンメニューであり、「プルダウンならプログラムが用意した値以外は送られてこない」という誤った認識をもってしまっていたからです。すでに上記 XSS の項でも述べていますが、 Chrome などのdeveloperツールを利用すれば簡単に値を変更できる ことを失念していました。 実施した対処 理想論でいえば、本来は保険的な対策でしかない入力値検証だけで対処するのではなく、適切にプリペアード ステートメント を利用することが必要です。しかし今回の件では諸事情により根本的な原因である SQL の組み立て部分を変更することはできませんでした。よって入力値検証で数値以外は許容しないようにして対処しました。 XSS と同様、修正後のソース例を書こうと考えましたが、 大人の事情で 書くことができません。 代わりに、理想的な対処法であるプリペアード ステートメント を適切に利用して対処したソース例を以下に示しますので、ご容赦ください。 <?php $ id = $ _POST [ 'id' ] ; $ status = $ _POST [ 'status' ] ; $ conditions = '' ; $ isFirst = true ; if ( $ id !== null ){ if ( $ isFirst ){ $ conditions .= ' WHERE ' ; $ isFirst = false ; } else { $ conditions .= ' AND ' ; } $ conditions .= 'id = :id' ; } if ( $ status !== null ){ if ( $ isFirst ) { $ conditions .= ' WHERE ' ; $ isFirst = false ; } else { $ conditions .= ' AND ' ; } // プレースホルダを使用 $ conditions .= 'status = :status' ; } $ sql = 'SELECT is, name, status FROM table' . $ conditions ; $ sth = $ dbh -> prepare ( $ sql ) ; $ sth -> bindValue ( ':id' , $ id ) ; // 値をパラメータにバインドする $ sth -> bindValue ( ':status' , $ status ) ; $ sth -> execute () ; ?> この件を通して感じたこと 今回の件では「プルダウンなら入力値検証を行わくてもよい」という完全に誤った認識が露呈しました。プルダウンだけではなく、 XSS の項でも挙げている <input> の type="hidden" パラメータも同様で、「通常の画面操作から直接変更できないパラメータこそ入力値検証が必要」と感じました。 おわりに 以上が、私が実装してしまった2大 脆弱性 です。この記事の目的の通り、「こんなパターンで 脆弱性 が発生するのか」と把握していただけたでしょうか。実際のソースが載せられないため、正直よくあるソース例になってしまった感が否めません。。 ちなみにと言っては何ですが、今回ご紹介した 脆弱性 はどちらも 単体テスト で発見・修正しているので、大事には至っておりません。 最後までお読みいただきありがとうございました。 参考文献 脆弱性 対策： IPA 独立行政法人 情報処理推進機構 https://www.ipa.go.jp/security/vuln/index.html 結局 XSS って何なの？ - XSS になりたい http://xss.hatenablog.jp/entry/2014/12/03/154132 安全なウェブサイトの作り方： IPA 独立行政法人 情報処理推進機構 https://www.ipa.go.jp/security/vuln/websecurity.html エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 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年目のMasaKuと申します。 PHP の勉強を開始した当初は「とにかく動かせること」「思い通りに動くこと」だけで満足していました。 しかし、勉強を進めていくうちに「もっと綺麗にできないものか」と思うようになり、 フレームワーク の勉強を開始しました。 フレームワーク は、使い方を覚えるまでは時間がかかるものですが、要領が分かってくると、たった数行書くだけでいろんな機能を実現してくれるため、Web アプリ開発 を強力にサポートしてくれます。 LaravelではComposerというシステムを利用することで簡単に導入することができるため、これから フレームワーク を勉強しようとしている方にもおすすめの フレームワーク であると考えます。 本記事は、生の PHP は書いたことがあるけれど、 フレームワーク は使ったことがない、という方に対して、導入の一歩をお手伝いできるよおうな記事になれれば幸いです。 なお、以下は Windows で導入する際の手順となります。 macOS をお使いの方は、同じように進められない可能性がありますのでご了承ください。 はじめに PHPフレームワークとは Laravelとは Laravelのインストール 準備するもの XAMPPのインストール Composerのインストール ダウンロード手順 インストール手順 Laravelのインストール Laravelプロジェクトの作成 おわりに 参考資料 PHP フレームワーク とは フレームワーク とは、「開発で多様される様々な機能や仕組みを持ったソフトウェア」です。 Web アプリ制作 で最低限必要となる機能（ログイン画面など）は大抵のアプリである程度共 通化 しています。 そのため、そういったお決まりの機能の開発は フレームワーク に任せてしまおうといった思想のもと生まれました。 PHP フレームワーク で有名なものは以下の通りです。 CakePHP Symfony Zend Framework CodeIgniter 書店に行くと上記のいずれかの参考書を目にしたことがあるのではないでしょうか。 特に CakePHP の本はどの書店に行っても置いているという印象で、日本で最も人気の PHP フレームワーク なのではないでしょうか。 Laravelとは 私が大人気の CakePHP を差し置いて、Laravelの勉強をしようと思った理由は以下の通りです。 低い学習コスト 楽に導入できる GitHub で人気急上昇中 フレームワーク 導入でつまづいてしまうと、一気にやる気を失ってしまうと感じたため、スムーズに開発できる段階に移行できるものがいいなと感じました。 また、現在 GitHub で注目されているというのもポイントでした。 以下は GitHub 上でのスターなどの比較です。 GitHub での注目度比較 (2017/11/11 時点) フレームワーク 開発に携わる人が多いということは、これからも進化し続ける可能性があるということです。 また、そういった風潮を受けてか、書店では出版日が比較的若い本が販売されていたことも魅力の一つだと思いました。 Laravelのインストール さて、前置きが長くなりましたが、さっそくLaravelの導入です。 今回は、Laravelの画面が表示できるところまでを解説させていただきます。 準備するもの Laravelを導入に必要なものは以下の通りです。 XAMPP Composer 「あれ、Laravelの導入なのにLaravelは用意しなくてもいいの？」と感じる方もいらっしゃるかもしれません。 Laravelでは、Composerというプログラムを利用することで、Laravelを利用するために必要なライブラリなどを自動で入手することができます。 コマンド入力が必要となりますが、そこさえ間違えなければ、導入で失敗することはありません。 XAMPPのインストール まずはXAMPPのインストールです。 XAMPPとは PHP の実行環境を簡単に構築できる Apache ディストリビューション のことです。 以下のページからXAMPPをダウンロードしてください。 Composerを利用するためにXAMPPの PHP を利用したいだけなので、 php .iniなどの設定ファイルは触らずに、インストールだけ完了させておいてください。 www.apachefriends.org Composerのインストール 次はComposerのインストールです。 Composerは上述の通り、 PHP フレームワーク を導入する上で必要となるライブラリなどを自動で入手してくれるプログラムです。 これを利用することで、簡単にLaravelを導入ることができます。 では、Composerの インストーラ ーを以下のページからダウンロードしてください。 getComposer.org インストーラ ーをダウンロードするリンクがわかりにくいと感じたので、画像を掲載しておきます。 よければ参考にしてください。 ダウンロード手順 Download をクリック Composer-Setup.exe をクリック Composerの インストーラ ーがダウンロードできたら、次はインストールです。 インストール手順 Nextをクリック XAMPPフォルダ内の PHP が選択されていることを確認しNextをクリック プロキシサーバーを設定する画面ですが、今回は何も選択せずにNextをクリック Installをクリック Nextをクリック Finishをクリック これでComposerのインストールは完了です。 Laravelのインストール いよいよLaravelのインストールです。 Laravelのインストールでは、先ほどインストールしたComposerを利用します。 Composerを利用するには、 コマンドプロンプト を利用します。 「Windodsキー」 + 「R」 のショートカットで「ファイル名を指定して実行」を表示し、「cmd」と入力することで コマンドプロンプト を起動できます。 コマンドプロンプト が起動できたら、以下のコマンドを実行してLaravelの インストーラ ーをダウンロードします。 Composer global require "laravel/installer=~1.1" ダウンロードには少々時間がかかりますが Updating dependencies(including require-dev) までが表示されていれば、コマンドは成功していますので、気長に待っていてください。 しばらくすると、ダウンロードが開始して Generating autoload files が表示されればLaravelのダウンロードは成功です。 Laravelのダウンロードに成功した際の表示 これで一通りは完了なのですが、最後にLaravelを利用するため 環境変数 PATHを設定する作業があります。 コントロールパネル→システムとセキュリティ→システム→システムの詳細設定 の順で開き、システムのプロパティを開きます。 システムのプロパティ画面 ウィンドウ下部に「 環境変数 」というボタンがありますので、クリックします。 環境変数 ウィンドウ下部のシステム 環境変数 のリストの中に「Path」という項目があると思います。 この項目を選択して「編集」をクリックします。 システム 環境変数 のPathを選択して編集をクリック 環境変数 名の編集が表示されたら「新規」をクリックして以下のパスを追加します。 C:\Users\ここには各ユーザの名前が入ります\AppData\Roaming\Composer\vendor\bin 新規をクリックしてパスを追加する Pathの追加が完了したら各画面をOKで閉じていきます。 ここまでの作業が完了したらLaravelプロジェクトを作成する準備が完了です。 Laravelプロジェクトの作成 それでは、いよいよLaravelプロジェクトを作成して、画面を表示していきましょう。 Laravelプロジェクトを作成する場所はどこでも構いませんが、今回はわかりやすいようにデスクトップに作成しましょう。 それでは、 コマンドプロンプト 上でデスクトップに移動します。 デスクトップに移動するコマンドは以下の通りです。 cd Desktop コマンドプロンプト 上でデスクトップに移動できたら以下のコマンドを実行して、Laravelプロジェクトを作成してください。 laravel new hellolaravel laravelコマンドにより、プロジェクトを構成する上で必要なパッケージをどんどん揃えてくれます。 ダウンロードには少々時間がかかりますので、気長に待ってください。 laravelコマンド実行後の画面 Application ready! Build something amazing.が表示されればインストール完了 もし、うまくいかない場合は、 環境変数 の設定が間違っている可能性がありますので、設定を見直していただくか、以下のコマンドでもLaravelプロジェクトの作成が可能です。 Composer create-project laravel/laravel hellolaravel --prefer-dist プロジェクトの作成に成功すると、デスクトップに「hellolaravel」という ディレクト リが作られているはずです。 では、プロジェクトがうまく作成できたか確認してみましょう。 以下のコマンドを コマンドプロンプト に入力してhellolaravelの場所に移動します。 cd hellolaravel hellolaravelに移動できたら、以下のコマンドを実行してください。 php artisan serve すると Laravel development server started: <http://127.0.0.1:8000> のような表示が現れます。 Laravel では 内部サーバを利用することができ、上記のコマンドで簡単に動作確認をすることができます。 内部サーバはPHP5.4以降に実装されたビルドインサーバー機能を利用しています。 さきほど実行した artisan というコマンドでは、ビルドインサーバを利用するだけでなく、Laravelで利用可能な様々な機能を実行することができます。 以下のコマンドで実行可能なコマンドを一覧で確認することができるので、ほかにどんなコマンドがあるか気になった方は是非調べてみてください。 php artisan list さて、少し脱線しましたが、 php artisan serve でビルドインサーバが起動できたら、ブラウザ上で動作確認をしてみましょう。 ブラウザを立ち上げて http://localhost:8000 にアクセスしてみてください。 すると、Laravelのホーム画面が表示されているかと思います。 正しく表示されていたら、Laravelの導入が成功した証拠です。 おめでとうございます。 http://localhost:8000 にアクセスした際の表示 ちなみに、起動したビルドインサーバを停止させたい場合は、 コマンドプロンプト で 「Ctrl」 + 「C」 を入力します。 おわりに 以上が、Laravelの導入方法です。いかがでしたでしょうか。 私も初めて自分で フレームワーク を導入してみましたが、特に失敗することなく導入することができました。 この手軽さが、Laravelが低コストで学習することができる所以であるかしれません。 Laravelの使い方については、参考書などで勉強することが効率的かと思いますが、いくつか紹介したい機能もありますので、またいつかの機会に紹介できたらなと思います。 以上です。長文失礼しました！ 参考資料 PHP フレームワーク Laravel入門 http://www.shuwasystem.co.jp/products/7980html/5258.html ソフトウェア フレームワーク https://ja.wikipedia.org/wiki/%E3%82%BD%E3%83%95%E3%83%88%E3%82%A6%E3%82%A7%E3%82%A2%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0%E3%83%AF%E3%83%BC%E3%82%AF XAMPP https://www.apachefriends.org/jp/index.html XAMPPのインストール方法 https://techacademy.jp/magazine/1722 Composer https://getcomposer.org/ Composer Wiki https://ja.wikipedia.org/wiki/Composer Laravel 5.3 インストール https://readouble.com/laravel/5.3/ja/installation.html エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

ラク スエンジニアのstrongWhiteです。 過去に「 WIP制限の大切さ 」の記事を書いているので、興味がある方はそちらも参考にしてくださいませ。 さて、今回は ラク ス大阪本店で開催している もくもく勉強会 のご紹介をさせていただきます。 もくもく勉強会とは 「勉強会」と付いていますが、共通のテーマをもとに議論したりはしていません。 何らかの課題や目的をもつ人々が集まって、それぞれの目的のもとにそれぞれが自由に取り組むこと を目的として活動しています。 そのため勉強の内容も参加者によってさまざまで、必ずしもITや技術に関係するトピックを扱っていません。 ↓↓↓勉強内容はこんな感じです↓↓↓ 業務と関係のない言語や フレームワーク の勉強をする プライベートサービスの開発をする 今後業務にぶっこんでやろうと思っている何かの予習をする 積ん読 を消化する 資格の勉強をする IoT的ななにか ペアプロ をする etc... 月イチで発表会も開催しており、勉強会の成果や、勉強会の活動とは全く関係なく発表したいことがある人が発表を行っています。 ここまで読んでいただいて分かる通り、割とゆるやか～な雰囲気で活動しております。 10月の発表会の様子 では実際に10月の発表会の様子を一部紹介したいと思います。 写真はオフィスのカフェスペースにぶら下がってる電球を Philips Hue v2 に差し替えて、 AWS IoT ボタン を押した際に電球の色を変えてみよーという試みを行っている様子です。 カフェスペースをいつもの白色から色鮮やかで華やかでスタイリッシュに変えてみようという感じです(笑) AWS IoT ボタン の入力をローカルサーバで受け取り、 Philips Hue v2 と同期することで電球の色が変わります。 次の写真はカフェスペースでいまいろんな意味で流行りの ドローン を飛ばしてみた様子です。 制御自体は Raspberry Pi で行っており、離着陸、旋回以外に一回転するなどのトリッキーな動きも実現しています。 写真の真ん中で紫色の光を放っているのがドローンです。今まさに一回転してます(笑) もくもく勉強会のよいところ 私が参加して良いなと思うところは 技術的興味の窓口(キッカケ)ができる ところかなと思います。 他のエンジニアの人が行っている勉強内容から興味を持ち、自分も学んでみようというキモチが生まれるイメージです。 勉強会では他のエンジニアの方と和気あいあいと話しながら楽しく学べるので、普段は話さない人ともコミュニケーションが盛んになり、 同時に技術的知識を蓄えられるので一石二鳥かなと思います。 おわりに ラク スでのもくもく勉強会を紹介しました。 エンジニアならば自由に技術の話題を見聞きするのは楽しいと思うはずです。 弊社ではこういった技術的勉強会に対してオープンなので、エンジニアとしては嬉しい限りです。 これからも続いていけるようにしていきます。 以上strongWhiteからのもくもく勉強会の紹介でした。 参考 Philips Hue v2 AWS IoT ボタン Raspberry Pi

はじめに はじめまして、新卒一年目のd_ shr と申します。 現在、業務では PHP を用いて開発を行っています。業務に入る前は大学在学中の研究開発や入社後の新人研修で Java を使っていました。 在学中に PHP を学習した経験はありましたが、業務で扱うことになると入出力のチェックなど セキュリティの観点には特に注意しなければいけないため、 プログラミング言語 の細かい仕様まで把握する必要があると思います。 そこで変数の扱いなどに PHP 独特のものを感じ、 Java とは違う仕様に戸惑うことがありました。 本記事では、 Java から PHP に転向した際に戸惑ったことを中心に、主に Java 経験者から見た PHP の特徴、注意点などをまとめていこうと思います。 PHP の学習を考えている方や PHP 初心者の方に少しでも参考になれば幸いです。 目次 はじめに 目次 PHPを使い始めて戸惑ったこと PHPの変数の扱い 暗黙的な型変換 変数のスコープ その他、気になったこと 配列の値渡し まとめ PHP を使い始めて戸惑ったこと 業務で実装をしていて1番戸惑ったことは、変数の扱いです。 セキュリティの観点から正しい値が格納されていることをチェックする実装することがありますが、その際に PHP の変数の扱いに戸惑いました。 PHP の変数の扱い まず、 PHP は変数の型がありません。 Java と比較すると、 PHP の大きな特徴であると思います。 変数に型がない PHP では、1つの変数に数値と文字列を格納することができます。 <?php $ hoge = 123 ; $ hoge = "hogehoge" ?> 他にも... 以下のような書き方ができることにも最初はすごく違和感を感じました。 <?php $ hoge = 1 ; $ hoge = $ hoge == true ? "true" : 0 ; ?> PHP 側で解釈してくれるので型の宣言をする必要がなく、記述量が減るメリットはあると思います。 (可読性を考えると、このように書くことはあまりないと思いますが) しかし、 PHP が勝手に型を合わせてしまうため、 Java のような型に厳密な言語を触った後では、変数の扱いに戸惑うことがよくありました。 暗黙的な型変換 暗黙的な型変換とは、 PHP が変数の型を勝手に変換してしまうことです。 例えば、以下のような変数の比較。 <?php $ a = 0 ; $ b = "hoge" ; if ( $ a == $ b ) { // true } ?> PHP で数値と文字を比較すると、文字を数値に変換しようとします。 文字列の最初の部分により値が決まり、有効な数値がない場合は0になるため、 このような結果になります。 PHP の仕様通りに変換され意図しない結果が得られることがあるため、 PHP での条件分岐を作る際には、変数の扱いには注意が必要です。 扱いに注意が必要な例 <?php if ( 0 == 0 ) // true if ( 0 == "0" ) // true if ( 0 == false ) // true if ( 0 == null ) // ture ?> これらは、型が正しいかどうか厳密な比較を行う 演算子 "＝＝＝"を使うことで解決できます。 しかし、厳密な比較を行わない、switch文も注意が必要です。 <?php switch ( $ hoge ) { case 0 : // hogeが0, "0",false, null,""などで実行される break ; case "0" : // ここは実行されない break ; } // 厳密な型変換を行う場合 switch ( true ) { case $ hoge === 0 : // hogeが数値の0のときだけ break ; case $ hoge === "0" : // hogeが文字列の"0"のときだけ break ; } ?> 型に厳密な プログラミング言語 の経験がある場合は、 変数の扱いで引っかかりやすいのではないかと思いました。 PHP で正しく変数の扱うためには、変数について仕様をしっかり把握し注意しないといけません。 変数のスコープ PHP の変数の扱いで戸惑ったことは暗黙的な型変換だけでなく、 変数のスコープでも経験があります。 変数のスコープとは、変数の有効範囲のことです。 PHP では、関数単位のスコープしかなく、 if文やループ中のみでしか使わないような変数を定義できません。 <?php $ flag = true ; if ( $ flag ) { $ value = "true" ; } else { $ value = "false" ; } Java ではif文の中で定義された変数は、if文のブロックの中だけで有効です。 PHP のスコープを把握していなかったときに、以下のような ソースコード を書いたことがあります。 <?php $ flag = true ; $ value = "" ; if ( $ flag ) { $ value = "true" ; } else { $ value = "false" ; } // $valueに空を入れたくなかったときはこっちで書いた $ flag = true ; $ value = "true" if ( !$ flag ) { $ value = "false" ; } スコープを正しく理解していないと可読性の低い ソースコード になってしまうこともあります。 スコープも プログラミング言語 で特徴があるので、 各言語ごとに把握しておかないといけないことだと思います。 その他、気になったこと 上記以外で、実装中に疑問に思って調べたことや違和感を感じたことです。 配列の値渡し Java のデフォルトは参照渡しですが、 PHP のデフォルトは値渡しです。 PHP でも参照渡しはできます。 値渡しの例 <?php $ array = [ 1 , 2 , 3 ] ; $ copy = $ array ; $ copy [ 1 ] = 5 ; print_r ( $ array ) ; print_r ( $ copy ) ; $array: Array ( [0] => 1 [1] => 2 [2] => 3 ) $copy: Array ( [0] => 1 [1] => 5 [2] => 3 ) 参照渡しの例 <?php $ array = [ 1 , 2 , 3 ] ; $ copy = $ array ; $ copy2 = & $ array ; $ copy [ 1 ] = 5 ; $ copy2 [ 1 ] = 5 ; print_r ( $ array ) ; print_r ( $ copy ) ; ?> $array: Array ( [0] => 1 [1] => 5 [2] => 3 ) $copy: Array ( [0] => 1 [1] => 5 [2] => 3 ) まとめ Java から PHP を扱うようになって戸惑ったことや違和感についてまとめてみました。 当初はこの違和感に嫌気が差していましたが、今では PHP に 洗脳され 慣れてしまいました。 PHP を学び始めた方や、次の新卒で入社される方に参考になればと思います。 また、同じような境遇の方に共感いただければ幸いです。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

はじめに 皆さんこんにちは，kuwa_38です．今年から ラク スに入社した新卒です．社会人になって色々と気づいたことはありますが，その1つが「エクセルって意外と使うな」ということです．テキストファイルや wiki などに書かれることもありますが，それらと同じかそれ以上にエクセルの資料は多いように感じます．そのため，エクセルを早く扱えて損はないと思っています． この記事ではエクセルのショートカットや便利機能について記載します．エクセルに向かう時間を短くし，皆さんの貴重な時間を少しでも確保する手助けになれば幸いです． はじめに 誰もが使える便利機能 クイックアクセスツールバー：よく使う機能をお気に入り登録する シートの選択：シートを効率的に探す 図形の編集を効率化する オブジェクトの選択：図形を一気に選択する 図形の編集：途中で図形を変更する 表やグラフの作成を効率化する 選択セルの■をダブルクリック：表の一番下までオートフィルを掛ける フィル機能：数千行の数値を作成する 右クリックのオートフィル：書式のみコピー 「Ctr + *」：表を選択する 「F11」：棒グラフのグラフシートを作成する セル移動と入力を効率化する 「tab」：表の入力を効率化する 「Ctr + 矢印キー」：セル移動を効率化する 「F2」：編集と入力を切り替える 「F4」：参照先の「$」を付ける/はずす 「Ctr + :」：現在時刻を入力する 「Ctr + ;」：現在の日付を入力する おわりに 誰もが使える便利機能 クイックアクセス ツールバー ：よく使う機能をお気に入り登録する よく使うツールをお気に入り登録できる機能です． クイックアクセス ツールバー 登録方法： 登録したいツールの上で，右クリック＞クイックアクセス ツールバー に追加で登録できます． クイックアクセス ツールバー への登録 小技 クイックアクセス ツールバー に追加した機能は，マウスを使わずとも，Alt(F10) + 数字(左から順に自動で割り振られます)で使うことができます．自分の登録した機能の数字を覚えておくとより早く作業できます． ショートカットキーでアクセスする方法 リボン折りたたむと ツールバー が非表示になり，より広く画面を使うことができます．多くの機能を使わない，かつ，画面を広く使いたい方は，使う機能をクイックアクセス ツールバー に登録してピン留めをはずすと良いでしょう． 　 リボンを折りたたむ／結果： ツールバー が非表示になる シートの選択：シートを効率的に探す 図のようにエクセルの左下の箇所(「◁ ▷」の所)で右クリックを押すとシート名の一覧が表示されます． シートの選択 図形の編集を効率化する オブジェクトの選択：図形を一気に選択する 複数の図形の移動や編集に便利な機能です． 手順： 1. ホーム＞「編集」のグループにある「検索と選択」＞「オブジェクトの選択」 2. 選択したい範囲をドラック オブジェクトの選択メニュー 　 2.選択範囲をドラック／結果：ドラックした範囲内の図形が全てアクティブになる 図形の編集：途中で図形を変更する 変更したい図形を選択 「書式」＞「図形の編集」＞図形を選択 図形の変更／結果 表やグラフの作成を効率化する 選択セルの■をダブルクリック：表の一番下までオートフィルを掛ける 手順： 1. オートフィルを掛けたい列の起点となるセルにおいて，■の上にマウスカーソルを置く(「＋」が表示されます．) 2. 1の状態でダブルクリック 　 ■をダブルクリックでオートフィル／結果 フィル機能：数千行の数値を作成する ID1~3000まで作りたいといった時，ドラックしてオートフィルを掛けると時間がかかります．しかし，前項の「表の一番下までオートフィルを掛ける」は他の列が入力済みでないと使えません．そんなときに使える機能です． 手順： 1. 起点となるセルに初期値を入力 2. ホーム＞「編集」のグループにある「フィル」＞連続データの作成 3. メニューに増分や停止値を設定しOK(図の場合，列(縦)方向に1から3000まで1ずつ値を入力します) 1,2.初期値の入力と連続データの作成 　 3.増分等の設定／結果 右クリックのオートフィル：書式のみコピー 手順： 1. 図のようにオートフィルを掛けたい列の起点となるセルにおいて，■の上にマウスカーソルを置く(「＋」が表示されます.) 2. 右クリックを押したまま書式をコピーしたい分だけドラック 3. メニューの「書式のみのコピー(フィル)」を選択(書式がコピーされます．) 　 1.参考にする書式のセルを選択/2,3.ドッラック，書式のみコピー 結果 「Ctr + *」：表を選択する Ctr + *で表を選択できます． 表を選択する 「F11」：棒グラフのグラフシートを作成する 手順： 1. 表を選択 2. F11 　 表の選択・F11／結果 セル移動と入力を効率化する 「tab」：表の入力を効率化する tabを押すと1つ右のセルへ移動します．また，Tabを押した後にEnterを押すと，初めにtabを押したセルの1つ下へ移動します． Tab使用時のセルの移動 「Ctr + 矢印キー」：セル移動を効率化する 表の一番下に移動する時などに重宝するショートカットです． アクティブセルと移動方向の1つとなりのセルの内容で挙動が変わります． Ctr + 矢印：移動方向に値が入力済み Ctr + 矢印：移動方向のセルが空セル アクティブセル 移動方向の1つとなりのセル 結果 値が入力済み 空セル 値が入力済みのセルまで移動 値が入力済み 値が入力済み 値が入力済みの終端のセルへ移動 空セル 空セル 値が入力済みのセルまで移動 空セル 値が入力済み となりのセルに移動 「F2」：編集と入力を切り替える アクティブなセルでF2を押すと「編集モード」と「入力モード」を切り替えることができます． 編集モード： 矢印キーを押すと，アクティブなセルの中で文字カーソルが移動します．図のように打ち間違いを修正したい時などに便利です． 例えば，B3セルに「rakkkus」と入力後「←」を押すと，B3セルの中でカーソルが移動します． 編集モード：「←」を押すとセル内で文字カーソルが移動 入力モード： 矢印キーを押すと，他のセルに移動します． 例えば，B3セルに「rakus」と入力後「←」を押すと，A3セルに移動します． 入力モード：「←」を押すと左のセルに移動する 「F4」：参照先の「$」を付ける/はずす F4を押すことで「=A1」といったセルの参照を「=$A$1」,「=A$1」，「=$A1」,「=A1」と切り替えることができます． =sum($D$3:$G$8)のようにD3にもG8にも「$」を付けたい場合： 図のように，範囲を入力した後にF4を押すことで「$」の付ける/付けないを変更できます． 　 全体に「$」を付ける =sum($D$3:G8)のようにD3のみに「$」を付けたい場合： 前項のF2を利用します． 1. 範囲を入力(「=sum(D3:G8」の状態) 2. F2キーで編集モードに変更 3. D3に文字カーソルを合わせる 4. F4を押す 　 一部に「$」を付ける 「Ctr + :」：現在時刻を入力する 「Ctr + :」で現在時刻を入力できます. 「Ctr + ;」：現在の日付を入力する 「Ctr + ;」で現在の日付を入力できます． 表示を変更したい場合： (図は「2017/10/29」 ではなく 「10月29日」 にする場合) 1. 表示型を変更したい範囲を選択 2. 右クリック＞セルの書式設定 3. 分類＞日付＞「種類」を選択 　 　 表示の型を変更する おわりに この記事ではエクセルの便利機能やショートカットキーについて，私の主観で使いそうなものを15個紹介しました．この記事で紹介したことが，時短や作業の効率化につながれば幸いです． また，エクセルは本当に様々なことができます． ここで紹介したこと以外にも便利な機能やショートカット(さらに言えば，関数やマクロ)が存在するので，興味を持った方は検索してみてください．

初めまして、 ラク スエンジニアのnerobluebrosです。 今回は配車サービスの「 Uber 」について書きます。 ラク スは日本以外に ベトナム にもオフィスを構えており、 ベトナム のエンジニアチームの育成と課題改善に年に数回 ベトナム に出張します。 私も2度行ったのですが、2回目に初めて Uber (ウーバー)を使ったところ、とても便利だったので、そのご紹介です！ Uberってなによ？ 車が超快適 クレジットカードの支払いが超便利 話さなくても良いのが超便利 まとめ おまけ 参考 Uber ってなによ？ Uber はタクシーの配車サービスで、 スマホ のアプリでタクシーを呼び出して利用します。実際にタクシーを利用するまでの手順は以下の通りです。 スマホ で行き先を指定してタクシーを呼び出す よさそうなタクシーがいたら待ち合わせ場所を指定 行き先と金額を確かめて、確定する これだけ。 待っているときはどれくらいで到着するかアプリからわかります↓ キターーーーー↓ 支払いは現金かクレジットカード。クレジットカードは情報をあらかじめアプリに登録しておきます。 残念ながら日本では規制とタクシーの二種免許が必要なため、ごく一部の地域を除いて Uber は使えません。 次からは実際に使ってよかった点3つ、紹介します！ 車が超快適 ベトナム のタクシーも日本のタクシー同様「いかにも！」という業務用の車ですが、 Uber では普通の乗用車がやって来ます。車に関してはハズレ無し。めっちゃ良い。実際、フォードの SUV が来たときもありました！ 実際に乗ったフォードの SUV ↓ ベトナム のタクシーは匂いが嫌だったり、タクシーの床が泥や砂で汚れていたりするので、 きれいな車を利用できる のはすごくいい。 クレジットカードの支払いが超便利 前述の通り、 Uber は乗る前に支払い方法(現金 or クレジットカード)を選択して利用します。現金の場合は目的地に着いたら支払う。これは万国共通、普通のタクシーと一緒。 クレジットカードで支払う場合は、ここが便利なのですが Uber が別処理でやってくれます。なので 運転手にクレジットカードを渡す必要すらなし！ 目的地に着いたら「カム・オン！」( ベトナム語 でありがとうの意味)と言って 車から降りるだけ！！ ところで、 ラク スは クラウド サービスを提供していますが、その中に経費精算のサービス「楽楽精算」があります。実は ラク ス社内でも楽楽精算を使っているのですが、楽楽精算の便利機能のひとつに クレカデータの連携 があります。 なので、会社決済のカードを登録しておいてカードで支払えば精算の手間も省ける！クレジットカードは複数登録できるので、会社の経費で精算ができるときは会社のカード、プライベートは個人のカードで使い分けできます！ 閑話休題 Uber では乗る前にあらかじめ料金が決まるので ボッタクリに遭う心配は皆無 ですし、さらにクレジットカードでの支払いにしていれば キャッシュレスになるので、超便利 です！ しかも・・・運賃も通常のタクシーと比較して20%から30%程度安い！これは利用しない手は無いですぜ、ダンナ。 話さなくても良いのが超便利 一般的に ベトナム人 は ベトナム語 以外は通じません。それはタクシーの運転手といえども同じ。なので、行き先を伝えるのにひと苦労。ホンマに伝わっているか、行きたいこところに連れて行ってくれるか？ホンマに不安になります。 でも、 Uber なら乗る前に行き先を指定しているので、 運転手に行き先を伝える必要はありません！ しかも、今どこを走っているかが、アプリの画面を見ればわかるので不安になることはありませんでした。 行き先に向かっているときのアプリの画面↓ この「話さなくても良い」というのはほんとにストレスを減らしてくれる。っていうかなくしてくれました。 まとめ 良いことばかり言いましたが、悪いところもあります。それはたまに ハズレの運転手に当たる ということ。 私は前回の出張で合計5回 Uber を利用しましたが、最後の5回目でハズレを引いてしまいました。 車の運転が初心者みたいで「慣れていない」というのががんがん伝わってきて「これは事故るな」と。 幸い事故に遭うことはありませんでしたが、このときはさすがに「まじかー」って思いました。 Uber は欧米ではいろいろ防犯上の問題が発生しているみたいですが、 ベトナム ではそんな印象は受けませんでしたし、実際にどこかに連れていかれそうになるとかはありませんでした。前述の通り、アプリでどこを走っているか、目的地に向かっているかわかるので、一定以上の「安心感」があります。 さていかがでしたでしょうか？ Uber の便利なところが伝わりましたでしょうか？？日本では使えない Uber ですが、もし、海外で利用する機会があれば使ってみてください(あ、でも、利用される方は自己責任でお願いしますね)。 おまけ ラク スでは 中途採用 を行っています。 ベトナム のエンジニアと一緒に自社サービスの開発を行ったり、 ベトナム に出張も場合によってはあります。 気になる方は下記をご覧になってください。 ラク ス 中途採用 ページ トップページ | 株式会社ラクス 中途採用 もちろん新卒採用も行っています。 ラク ス新卒採用ページ http://fresh-recruit.rakus.co.jp/ 参考 以下記事に出てきた企業のサイトです。 ・ Uber ・ 楽楽精算 ・ ラクスベトナム

はじめに 皆さん、こんにちは、今年の4月に入社したプログラミング未経験者のr_yxkxrx13です。 プログラミング超初心者！！ という方は、プログラミングの学習を始める前に何を準備して取り組めば分からない…ということが多いと思います。 プログラミング未経験である私が今まで取り組んだプログラミングの学習方法を紹介したいと思います。 はじめに プログラミング学習方法 コンピュータとネットワークの基礎学習サイト プログラミング学習サイト 書籍学習 プログラミング学習の取り組み方 終わりに プログラミング学習方法 私が今まで取り組んできたプログラミング学習方法は、「コンピュータ基礎／ネットワークの基礎学習サイト」、 「プログラミング学習サイト」、「書籍学習」の3つです。 学習サイトとは、ブラウザ上に無料で気軽に利用できるサイトのことで、インターネットにたくさん出ています。 まずはそのようなサイトを利用して学習を始めるのが良いと思います。 また書籍学習で基礎知識の理解を深めながら、プログラミングの練習をすると良いと思います。 私が利用した学習サイトと書籍について説明します。 コンピュータとネットワークの基礎学習サイト プログラミング学習の初めに「コンピュータ基礎／ネットワーク」を学習しました。 プログラミングの基礎なので、基礎知識と概念を理解しておくと良いと思います。 【5分で覚えるIT基礎の基礎】コンピュータの仕組み---目次 | 日経クロステック（xTECH） 「コンピュータの仕組み」をテーマに基礎知識の全体像と概要を分かりやすく解説されています。 初心者のためのネットワーク技術 - ネットワークエンジニアを目指して 「ネットワーク技術」をテーマに基礎知識を分かりやすく解説されています。 プログラミング学習サイト プログラミングの参考本では、決まった書き方やコードの意味がたくさんあり、全部覚えられない…。 とつまづいてしまうことはあると思います。 私の経験の1つですが、正直に言って、全てを一気に覚えることは無理があります。 逆に理解度が低くなってしまうので意味がありません。 まずプログラミングを書く練習をたくさんすると、自然に覚えられるようになってきます。 また1行ずつコードの意味を コメントアウト してみると、理解が深まってきます。 そこで、ブラウザ上で実際にプログラミングを作る環境と似た環境で練習できるサイトを紹介します。 Progate （画像出典： Progate ） Progateは、ブラウザ（インターネット）上でプログラミングが学べるサービスです。 イラストを中心に分かりやすく解説されたスライドで、自分のペースに学習や復習ができます。 また以下のようにブラウザ上でコードを書いて結果を確認することができます。 複雑な環境設定などの準備は不要なので、気軽にプログラミング学習を始めれます！ 初心者レベルから実践レベルまで対応されていて、 さらにレッスンの種類もたくさんあり、分かりやすく楽しみながら学べるサイトです。 ドットインストール （画像出典： ドットインストール ） ドットインストールは、約3分間の短いレッスン動画でプログラミングを学べるサイトです。 動画の音声が聞き取りづらくても動画画面の下に字幕があるので、見返すことができます。 また右側に学習メモの機能があり、新しい知識や疑問をメモすることができます。 動画を見ながら、実際に作ってみることを重点において学習すると良いでしょう。 CodeResume （画像出典： CodeResume ） CodeResumeは、ブラウザ上でプログラミングが学習できるプラットフォームです。 練習問題の画面では、以下の図のように解答欄にコードを書き込んで、 コンパイル と実行で結果を確認できるようになっています。 またタイマー機能も付いているので、時間を意識して考えて解く力が身についてくると思います。 書籍学習 学習サイトだけでは学習範囲が限られていますが、書籍での学習も有効な学習方法だと思います。 私が利用した書籍の中からオススメの書籍を紹介します。 スッキリわかる Java 入門 第2版 (スッキリシリーズ) スッキリわかるJava入門 第2版 (スッキリシリーズ) 作者: 中山 清喬 , 国本 大悟 発売日: 2014/08/07 メディア: 単行本（ソフトカバー） 本書は、 Java の基本を丁寧にイラストと同時に説明されていますので、非常にわかりやすい内容になっています。 Java の複雑な開発準備や必要なツールって分からない…。という方、安心して下さい。 Webブラウザ を持つ携帯電話やパソコンで、準備された クラウド 開発実行環境「dokojava」を使って、手軽にプログラミングの練習ができるようになっています。 また「dokojava」の他に、実際に開発現場で使われている「Ecplise」のインストール方法や使い方まで書かれています。 Java の学習を始める時は、まずこの本を読んでおくことをオススメします！ スッキリわかる Java 入門 実践編 第2版 (スッキリシリーズ) スッキリわかる Java入門 実践編 第2版 (スッキリシリーズ) 作者: 中山 清喬 発売日: 2014/09/22 メディア: 単行本（ソフトカバー） 本書は、 Java 入門の実践編で開発や設計手法、ツールの知識について、分かりやすく解説されています。 Java の応用技術まで紹介されているので、 Java の基本をマスターした方は、さらにステップアップで学びたい時に読むことをオススメします！ Java ルールブック 〜読みやすく効率的なコードの原則 Javaルールブック　～読みやすく効率的なコードの原則 作者: 大谷 晋平 , 米林 正明 , 片山 暁雄 , 横田 健彦 発売日: 2011/02/15 メディア: 単行本（ソフトカバー） コードの書き方について大変参考になる本です。 正しい書き方と間違った書き方の例を挙げて分かりやすく解説されています。 正しいコードの書き方を身につけると、シンプルで見やすいコードが書けるようになります。 リーダブルコード リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (Theory in practice) 作者: Dustin Boswell , Trevor Foucher 発売日: 2012/06/23 メディア: 単行本（ソフトカバー） Java ルールブックと同様にコードの書き方について、さらに具体的に丁寧に解説されています。 プログラミング学習の取り組み方 ここまでは学習サイトや書籍を紹介してきましたが、 以下については私が有効だと感じた具体的な学習方法と心構えについて説明します。 学習内容を読むだけにしない 学習内容を読んで満足するだけでは理解が深まりません。 学習内容を読んで実際に操作して動作を確認してみる、疑問になったことを納得するまで深く掘り出すことが大切です。 コードを1行1行にコメントをつける プログラミングの経験が長い方が書いたコードは、必要な情報だけコメントしています。 プログラミング未経験の方は、まだコードの意味や書き方に慣れていないので、 まずコードの意味を理解することから始めると良いでしょう。 慣れてきたら、少しずつコメントを減らして、コードを読める・書けるようにすると良いと思います。 コードが完成したら デバッグ をする プログラムを実行して結果が正しくても完成とは限らないです。 本当に問題がないかどうか、 デバッグ をして修正箇所がないか確認をするように心掛けましょう。 処理の流れを把握できるようになってきたら、 デバッグ 機能に頼らず、自分の目で確認してみましょう。 エラーの原因と対策方法を見つける プログラムのバグ（故障・エラー）を見つける力と対策方法の知識を身につけることが大切です。 例えば、プログラムが完成してバグに気付かないまま、共同者のプログラムを合わせると、 トラブルを起こしてしまう可能性があります。 このようなトラブルが起きた時、どこにバグがあるか、どのように対策をすれば解決できるか、 実際にプログラミングの練習でテストしてみると良いでしょう。 またプログラムを作成する時は、バグがないプログラムを完成するように心掛けて書くようにしましょう。 サンプルプログラムを鵜呑みにしない コードが書けない…という方は、インターネットや書籍にサンプルプログラムを参考にしていますが、 丸ごとコピーして修正するやり方は良くないことです。 サンプルプログラムを書き写して目的に合わせて修正し、動作の理解を深めることが良いでしょう。 プログラミングの練習をできるだけ毎日やる スポーツと同じように、プログラミングを書く練習を毎日取り組むと、自然にコードの意味や書き方が分かるようになってきます。 最初は慣れなくて大変ですが、書籍や学習サイトを参考にしながら、書く練習をすると良いでしょう。 プログラミングのツールを試してみる プログラミングのツールは、代表的なものだけではなく、あまり知られていないものや最近新しくできたツールを 試しに使ってみて比較することも大切です。 プログラミングの進化が続いているので、新たな知識をたくさん吸収すると良いでしょう。 簡単なものを開発してみる 私の場合は、HTML／ CSS の学習をしながら、自分のホームページを制作しました。 学習で学んだことを活かして、ホームページやアプリを開発してみると、楽しくやりがいがあると実感できます。 プログラマー と情報交換をする プログラミング経験者は、技術情報やプログラミングの学習などたくさんの情報を持っています。 疑問や悩みまで相談できるので、 プログラマー の仲間を作ることも大切です。 終わりに プログラミング未経験者向けの学習方法と取り組み方を紹介しました。 紹介した学習方法の他にもたくさんありますので、 自分に合った方法を見つけて、是非プログラミングの学習を始めてみてください！

はじめに 皆さん初めまして、新卒一年目のFM_Harmonyと申します。 今回はマルチブラウザという観点から、 最近の JavaScript について調べました。 jQuery の登場や、主要なブラウザが標準仕様への準拠を進めたことで、エンジニアが JavaScript の動作環境を気にすることが、以前に比べ減りました。しかし調べていくと、今後は トランスパイル や AltJS による対応が、 JavaScript において必要になっていくのだということが分かりました。 このまとめが、 最近Webアプリケーション開発に関わりはじめた方 や、 今後の JavaScript について興味のある方 にとって、少しでも参考になれば幸いです。 目次 はじめに 目次 本題の前に マルチブラウザ？クロスブラウザ？ これまでのマルチブラウザ対策 JavaScriptとブラウザ マルチブラウザ対策としてのjQuery 各ブラウザの対応 これからのマルチブラウザ対策 ES6とIE11 トランスパイル AltJS まとめ 注釈 本題の前に マルチブラウザ？ クロスブラウザ ？ この記事では、「 複数のブラウザに対応すること 」を マルチブラウザ という言葉で表現します。サポート期間の終了したブラウザは、対応しないというのがその理由です。マルチブラウザは クロスブラウザ と混同される概念ですが、簡単に言うと次のように分けられることが多いようです。 マルチブラウザ アプリケーションの作成元が 推奨するブラウザ で、動作することを保証する クロスブラウザ すべてのブラウザ で動作することを保証する 例えば、 Google Chrome ( Chrome )は自動的にアップデートが行われます。そのため、古いバージョンが使われることはまずありません。ゆえに、この記事ではマルチブラウザという言葉を使うことにします。 クロスブラウザ とマルチブラウザの違い これまでのマルチブラウザ対策 JavaScript とブラウザ JavaScript には、 ブラウザごとに異なる実装 が存在しています。これが、マルチブラウザ対策が必要な理由です。私たちが普段 JavaScript と呼んでいるものは、 ECMA *1 Script (ES)という標準仕様を実装した言語を指します。そして、それは ブラウザごとに異なる環境 （エンジン）で動作します。また、その実装に ブラウザ独自の拡張 を行うことが、ある程度許容されています。ゆえに、 JavaScript を扱うときはブラウザごとの違いに注意しなければならなかったのです。 エンジニアはブラウザの違いを意識しなければならない マルチブラウザ対策としての jQuery しかし、現在では開発中にブラウザ間の差異を意識することは、まず無いでしょう。一昔前まで、エンジニアはブラウザごとに JavaScript の記述を変える必要がありました。ユーザがどのブラウザを使っているか検知し、記述を変えていたのです。 ところが、 jQuery というライブラリの登場により状況は変わります。このライブラリが、 ブラウザ間の違いを吸収する ことにより、アプリケーションをマルチブラウザ化する難易度が格段に下がりました。そのため、マルチブラウザ対策として、 jQuery を用いることが多々ありました。 エンジニアはブラウザの違いを意識せずに済む 各ブラウザの対応 ですが、ここ数年の間に各ブラウザがESへの対応を積極的に行ったことで、 jQuery によってマルチブラウザ対策を行う必然性が薄れていきました。特に今年に入って、 IE が IE11より前のブラウザに対するサポートを終了 したため、 ES5までの標準仕様 であれば、どのブラウザでも利用できるようになりました。機能面でのマルチブラウザ対策を考える必要は、基本的に無くなったといっても良いでしょう。 各ブラウザのES5への対応 　　(出典： http://kangax.github.io/compat-table/es5/ ) これからのマルチブラウザ対策 ES6とIE11 少し話は変わりますが、現在メジャーな標準仕様は ECMAScript2015 (ES6)とされています。この仕様には、アロー関数やPromiseといったエンジニアにとって魅力的な構文が多く含まれています。そのため、今後ES6に準拠した JavaScript の記述が増えていくと思われます。（参考: ECMAScript 6: New Features: Overview and Comparison ） しかしES6は、IE11において仕様の 11% しか実装されていません。他のブラウザでは、 ほぼ100%実装されている のにもかかわらずです。IE11のサポートは2025年まで続く *2 ため、マルチブラウザ対策として 古い記述 を残す必要があります。 各ブラウザのES6への対応 　　(出典： http://kangax.github.io/compat-table/es6/ ) トランスパイル ここで登場するのが、 トランスパイル という技術です。先ほども述べましたが、ES5はIE11や Chrome など主要なブラウザでの実装が完了しています。そこで、実際の開発はES6に準拠したコードで行い、アプリケーションに組み込む段階で、コードを 機械的 にES5へ変換するという手法が考えられました。この変換する技術をトランスパイルといいます。コードを変換する トランスパイラ として代表的なものに、 babel があります。 トランスパイルのイメージ（babel公式サイトより） 　　（画像出典： Babel · The compiler for next generation JavaScript ） AltJS また、トランスパイルと近い考え方に、 AltJS *3 を利用するというものがあります。AltJSとは、その名の通り JavaScript の代替言語です。代表的なものに TypeScript や CoffeeScript などが存在します。これらの言語には、ES6に対応した実装が多く含まれており、ES6に準拠した JavaScript の代わりとして使うことができます。そして、 JavaScript に変換してアプリケーションに組み込むことができるのです。 AltJSの一つ、TypeScript 　（画像出典： TypeScript: JavaScript With Syntax For Types. ） まとめ jQuery や各ブラウザの対応によって、 JavaScript の機能面でのマルチブラウザ対策は難易度が下がりました。一方で Ecma はES6以降、標準仕様を 毎年改定する と発表しています。それに伴い、今後さまざまな仕様やそれに伴った記述が増えていくことでしょう。ですが、IE11におけるES6の現状を見ても、他のブラウザに比べて IE の対応が遅れることは、間違いないと思います。 ES6やその先の ECMAScript に対応した記述を、開発効率向上のために導入するならば、マルチブラウザ対策として、 トランスパイルやAltJSから避けることができません。 ESの更新が活発な今だからこそ、これらを導入してはいかがですか？ エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com 注釈 *1 : European Computer Manufacturers Associationの略 *2 : Windows10のサポートが終了するのが2025年のため *3 : Alternative JavaScript の略

はじめに みなさん こんにちは、Thuatと申します。今年 ラク スに入社しました１年目です。 この記事ではセッション管理としてRedisを使用するケースを紹介します。 Redisとは？ Redis は簡単に言うと、メモリ上のKey- Value ストアです。 メモリ上にデータを格納しますので高速に動作します。 以下はインストールから簡単なデータの登録・取得までの手順になります。 Redisをインストールする $ wget http://download.redis.io/releases/redis-4.0.1.tar.gz $ tar xzf redis-4.0.1.tar.gz $ cd redis-4.0.1 $ make Redisサーバーを起動する $ src/redis-server 33507:C 25 Sep 23:21:32.201 # oO0OoO0OoO0Oo Redis is starting oO0OoO0OoO0Oo 33507:C 25 Sep 23:21:32.202 # Redis version=4.0.1, bits=64, commit=00000000, modified=0, pid=33507, just started 33507:C 25 Sep 23:21:32.202 # Warning: no config file specified, using the default config. In order to specify a config file use src/redis-server /path/to/redis.conf 33507:M 25 Sep 23:21:32.203 * Increased maximum number of open files to 10032 (it was originally set to 256). _._ _.-``__ ''-._ _.-`` `. `_. ''-._ Redis 4.0.1 (00000000/0) 64 bit .-`` .-```. ```\/ _.,_ ''-._ ( ' , .-` | `, ) Running in standalone mode |`-._`-...-` __...-.``-._|'` _.-'| Port: 6379 | `-._ `._ / _.-' | PID: 33507 `-._ `-._ `-./ _.-' _.-' |`-._`-._ `-.__.-' _.-'_.-'| | `-._`-._ _.-'_.-' | http://redis.io `-._ `-._`-.__.-'_.-' _.-' |`-._`-._ `-.__.-' _.-'_.-'| | `-._`-._ _.-'_.-' | `-._ `-._`-.__.-'_.-' _.-' `-._ `-.__.-' _.-' `-._ _.-' `-.__.-' 33507:M 25 Sep 23:21:32.206 # Server initialized 33507:M 25 Sep 23:21:32.206 * DB loaded from disk: 0.000 seconds 33507:M 25 Sep 23:21:32.206 * Ready to accept connections Redisのポートはデフォルトで6379になります。 クライアントからGET/SETする Redisにあらかじめ組込まれているクライアントツールからデータをGET/SETしてみましょう。 シンタックス は以下になります。 set key value get key $ src/redis-cli 127.0.0.1:6379> set key1 10000 OK 127.0.0.1:6379> get key1 "10000" 127.0.0.1:6379> Value は JSON でも保存できます。 127.0.0.1:6379> set user_info '{"username":"taro", "age":20}' OK 127.0.0.1:6379> get user_info "{\"username\":\"taro\", \"age\":20}" 127.0.0.1:6379> Redisは メモリ上にデータを格納しますので、デフォルトはサーバーを停止、再起動した場合は、データが失われます。 Redisはどのような時に利用すればよいでしょうか。 最適な ユースケース はキャッシュやセッション管理です。 セッション管理としてRedisを使用する セッションとは？ セッションはクライアントとサーバの通信の状態をWebサーバー上に保持されます。クライアントはセッションIDをURLやクッキー経由でサーバに渡します。 Key- Value 構造としてメモリ、ファイル又はDBに格納します。KeyはセッションID、 Value はセッションに保存したいデータです。 デフォルトではセッションは Webサーバーのメモリ上に保持されます。 Webサーバー単独でセッション管理を行う場合はWebサーバーのロードバランサを構成できません。 セッションをDBに格納する設定にすると、ロードバランサを構成することができますが、パフォーマンスに影響します。 セッションについては、 https://blog.takanabe.tokyo/2014/12/%E3%82%BB%E3%83%83%E3%82%B7%E3%83%A7%E3%83%B3%E7%AE%A1%E7%90%86%E3%81%AE%E5%91%A8%E8%BE%BA%E7%9F%A5%E8%AD%98%E3%81%BE%E3%81%A8%E3%82%81/ を参照ください。 Redisを使ってセッションを管理する データをセッションではなくて Redisで管理する方法を紹介します。 Redisにはセッションのように タイムアウト 時間を設定できます。 タイムアウト 時間を超えた場合はRedisに保存したデータが自動的に削除されます。 以下の機能を Java で実現してみます。 ユーザのデータを JSON で保存する タイムアウト は３分に設定する Java でのRedisクライアントは多くありますが一番人気はJedisです。 https://github.com/xetorthio/jedis/wiki/Getting-started プロジェクトのLibrariesにjedis-2.9.0.jarを追加してください。 http://search.maven.org/remotecontent?filepath=redis/clients/jedis/2.9.0/jedis-2.9.0.jar jedis-2.9.0.jar を追加する フォルダの構成は以下のようになります Userクラスを作成します。 package jp.co.jedis; public class User { private String username; private String address; public User(String username, String address) { this.username = username; this.address = address; } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getAddress() { return address; } public void setAddress(String address) { this.address = address; } @Override public String toString() { return "{'username':'"+this.username + "' , 'address':'"+ this.address + "'}"; } } UserActionクラスを作成します。 ユーザーのデータをRedisに保存するためのクラスです。 3分後、自動にExpireされるように設定します。 KeyはユニークなUUID、 Value は JSON でのユーザーのデータです。 package jp.co.jedis; import java.util.UUID; import redis.clients.jedis.Jedis; public class UserAction { private static final int TIMEOUT = 3*60; //3分 public static void main(String[] args) { String userToken = UUID.randomUUID().toString(); System.out.println("user token: " + userToken); Jedis jedis = new Jedis("localhost"); User user = new User("tanaka", "Tokyo-shibuya"); //3分後、無効になる jedis.setex(userToken, TIMEOUT, user.toString()); jedis.close(); } } Eclipse で実行してみましょう。 Redisのクライアントで確認しましょう。 127.0.0.1:6379> get a62a05d0-1efe-4d09-99f1-4289ff1511a6 -> 3分以内の場合 "{'username':'tanaka' , 'address':'Tokyo-shibuya'}" 127.0.0.1:6379> get a62a05d0-1efe-4d09-99f1-4289ff1511a6 -> 3分以上の場合 (nil) 127.0.0.1:6379> a62a05d0-1efe-4d09-99f1-4289ff1511a6 は生成されたKey、ユニークなUUIDです。 セッション管理としてRedisを使用するメリットは以下になります。 メモリ上に格納するのでパフォーマンスがよい Webサーバーの負荷が減る 別サーバーでセッション管理するので、Webサーバーのロードバランサを問題なく構成することができる ロードバランサを構成するには以下のような構成となります。 最後に セッション管理としてRedisを使用する方法や Java でRedisにアクセスする方法を紹介しました。 Redisはまだたくさんオプションがあります。 例えば接続数ハンドル、 トランザクション 、 クラスタ ーなどをもっと知りたい方は https://github.com/xetorthio/jedis/wiki を参照ください。 参考資料 https://blog.takanabe.tokyo/2014/12/%E3%82%BB%E3%83%83%E3%82%B7%E3%83%A7%E3%83%B3%E7%AE%A1%E7%90%86%E3%81%AE%E5%91%A8%E8%BE%BA%E7%9F%A5%E8%AD%98%E3%81%BE%E3%81%A8%E3%82%81/ Redis Home · redis/jedis Wiki · GitHub エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 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

はじめに 皆さんこんにちは、rs_tukkiです。今年新卒で ラク スに入社しましたピッカピカの一年生です。 普段仕事や授業に取り組んでいると、「あれ、この単語どういう意味だろう？」と思っても、さも知ってて当然かのように話が進むせいでなかなか聞けなかったりすることありますよね。大丈夫です。 私も割と多いです。 そんな「今更聞けない」言葉ですが、皆さん、こんな単語をご存知でしょうか。 「 クラウド 」 …はい、おそらく、知らない方はいないはずです。ですが、 「 クラウド サービスとか、最近よく聞くけどどんなサービスなの？」 「なんかデータを預けるとか聞いたことがあるけど、いざ質問されるとわからないな」 という方も多いでしょう。 そこで今回は、 ラク スのシステムの根幹を担う「 クラウド 」が、どんなサービスなのかということについて、一から解説していこうと思います。 目次 はじめに クラウドとは？ 概要 クラウドという名前が生まれた背景 クラウドの使用例 クラウド使用によるメリット・デメリット 個人向けクラウドサービスのメリット 個人向けクラウドサービスのデメリット 企業向けクラウドサービスのメリット 企業向けクラウドサービスのデメリット クラウドサービスの分類 SaaS(Software as a Service) PaaS(Platform as a Service) IaaS(Infrastructure as a Service) おわりに クラウド とは？ 概要 さて、 クラウド についてネットで調べてみると、たまにこういう記述が見つかります。 「 クラウド の定義はとても曖昧です」 「定義や意味は曖昧である」 …さすがにこれでは元も子もないですね。 ですが、なんとか一言で「 クラウド 」を説明するのであれば、おそらく 「ユーザ一人ひとりがソフトやサーバを用意しなくても、ネットワークを通じてそれらを使うことが出来る、という考え方」 とするのが正しいと思います。 私たちが今までサービスを利用するには、専用のソフトウェアをインストールしたり、サーバを一から作る必要がありました。それが、 クラウド によって「どこにあるか分からないけど、ネットワークの中から、必要な時に必要な量を取り出して利用する」ようになったのです。 クラウド という名称ですが、どこにあるかは分からない、けどどこかにある、というイメージが雲(=cloud)の中を手探りで操作しているように見えた、とか、ソフトやサーバを一極集中させていることから、ユーザがそこに群がっている(=crowd)ように見えた、など単語の意味自体には諸説あるようです。 クラウド という名前が生まれた背景 「 クラウド 」という言葉を最初に使用し始めたのは、当時の米 Google 社 SEO エリック・シュミット 氏だと言われています。これは2006年8月のことですが、実は有名な クラウド サービスの一つである Gmail は、2004年には既に稼働が始まっていました。 つまり クラウド という言葉は、技術の登場と同時に誕生したのではなく 「元々存在していた技術に名前を付けたもの」 ということになります。 なぜ、わざわざ名前を付けるようなことをしたのでしょうか。 それは、当時多くのサービスが「 クラウド ではなかった」からなのです。例えば、ワードやエクセル、パワーポイントなどのアプリケーション。これらは、当然自分のパソコンの中にインストールしなければ使えませんし、作成したデータも(USBなどの外部領域を使わないのであれば)一般的には、そのパソコンの中に保存しています。 このような非 クラウド なサービスでも問題はないのですが、 Gmail などの誕生を機に「この形式でサービスを作れば、より便利になるんじゃないか」という流れが生まれました。そのため、「ユーザがそれぞれの領域にソフトやデータを確保する」という今までの使い方に対して、これからは「ネットワークにソフトやデータを配置して、場所は分からないけど簡単に使えるようにしよう」、ということを簡単に表す言葉として、「 クラウド 」が使われ始めたのです。 クラウド の使用例 さて、実際の クラウド の使用例についてですが、先ほど挙げた Gmail などのメールサービスをもとに説明します。 私たちがメールを送る際は、パソコン上でメールを作成や送受信を行うための「メールソフト」と、実際に送受信を制御するための「メールサーバ」が必要です。 メールソフトは Outlook や Becky! 、 Thunderbird などのソフトをインストールすればいいのですが、メールサーバの構築を クラウド なしで実現しようとすると結構大変です。企業であれば社内のメールサーバを持っているところもあるものの、個人で構築するのは手間ですし、あまり意味はありません。 一方、 Gmail や Hotmail などの、 クラウド サービスとして提供されているメールサービスでは、私たちユーザが用意するものは「インターネットに接続できるブラウザ」だけで十分です。ソフトのインストールも、サーバの構築も必要なく、 「どこにあるかはわからないけど、どこかにあるソフトとサーバを使わせてもらう」 ことで、メールの送受信を実現しているのです。 クラウド 使用によるメリット・デメリット ただ、 クラウド サービスは便利なだけではなく、当然デメリットも存在します。個人向け、企業向けの クラウド サービスごとに、主な例を挙げて説明します。 個人向け クラウド サービスのメリット どこからでも、どんな端末からでもアクセスできる 企業、個人問わず、 クラウド サービスにおいて最もメリットを体感できるのはこれだと思います。わざわざSDカードや USBメモリ を使ってデータを移し替えなくても、データはインターネット上のサーバに保存されていますから、他のデ バイス でもログインするだけでデータの共有が可能になります。買い物に行くとき、自宅のパソコンで欲しい商品を調べてメモしておいて、それを スマートフォン で確認する、といったことが可能になります。 更新作業が不要 パソコンでも スマートフォン でも、インストールして使用するタイプのソフトは、定期的なアップデートが必要でした。ですが、 クラウド サービスはソフトの更新をサーバ側で行ってくれるため、煩雑な更新作業や、それに伴うシステムの不具合に悩まされる必要もなくなるのです。 個人向け クラウド サービスのデメリット データ漏洩・紛失の可能性 クラウド はインターネット上にデータを保管するわけなので当然と言えば当然なのですが、ログイン情報の流出や、その他サーバ側の不手際によって、簡単に個人情報が流出してしまう可能性があるわけです。前者はともかく、後者は使用者にとってはどうしようもないので、信頼のおけるサービスを使うようにしましょう。 また、サーバ障害、サービス自体の廃止など、 クラウド 上に保存しておいたデータがいつのまにかなくなっていることも考えられます。大切なデータは、自分の手元にバックアップを取るようにした方が無難です。 企業向け クラウド サービスのメリット どこからでも、どんな端末からでもアクセスできる 先ほど個人向けでも説明した内容と同じです。ネット環境さえあれば、たとえ出張先でも使えます。 コスト削減 ここでいう「コスト」とは、「初期コスト」と「保守・管理コスト」の2種類に分けられます。 クラウド を用いず、自社でサーバやシステムを用意しようとすると、どうしても最初の環境整備や、稼働開始後の保守・管理に費用や人員を割かなければいけません。しかし、 クラウド サービスにおいては、特に小規模のシステムで初期費用が抜群に軽減されるほか、煩雑なアップデート作業も管理会社が請け負ってくれるため、そのためのコストも削減が見込めるのです。 企業向け クラウド サービスのデメリット データ漏洩の可能性 個人向けでも説明した内容ですが、企業向けの クラウド サービスでは扱うデータの性質上、よりハッキングの攻撃対象になりやすいというリスクがあります。当然企業向けの有料サービスであれば管理会社が何らかの対策はしてあるでしょうが、その面もきちんと確認しておくのが堅実かと思います。 クラウド サービスの分類 ここまで説明してきた クラウド サービスの提供形態ですが、実は更に細かく分類することができます。 SaaS (Software as a Service) SaaS は、 クラウド によってソフトウェアを提供するサービスのことです。先ほど例として挙げた Gmail や、 Google Drive などのサービスは代表的な SaaS と言えるでしょう。 その他、個人向けでは DropBox 、企業向けでは Salesforce など、普段から皆さんがよく使っている「 クラウド サービス」は、ほとんどがこの SaaS だと思います。 PaaS(Platform as a Service) PaaSとは、 クラウド によって開発環境を提供するサービスのことです。有名なところだと Google App Engine や Microsoft Azureなどがあります。 SaaS とは違い、PaaSとIaaSはエンジニア以外が使うことはあまりないと思います。利用者は提供された開発環境の上で ウェブサービス を開発し、更に提供しているのです。 IaaS(Infrastructure as a Service) IaaSとは、 クラウド によってサーバを提供するサービスのことです。各種 レンタルサーバ などはIaaSに含まれます。 PaaSより更に範囲が狭まって、サーバのみの提供となっていますが、開発環境から自分で用意できるため、自分の好きなプラットフォームで開発したい、という人はこちらを使うことになります。 おわりに 最近よく聞くけど、改めて考えてみるとイメージのつかめない「 クラウド 」という言葉について解説しました。 私自身大学で クラウド システムを用いたゲームを開発していたことがあるので すが、意外と知らないことが多く苦戦しました 改めて勉強し直すいい機会になったと思います。 今回の記事で、少しでも皆さんの「？」が解消出来たら幸いです！ エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 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

はじめに 皆さんはじめまして。新人エンジニアの sts -250rrです。 本年度新卒として入社し、1年目の私ですがよろしくお願いいたします。 Git初心者である方の中には、Gitの大枠がどんなものかは知っているし、使ったこともある。 でも 機械的 に git status , git add -A としていたり、 git commit をしていた。 というような方もおられるのではないでしょうか？ （私はその口でした・・・） 各コマンドの正しい知識を持たずに 機械的 にコマンドを実行するのでは、 業務を行う上で正しい操作ができないことも考えられます。チームの開発ではなおさら御法度といえるでしょう。 私自身含め、そのような方が今後Gitで失敗をしてしまわないように手助けができればと思います。 本記事では、ローカル環境で作業をする際のGitの構成である リポジトリ やワークツリー・インデックスに関してまとめ、利用するコマンドがどのような操作であるのかを再確認していきます。 それらを把握したうえで、よく利用するGitコマンドをシーン別に分けて紹介し、コマンドによる操作のイメージを持っていただきたいと思います。 加えて、コミットの流れやコミットで失敗してしまったときの対処法も載せておきましたので、困ったときの参考になると幸いです。 はじめに リポジトリ・ワークツリー・インデックスって？ シーン別：よく使うGitコマンド 編集を確認したいとき 編集したものをリポジトリにコミットしたいとき addやコミットを取り消したいとき コミットするときの流れ コミットで失敗したとき おわりに リポジトリ ・ワークツリー・インデックスって？ Gitではローカルで作業する際に以下のような構成でプロジェクトを管理しています。 この部分の構成を理解していると、addやcommitによってどのような操作がなされるのかがわかってくるかと思います。 リモー トリポジ トリ[Remote repository] サーバに配置されており、複数人でプロジェクトを共有する場所。 *本記事での話題の対象ではありません。 ローカル リポジトリ [local repository] ローカル環境内でのプロジェクトのファイルや ディレクト リの変更履歴を記録する場所。 ヘッド[HEAD]：最新のコミット状態を示す。 インデックス[index] ローカル リポジトリ にコミットを行う準備をする場所。ワークツリーから登録された内容を git commit でコミットする。 インデックスが存在することで、ワークツリー内の必要のないファイルはコミットしないといったことができる。 ワークツリー[work tree] 実際に作業を行っている ディレクト リであり、編集を行った最新のファイルが存在する。 ここでの作業内容を git add することでインデックスに変更を登録する。 これらローカル内の3つの構成により、Gitではプロジェクトの管理が行われています。 この部分が理解できれば add や commit 、それらの操作を取り消す reset といった操作が理解しやすくなったのではないでしょうか。 シーン別：よく使うGitコマンド 前節まででローカル環境でのGitの構成の大枠は掴んでいただけたでしょうか？ 本節では、多様なgitコマンドの中からよく使うコマンドを3つのシーンに分けてまとめています。 逆引きのように利用していただけると幸いです。 編集を確認したいとき log git log ：最新までのコミットログを確認。 git log --oneline ：コミットログを簡潔に確認。 status git status ：ローカルで編集されたファイルの一覧を表示。 diff git diff ：インデックスとワークツリーの全ての差分を表示。 git diff ファイル名 ：インデックスとワークツリーのしてファイルの差分を表示。 編集したものを リポジトリ にコミットしたいとき add git add -A ：ワークツリーの内容をすべてインデックスに登録。 git add <ファイル名> ：編集した1ファイルのみをインデックスに登録。 git add <ファイル名1> <ファイル名2> ：複数の編集をインデックスに登録。 commit git commit ：インデックスの内容を全てコミットする。 git commit -m 'message' ：コミットと同時に1行メッセージを書く。 addやコミットを取り消したいとき reset git reset ：git addの内容を取り消す。 git reset --soft HEAD^ ：直前のコミットのみを取り消す。 git reset --hard HEAD^ ：現時点のインデックスやワークツリーごと直前のコミットを取り消す。 コミットするときの流れ 本節では実際コミットをするまでの流れを以下のTest. java ファイルと共に確認していきます。 public class Test { public static void main( String [] args) { } } Test. java にある編集を加えました。編集は正しく反映されているでしょうか？ 自身の編集が完了したら git status で現在の状態を確認します。 $ git status On branch master Changes not staged for commit: (use " git add <file>... " to update what will be committed) (use " git checkout -- <file>... " to discard changes in working directory) modified : src/test/ Test .java no changes added to commit (use " git add " and / or "git commit -a") Test. java に変更があったようです。ソース内ではどのような変更があったのか git diff で確認します。 $ git diff diff --git a/src/test/ Test .java b/src/test/ Test .java index 8e11c08..b625295 100644 --- a/src/test/ Test .java +++ b/src/test/ Test .java @@ -2 , 5 + 2 , 6 @@ package test; public class Test { public static void main( String [] args) { + System .out.println( " Test " );^ M } } 出力部分が追加されたようですね。ではこの編集をインデックスに登録しましょう。 確実にインデックスに追加したい自身の編集ファイルのみ git add src/test/Test.java で登録しましょう。 再度、現在の状態を確認します。 $ git status On branch master Changes to be committed: (use " git reset HEAD <file>... " to unstage) modified : src/test/ Test .java Changes not staged for commit: (use " git add <file>... " to update what will be committed) (use " git checkout -- <file>... " to discard changes in working directory) インデックスに登録されている様子が確認できました。 それではコミットしていきましょう。 $ git commit -m ' Test出力の追加 ' [master 2eb4313] Test出力の追加 1 file changed, 1 insertion(+) 問題なくコミットできたようです。 最後にコミットの履歴のログを確認しておきましょう。 $ git log --oneline 2eb4313 ( HEAD -> master) Test出力の追加 8823cc3 Test .javaの作成 97fde21 first commit ここまでの作業が完了すればローカルでの編集内容が履歴として記録されることになります。 以降は同様に編集→コミットしていけばよいわけですね。 個人的にコミットまでの注意点は git diff で変更差分を確認すること。 git add で必要のないファイルまでインデックスに登録しないこと この2点だと思っています。 この点を意識できているかどうかだけでも、Gitに対する理解が深まるのではないでしょうか。 コミットで失敗したとき 次に、今までやってきた「addやcommitをやり直したい」そんなときの流れを簡単に確認します。 例として、前節で行ったコミットが間違えていたのでなかったことにしましょう。 git reset のオプションを指定して直前のコミットをなかったことにします。 $ git reset --soft HEAD ^ ログやステータスを確認してコミットが取り消されていることと現在の状態を確認します。 $ git log --oneline 8823cc3 ( HEAD -> master) Test .javaの作成 97fde21 first commit $ git status On branch master Changes to be committed: (use " git reset HEAD <file>... " to unstage) modified : src/test/ Test .java 直前のコミット Test出力の追加 が取り消されています。 ここまでで、直前のコミットを取り消し、編集内容がインデックスに登録されているという状態が確認できました。 次にこのadd自体も取り消してみましょう。 この場合はオプション無しの git reset です。 $ git reset Unstaged changes after reset: M src/test/ Test .java $ git status On branch master Changes not staged for commit: (use " git add <file>... " to update what will be committed) (use " git checkout -- <file>... " to discard changes in working directory) modified : src/test/ Test .java no changes added to commit (use " git add " and / or "git commit -a") addされた内容がインデックスの登録から外れた様子も確認できました。 ここまでで直前のコミットを取り消し、編集内容も取り消しました。つまり、2つ前のコミットの状態まで戻ったことになります。ここからは引き続き作業を行っていきましょう。 おわりに 最初にも述べたように 機械的 に行う commit や add はGitを利用していく上で良いことではありません。 自身が利用するツールに関してはどのような利用方法があるのか、どのような操作であるのかを確認して利用していくと良いかと思います。 自身の学習を踏まえた記事ではありますが、読んで頂いた方々の参考になれば幸いです。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 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

デベロッパ ーのkyosimotoです。 Ansibleをバージョンアップ作業の自動化ツールとして導入するための手順、おすすめ構成などについて紹介させていただきます。 目次 目次 なぜAnsible どんな感じ？ Ansibleの基本 実行方法 実行イメージ マシン要件 ファイル構成 ディレクトリ構成（サンプル） playbook（サンプル） ファイル構成のポイント 検証環境の準備 検証環境の説明 検証用仮想マシンの構築手順 仮想サーバにSSH接続する Ansible実行環境の構築 Ansibleのインストール SSH接続設定 検証用仮想マシンのミドルウェアセットアップ WEBサーバの構築 (Apache2.2 + PHP7.1) DBサーバの構築(PostgreSQL9.6) WEB／DBサーバの連携チェック プロジェクトディレクトリ作成 バージョンアッププロジェクト用のディレクトリ作成 Inventoryの作成 Inventoryの作成（補足） Playbookの作成 ansible.cfgの作成 Roleの作成 ミドルウェアの起動 （補足）ミドルウェアの起動 ミドルウェアの停止 ミドルウェアのバージョンアップ playbookの実行 最後に なぜAnsible 私は担当サービスのバージョンアップ作業を自動化するため、シェルベースの スクリプト を開発・運用してきました。 スクリプト 導入により、ほとんどの作業は自動化され、運用コストは大幅に削減されました。 半面、バージョンアップ スクリプト の属人化が課題となっており、リリース時のトラブルが起きた場合に、作業担当者による 原因調査と復旧作業が難しい状態となっています。 シェルスクリプト で作成したバージョンアップ スクリプト には、 フレームワーク のような拘束力が無く、長い運用の中でイレギュラーケースに対応したコードやフラグが追加され、複雑化の道をすすみ続ける可能性があります。 さらには、今のところこの複雑化した スクリプト をポジティブに学習したいという人はいません。問題が起きたとしても、開発担当者に聞けばすぐに解決できるからです。 私は属人化を解消するためには、 シェルスクリプト による実装をやめ、学習コストが低く複雑なコードを生まない自動化ツールの導入が必要と考えており、この要件にマッチしたAnsibleを導入提案することになりました。 どんな感じ？ 今のところメリットと感じているのは下記３点です。 学習コストが低い 設定ファイルは YAML という形式で記述します。設定ファイルがシンプルで、初めての人でも内容をすぐに理解できると思います。 運用作業用のモジュールが充実していますので、プログラミング書くことも読むこともほとんどありません。 導入コストが低い 管理対象サーバには余計なツールやデーモンをインストールする必要がありません。 SSH と Python さえ使えれば、Ansibleからの操作が可能ですので、運用チームへも提案しやすいと思います。 運用コストが低い 少しの工夫で設定ファイルをそのまま手順書として扱うことができます。 Ansibleの基本 実行方法 Ansibleの実行コマンドは以下の通りです。 $ ansible-playbook -i { Inventory } { Playbook } Inventoryには、サーバ名や IPアドレス などの管理対象ノードの情報、Playbookには管理対象ノードで実行するタスクを記述します。 実行イメージ Ansibleは、上記コマンドを実行するとPlaybookの内容を Python のプログラムに変換します。 変換されたプログラムファイルは、Inventory（インベントリ）に記述された管理対象ノードに転送後に実行されます。 マシン要件 対象 要件 コン トロール マシン ・ Python 2 (version 2.6 or 2.7)、またはPython3（version 3.5以上）がインストールされている。 ・ Windows はサポート対象外。　　 (詳細) 管理対象ノード ・ SSH 接続できる。 ・ Python 2.6以上がインストールされている。　　 (詳細) ファイル構成 私のお勧めするファイル構成サンプルを紹介します。 ディレクト リ構成（サンプル） myapp_verup product.ini # inventory (本番環境のホスト名/IPを記述) staging.ini # inventory (ステージングのホスト名/IPを記述) development.ini # inventory (社内検証環境のホスト名/IPを記述) versionup.yml # playbook (バージョンアップ手順を記述) roles/ # 具体的バージョンアップ手順を実装するディレクトリ apacheを停止する/ apacheを起動する/ apacheをバージョンアップする/ cronを停止する/ cronを起動する/ postgresqlを停止する/ postgresqlを起動する/ postgresqlをバージョンアップする/ アプリケーションをバージョンアップする/ playbook（サンプル） 以下、playbookファイルの内容です。 - myapp_verup/versionup.yml --- - hosts : all roles : - cronを停止する - hosts : webservers roles : - apacheを停止する - apacheをバージョンアップする - phpをバージョンアップする - アプリケーションをバージョンアップする - hosts : dbservers roles : - postgresqlを停止する - postgresqlをバージョンアップする - postgresqlを起動する。 - hosts : webservers roles : - apacheを起動する - hosts : all roles : - cronを起動する ファイル構成のポイント ファイル構成を考える上で、お勧めするポイントは下記２点です。 playbookを日本語で記述する playbookのタスクを日本語化することで、設定ファイルの可読性が上がる、playbookがそのまま手順書／ドキュメントになるという点でメリットが大きいと考えています。 バージョンアップ作業に集中する。 バージョンアップ作業以外のタスクを含めないようにします。 例えば、サーバ構成管理や冪等性のための実装を行うと、Ansibleの設定は複雑化します。 複雑化は属人化を進行させますし、（Serverspecなど）ツールを使ったテストなども検討する必要がでてくるでしょう。 検証環境の準備 ここからは、Ansibleの検証用環境の構築手順について記載します。 検証環境の説明 仮想マシン の構築に Vagrant + Virtualbox を利用します。 検証用に構築するサーバは以下の通りです。 ホスト名 IPアドレス OS MW/Tool control 192.168.33.100 CentOS 6.9 Ansible web 192.168.33.101 CentOS 6.9 Apache2.2 + PHP7.1 db 192.168.33.102 CentOS 6.9 PostgreSQL9.6 別の ディストリビューション で検証したい場合は、 Vagrant Cloud よりboxイメージを検索し、後述する「 vagrant init」コマンドの引数に指定してください。 検証用 仮想マシン の構築手順 # Vagrantの作業用ディレクトリを作成します。 $ cd $ mkdir -p vagrant_work/ansible_test $ cd vagrant_work/ansible_test # Vagrantの作業用ディレクトリを初期化します。 $ vagrant init bento/centos-6. 9 # 出力されたVagrantfileをエディタで修正します。 $ vi Vagrantfile ----- # config.vm.box = "bento/centos-6.9" # この行をコメントアウトし、以下の設定をコピペする。 config.vm.define " control " do | node | node.vm.box = "bento/centos-6.9" node.vm.hostname = "control" node.vm.network :private_network, ip: " 192.168.33.100 " end config.vm.define " web " do | node | node.vm.box = "bento/centos-6.9" node.vm.hostname = "web" node.vm.network :private_network, ip: " 192.168.33.101 " end config.vm.define " db " do | node | node.vm.box = "bento/centos-6.9" node.vm.hostname = "db" node.vm.network :private_network, ip: " 192.168.33.102 " end --- -- # 仮想サーバを起動します $ vagrant up # 仮装サーバが起動するまでしばらく待ちます。 仮想サーバに SSH 接続する $ vagrant ssh control # パスワードは「vagrant」 Windows の場合は、ターミナルソフトで接続します。 ホスト 192.168.33.100 user vagrant password vagrant Ansible実行環境の構築 Ansibleのインストールと SSH 設定の手順について記載します。 Ansibleのインストール # Vagrantの作業ディレクトリより仮想サーバにSSH接続します。 $ vagrant ssh control # パスワードは「vagrant」 # EPELリポジトリを追加 $ sudo yum install -y epel-release # Ansibleのインストール $ sudo yum install -y ansible # Ansibleのバージョン確認 $ ansible --version ansible 2 . 3 . 2 . 0 config file = /etc/ansible/ansible.cfg configured module search path = Default w/o overrides python version = 2 . 6 . 6 ( r266:84292, Aug 18 2016 , 15:13:37 ) [ GCC 4 . 4 . 7 20120313 (Red Hat 4 . 4 .7-17) ] SSH 接続設定 接続先サーバへの SSH 接続を簡単にするため SSH 設定を記述します。 $ vi ~/.ssh/config ------------ Host * StrictHostKeyChecking no UserKnownHostsFile=/dev/null Host web HostName 192.168.33.101 User vagrant Host db HostName 192.168.33.102 User vagrant ------------ # 設定ファイルのパーミッションを変更します。 $ vi ~/.ssh/config ------------ Host * StrictHostKeyChecking no UserKnownHostsFile=/dev/null Host web HostName 192.168.33.101 User vagrant Host db HostName 192.168.33.102 User vagrant ------------ # 設定ファイルのパーミッションを変更します。 $ chmod 600 ~/.ssh/config # SSHの公開鍵を登録します。 $ ssh-keygen -t rsa Generating public/private rsa key pair. Enter file in which to save the key (/home/vagrant/.ssh/id_rsa): # Enterキー入力 Enter passphrase (empty for no passphrase): # Enterキー入力 Enter same passphrase again: # Enterキー入力 Your identification has been saved in /home/vagrant/.ssh/id_rsa. Your public key has been saved in /home/vagrant/.ssh/id_rsa.pub. The key fingerprint is: # 秘密鍵と公開鍵が作成されます。 ~/.ssh/id_rsa ~/.ssh/id_rsa.pujb # 作成したSSH公開鍵を接続先サーバにコピーします。 $ ssh-copy-id web # パスワードは「vagrant」 $ ssh-copy-id db # パスワードは「vagrant」 # 接続先サーバにパスワードなしでアクセスできることを確認します。 $ ssh web $ hostname web $ exit $ ssh db $ hostname db $ exit 検証用 仮想マシン の ミドルウェア セットアップ バージョンアップ手順の検証用に、予め ミドルウェア をセットアップします。 WEBサーバの構築 (Apache2.2 + PHP7.1) # WEBサーバにSSH接続 $ ssh web # Apacheをインストール $ sudo yum install -y httpd # PHPをインストール $ sudo yum install -y epel-release $ sudo rpm -Uvh http://rpms.famillecollet.com/enterprise/remi-release-6. rpm $ sudo yum -y --enablerepo=remi-php71,epel install php php-cli php-common php-mbstring php-mcrypt php-pdo php-xml php-json php-devel php-pecl-zip php-pgsql $ sudo service httpd restart $ sudo chkconfig httpd on # テストページを作成してApache+PHPの連携確認 $ sudo vi /var/www/html/phpinfo.php -------------- < ?php phpinfo () ; -------------- # ブラウザから http://192.168.33.101/phpinfo.php にアクセスできることを確認 # SSH接続を終了 $ exit DBサーバの構築(PostgreSQL9.6) # DBサーバにSSH接続 $ ssh db # PostgreSQLのインストール $ sudo yum install -y https://yum.postgresql.org/ 9 . 6 /redhat/rhel-6.9-x86_64/pgdg-redhat96-9.6-3.noarch. rpm $ sudo yum -y install postgresql96-server # PostgreSQLの初期設置 $ sudo service postgresql-9. 6 initdb $ sudo vi /var/lib/pgsql/ 9 . 6 /data/pg_hba.conf -------------- # 末尾に追加 host all all 192 . 168 . 33 . 101 / 32 trust -------------- $ sudo vi /var/lib/pgsql/ 9 . 6 /data/postgresql.conf # 接続設定追加（59行目あたり) -------------- #listen_addresses = 'localhost' listen_addresses = ' * ' -------------- # PostgreSQLの再起動 $ sudo service postgresql-9. 6 start $ sudo chkconfig postgresql-9. 6 on # データベース＆テーブル作成 $ sudo su - postgres -c " psql " # ココからはSQLモード > \c test > create database test ; > create table t_staff ( id int, name text ) ; > insert into t_staff values ( 1 , ' あああああ ' ) , ( 2 , ' いいいいい ' ) ; > \q # SSH接続を終了 $ exit WEB／DBサーバの連携チェック # WEBサーバにSSH接続 $ ssh web # WEBサーバとDBサーバ間の疎通確認 $ sudo vi /var/www/html/ test .php --------- < ?php $connectString = " host=192.168.33.102 port=5432 dbname=test user=postgres " ; $conn = pg_connect ($connectString) ; $result = pg_query ($conn , " select * from t_staff " ) ; var_dump ( pg_fetch_all ($result)) ; --------- # ブラウザから下記URLにアクセスして、DBレコードが出力されることを確認 http:// 192 . 168 . 33 . 101 / test .php プロジェクト ディレクト リ作成 ファイル構成の項目で紹介したAnsibleプロジェクトを作成していきましょう。 バージョンアッププロジェクト用の ディレクト リ作成 # HOMEディレクトリにプロジェクトディレクトリを作成します。 $ mkdir ~/myapp_verup # フォルダを作成します $ cd ~/myapp_verup $ mkdir -p roles/apacheを停止する/tasks $ mkdir -p roles/apacheを起動する/tasks $ mkdir -p roles/apacheをバージョンアップする/tasks $ mkdir -p roles/cronを停止する/tasks $ mkdir -p roles/cronを起動する/tasks $ mkdir -p roles/postgresqlを停止する/tasks $ mkdir -p roles/postgresqlを起動する/tasks $ mkdir -p roles/postgresqlをバージョンアップする/tasks $ mkdir -p roles/アプリケーションをバージョンアップする/tasks Inventoryの作成 Inventoryでは、管理対象ノードのホスト名、または IPアドレス とグループの定義を行います。 ファイルはINIファイル形式で記述します。 myapp_verup/development.ini [webservers] 192.168.33.101 [dbservers] 192.168.33.102 Inventoryの作成（補足） Inventoryを本番環境用、ステージング環境用、開発環境用に分けて管理することで バージョンアップ対象の切り替えできるようにします。 以下サンプルです。 myapp_verup/product.ini (本番環境用） # 本番環境用のInventory [webservers] 192.168.34.101 192.168.34.102 192.168.34.103 [dbservers] 192.168.34.104 192.168.34.105 myapp_verup/staging.ini (ステージング環境用） # ステージング環境用のInventory # セクション名(グループ名)は同じでIPアドレスのみ異なる。 [webservers] 192.168.35.101 192.168.35.102 192.168.35.103 [dbservers] 192.168.35.104 192.168.35.105 Playbookの作成 Playbookには、バージョンアップ手順を記述します。 （どのサーバでどんなタスクをどのような順番で実行するかを記述します） myapp_verup/versionup.yml --- - hosts : all roles : - cronを停止する - hosts : webservers roles : - apacheを停止する - apacheをバージョンアップする - phpをバージョンアップする - アプリケーションをバージョンアップする - hosts : dbservers roles : - postgresqlを停止する - postgresqlをバージョンアップする - postgresqlを起動する - hosts : webservers roles : - apacheを起動する - hosts : all roles : - cronを起動する ファイルは YAML 形式となりますので、拡張子は「yml」、１行目は「---」としてください。 2行目以降にバージョンアップ手順を記述します。書き方のルールは以下の通りです。 セクション 解説 hosts inventoryに定義したグループ名を記述します。 "all"の場合、inventoryに記述した全サーバを対象に処理を実行します。 roles hostsセクションに指定したサーバで実行するタスクを記載します。 タスクは「◯◯を停止する」「◯◯を起動する」「◯◯をバージョンアップする」くらいの粒度で記述しておき、具体的な処理内容をroles配下のタスク名と同名の ディレクト リ配下に実装します。 ansible.cfgの作成 Ansibleの動作設定を記述するファイルで、INI形式で記述します。 - myapp_verup/ansible.cfg [defaults] # 実行時のログを出力するファイルを指定します。 log_path=/tmp/ansible.log [privilege_escalation] # タスクの実行ユーザをrootに設定します become = true become_user = root Roleの作成 Playbookのrolesディレクティブに記述したタスクの実態をroles ディレクト リの配下作成します。 例えば、「Cronを起動する」というタスクは、roles/Cronを起動する/tasks/main.yml に、処理内容を記述します。 ミドルウェア の起動 service コマンドが準備されている ミドルウェア （デーモン）であれば、「service」モジュールを使って以下のように記述します。 myapp_verup/roles/cronを起動する/tasks/main.yml --- - name : crondを起動する service : name : crond state : started myapp_verup/roles/ apache を起動する/tasks/main.yml --- - name : Apacheを起動する service : name : httpd state : started myapp_verup/roles/ postgresql を起動する/tasks/main.yml --- - name : PostgreSQLを起動する service : name : postgresql-9.6 state : started ※「service」モジュールの使い方は こちら （補足） ミドルウェア の起動 service コマンドが提供されていない ミドルウェア の場合は、「shell」モジュールと「wait_for」モジュールで実装することもできます。 --- - name : 起動コマンドを実行する shell : /usr/local/myapp/apache/bin/apachectl start - name : 80番ポートの疎通確認が終わるまで待機する wait_for : host : localhost port : 80 state : started delay : 1 timeout : 60 shell モジュールは終了 ステータスコード が0以外は、すべてエラーとして処理を中断しますので注意が必要です。 ステータスコード が0以外でも処理を継続する場合には、下記サンプルを参考にしてください。 --- - name : スクリプトを実行する shell : /usr/local/myapp/bin/hoge.sh register : exitStatus failed_when : exitStatus.rc not in [ 0 , 100 ] # 終了ステータスが0 or 100の場合はエラーにしない ※「shell」モジュールの使い方は こちら ※「wait_for」モジュールの使い方は こちら ミドルウェア の停止 service コマンドが準備されている ミドルウェア （デーモン）であれば、「service」モジュールを使って以下のように記述します。 myapp_verup/roles/cronを停止する/tasks/main.yml --- - name : crondを停止する service : name : crond state : stopped myapp_verup/roles/ apache を停止する/tasks/main.yml --- - name : Apacheを停止する service : name : httpd state : stopped myapp_verup/roles/ postgresql を停止する/tasks/main.yml --- - name : PostgreSQLを停止する service : name : postgresql-9.6 state : stopped ミドルウェア のバージョンアップ RPM が yum コマンドでバージョンアップできる場合は、「 yum 」モジュールを利用して「latest」の状態に更新します。 myapp_verup/roles/ apache をバージョンアップする/tasks/main.yml --- - name : RPMを更新する yum : name : httpd state : latest myapp_verup/roles/ php をバージョンアップする/tasks/main.yml --- - name : RPMを更新する yum : name={{ item }} state=latest enablerepo=remi,epel with_items : - php - php-cli - php-common - php-mbstring - php-mcrypt - php-pdo - php-xml - php-json - php-devel - php-pecl-zip - php-pgsql myapp_verup/roles/ postgresql をバージョンアップする/tasks/main.yml --- - name : RPMを更新する yum : name=postgresql96-server state=latest リポジトリ 管理されていない（カスタム RPM をつかっている）場合は、以下設定を参考にしてください。 myapp_verup └ roles └ Apacheをバージョンアップする ├ tasks │　　└ main.yml ├ files │　　└ myapp_apache2. 2 . 99 . rpm # カスタムPRMを格納 ├ templates │　　└ httpd.conf.j2 # テンプレートファイルを格納。拡張子は「.j2」にする。（テンプレートエンジン「Jinja2」を利用） └ vars 　　└ main.yml # RPMのファイル名やチェックサム値などを記述する ※ ディレクト リ構成については公式ページの Best Practices の「Directory Layout」を参考にしています。 myapp_verup/roles/ Apache をバージョンアップする/tasks/main.yml --- - name : RPMファイルを転送する copy : src=files/{{ rpm_file_name }} dest=/tmp - name : RPMファイルの状態を取得する stat : path : /tmp/{{ rpm_file_name }} register : file_status - name : チェックサム値を確認する fail : msg='MD5 value did not match' when : file_status.stat.md5 != rpm_file_md5 - name : "RPMを更新する ({{ rpm_file_name }})" shell : rpm -Uvh --force --nodeps /tmp/{{ rpm_file_name }} args : chdir : "/tmp" register : verup_result - name : ステータスコードを確認する fail : msg="Failed upgrade rpm." when : verup_result.rc != 0 - name : httpd.confを差し替える template : src=httpd.conf.j2 dest=/usr/local/vanguard/apache/conf/httpd.conf owner=root group=root mode=644 ※「copy」モジュールの使い方は こちら ※「stat」モジュールの使い方は こちら ※「fail」モジュールの使い方は こちら ※「template」モジュールの使い方は こちら myapp_verup/roles/ Apache をバージョンアップする/templates/ httpd .conf.j2 ...中略... # サーバ毎に異なる設定は 2重波括弧と変数名を記述しておきます。 ServerName {{ apache_server_name }}:80 ...中略... ※ 上記変数部分は、例えばInventoryファイルに記述した変数の値に自動で 置き換えることができます。 ...中略... [web:vars] apache_server_name = myapp.example.com ...中略... myapp_verup/roles/ Apache をバージョンアップする/vars/main.yml --- # RPMファイル名を記述します。 # この値はtask/main.ymlで参照されます。 rpm_file_name : "vg_httpd-2.4.25-centos6.x86_64.rpm" # RPMファイルのチェックサム値を記述します。 # この値はtask/main.ymlで参照されます。 rpm_file_md5 : "4f8009b1cbcf5dbc7f082773d2f0d661" playbookの実行 $ cd ~/myapp_verup $ ansible-playbook -i development.ini versionup.yml 実行結果は以下の通りです。 日本語で書いたタスクがそのままターミナル上のログに出力されていることが確認できます。 （/tmp/ansible.log にも出力されます。) 最後に 本記事は、運用チーム向けにAnsibleを使ったバージョンアップ自動化提案後に書いた記事です。 本番運用が開始されれば、いろいろと課題はでてくると思いますので、知見がたまりましたら 改めて情報を共有させていただこうと思います。 以上、ありがとうございました。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

はじめに 　こんにちは、mickey-STRANGEです。昨年に新卒で ラク スに入社しました2年目です。 　新卒に毛が生えた程度の新米エンジニアですが、今回はその数少ない毛の中から学生時代に意識したことのなかったものという観点で 脆弱性 のお話を選び、記事にしました。新しくWeb開発企業に入社した新卒の方の学習の手助けになればと思います。 目次 はじめに 脆弱性とは？ CSRF(クロスサイトリクエストフォージェリ) 概要 対策 確定処理の前に認証を行う リファラを確認する ワンタイムトークンを利用する おわりに 脆弱性 とは？ 　 脆弱性 とは、セキュリティの面からみたシステムの欠陥のことです。 脆弱性 をついて攻撃されてしまうと、ユーザには本来許されていない操作ができてしまったり、サーバにウィルスを仕込まれてしまったりという被害が出ます。 　この記事では 脆弱性 の中でも、私が実際に理解に時間のかかった CSRF ( クロスサイトリクエストフォージェリ ) という 脆弱性 の概要と対策をご紹介したいと思います。 CSRF ( クロスサイトリクエストフォージェリ ) 概要 　サービスの利用者に意図しないHTTPリク エス トを送信させ、利用者の意図しない処理をサービスに実行させる攻撃です。と、1文で書いてはみるものの、これだけで理解は出来ないと思います(私が勉強したときは理解出来ませんでした)ので、shop. example.com という架空の通販サイトで簡単な例を挙げてみましょう。 　shop. example.com ではユーザはIDとパスワードでログインします。利用ユーザがパスワードを変更しようとしたとき（ユーザが新しいパスワードを入力して確定ボタンを押したとき）に送信されるリク エス トが下のようなものだったとします。 URL 　http://shop.example.com/password/change パラメータ 　new_pass：【新しいパスワード】 　new_pass_conf：【新しいパスワード(確認入力用)】 　このリク エス トと同じものを作成して送信させる悪意のあるWebページを攻撃者が用意します。 偽装リク エス トを送信さえできればよいのでWebページの用意は難しいことではありません。具体的なコードは示しませんが、 javascript を使って数行で実現出来ます。GETでよければ他の手段でもっと単純に、コードとしては1行でも十分に実現できてしまいます。 (確定処理でGETを使用すること自体が論外ですが。) 　さて、shop. example.com のユーザAさんが、攻撃者の用意した悪意のあるWebページを開いてしまったとしましょう。 　するとAさんのブラウザから上記リク エス トと同じものが勝手に送信されてしまいます。正規にパスワード変更画面で確定ボタンを押したときのリク エス トと違うところがあるとすれば、パラメータのパスワード部分は攻撃者しか知らないものである、ということだけです。 このときAさんのブラウザに「shop. example.com にログインしている状態のセッション情報」が残っていた場合、その情報もブラウザが同時に送信してしまいます。 そのリク エス トを受け取ったサーバ側のプログラムは Aさんが操作を再開して、パスワードの変更確定ボタンを押した と誤認し、パスワード変更の処理を行ってしまいます。パスワード変更の処理が完了するとAさんはもうログイン出来なくなってしまいます。 　 CSRF は ログイン済みのユーザに、意図しない操作を強制的に実行させてしまう攻撃 であるといえます。 　今回の例ではパスワード変更ですが、これが購入や決済の確定処理で起きてしまうと取り返しがつかないということは簡単に想像出来ると思います。では CSRF がどのような 脆弱性 か分かったところで、 CSRF 攻撃を防ぐためにどのような仕組みを入れればよいかを考えてみようと思います。 対策 　では CSRF の対策を考えてみましょう。 上記の通り、 CSRF においてサーバは リクエスト通りに1つの機能を正しく完了している という特徴があります。つまり対策として考えられるのは 受け取ったリクエストに対して処理を実行するかしないかを確認する ことになります。 確定処理の前に認証を行う 　一番分かりやすい方法はユーザに確認してもらうことです。重要な処理の前にはユーザにもう一度認証を行う、つまりログインIDとパスワードの入力をしてもらうことになります。今回のパスワード変更の例ですと、以下のようになります。(数字がユーザ操作、→がサーバ処理です。) 1.新しいパスワードを入力して確定ボタン 2.認証画面でログインIDとパスワードを入力 　→変更処理を行う 　この順番で操作してもらうようになっていれば、今回の例のように1番のリク エス トを偽装されても処理を行ってしまうことはありません。 　しかし、この方法で対策するとユーザの操作が増えてしまいます。大事な処理の前だけとしても、ユーザの操作量が増えてしまったり、直感的に進めない画面が表示されると「このサイトは使いにくい、面倒だ」と感じてしまうかもしれません。ユーザに負担をお願いしたくない、ということで次にプログラム側だけで出来る対策を考えてみます。 リファラ を確認する 　ユーザ操作を増やさずに出来る CSRF 対策は「送られてきたリク エス トが正しいものか確認する」ことです。ここで正しいリク エス トとは、 サイト内にある確定ボタンを押すことで送信されたリクエスト ということになります。それを確認するために、 リファラ というHTTPヘッダの1つを利用します。 　 リファラ とは、 リクエスト元のページのURL を示すHTTPヘッダです。処理の前に リファラ の値が http://shop.example.com から始まっているかを確認すれば、偽装リク エス トかどうか判定することが可能です。 1.新しいパスワードを入力して確定ボタン 　→リファラのチェックを行う 　→変更処理を行う 　しかし、この方法ではまだ完璧な対策ではありません。 リファラ はその特性上、プライバシー面に問題を抱えており、ブラウザので リファラ を送信しない設定が可能です。また、前述のとおり、 リファラ はHTTPヘッダの1つです。改竄されてしまっては元も子もありません。 ワンタイム トーク ンを利用する 　ワンタイム トーク ンとは、リク エス トが正しいものか判断するための文字列をリク エス トの中に仕込む手法です。 　今回のパスワード変更の例ですと、以下のような流れになります。 0.パスワード変更画面を開く 　→乱数文字列(トークン)を生成 1.新しいパスワードを入力して確定ボタン(トークンを付与したリクエストを送信) 　→サーバ側で保持しておいたトークンとリクエストで送信されたトークンの比較を行う 　→変更処理を行う 　パスワード変更画面を開く際に トーク ン(乱数文字列)を作成し、セッションなどのサーバ側の領域で一時保存しておきます。また、確定のリク エス トの時にその トーク ンをパラメータに追加して送信させ、サーバ側で トーク ンの照合を行います。サーバ側で保存していた トーク ンと一致すれば処理を行う、一致しなければ不正なリク エス トとして処理を行わない、といった判断が可能となります。 　偽装リク エス トがもし トーク ンを勝手に付与したリク エス トを送信してもサーバ側で同じ トーク ンを保持していないので判別できますし、 リファラ とは違いヘッダではなくパラメータなのでユーザ依存で失敗したりすることがありません。今回紹介した中ではこの手法が最も適切だといえるでしょう。 おわりに 　 CSRF の概要と対策についてご紹介いたしました。いかがでしたでしょうか。 XSS ( クロスサイトスクリプティング )と名前が似ていることで勘違いしやすい 脆弱性 で、自分が理解しづらかった CSRF について記事にしてみました。 　Web開発に関する勉強を始めたばかりの方の手助けになれば幸いです。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

みなさんこんにちは。 ぺちぱー 歴5年のフジサワでございます。 今回は、 PHP 開発にはかかせない、PhpStormとGitを連携させて使用する方法をご紹介します。 有償ツールということもあってか、意外とPhpStormを使用したGitの利用方法について詳しくまとめられている記事が少ないので、いっそまとめてしまおうと思い至りました。 本記事では以下の環境をベースに解説しています。 OS: Windows 10 Home Edition PhpStorm: 2017.2.3 なお、今回の記事では、「開発する上でよく使う機能」のうち、基本的な一部の機能しかご紹介していません。 他の機能については、また改めて記事にまとめ、投稿させて頂きます。 目次 PhpStormのGit関連のUIについて まずはここから [git clone] 新しいブランチを作成する [git branch] 変更内容をコミットする [git commit] ローカルの変更をリモートにプッシュする [git push] 作業中のブランチを切り替える [git checkout] ブランチを最新化する [git fetch/merge] 別のブランチの変更を取り込む [git merge] 不要になったブランチを削除する [git branch -D] ブランチ間の差分を見る [git diff] コミット前のソースを元に戻す おわりに PhpStormのGit関連のUIについて まず初めに、PhpStorm上でGitを利用するためのUIについて簡単に解説します。 ① VCS メニュー:[ VCS ] - [Git]配下にcommitやpushといったGitの操作メニューが表示されます。 ②VersionContorolタブ：Git関連の情報を表示するペインの表示切替タブ ③各種Git情報タブ 　LocalChanges: プロジェクト中の未コミットファイルや非Git管理下のファイルを表示する。 　Log:コミットツリーを表示する。 　Console:PhpStorm上から実行した諸々の操作履歴 　　※ GUI 上からの操作はすべてGitクライアントにコマンドとして実行されており、ここにコマンド履歴が表示されます。 　　 トラブルシューティング の際はこのログを見ると、エラーや何が実行されているのか分かるので便利です。 ④Git Branches：[Git:[現在のブランチ]]ブランチの切り替えや新規作成など、ブランチ関連の操作はここから実行します。 まずはここから [git clone] 何はともあれ、 リポジトリ をcloneしなければ何も始まりません。 まずは、 リポジトリ をcloneする方法について見てみましょう。 ①PhpStorm起動時のウィザードから[Check out from Version Control] - [Git]を選択する。 ② リポジトリ のURLや ディレクト リの情報を入力して[clone]ボタンを押す。 　Git Repository URL: clone対象の リポジトリ のURL 　Parent Directory: clone先の親 ディレクト リ 　Directory Name: clone先の ディレクト リ名 なお、すでに何かしらのプロジェクトを開いている場合は、以下の手順でもcloneを実行することが可能です。 [ VCS ] - [Check out from Version Control] - [Git]を選択する。 新しいブランチを作成する [git branch] プロジェクトに対して何か変更を加えるため、新しいブランチを作成しましょう。 ①画面右下の[Git Branches]を押下し、表示されるポップアップから[New Branch]を選択する。 ②作成したいブランチの名前を入力し[OK]ボタンを押下する。 ブランチの作成に成功すると、完了メッセージが表示され、現在作業中のブランチが切り替わります。 変更内容をコミットする [git commit] ソースコード に加えた変更をコミットする方法を見てみましょう。 今回はサンプルとして、プロジェクト中のfile-A. php とfile-C. php に変更を加えました。 ①[ VCS ] - [Git] - [Commit FIle...] または ツールバー から[Commit]ボタンを選択する。 ②コミット対象のファイルにチェックを入れ、コミットメッセージを入力する。 ③ダイアログ右下の[commit]を押下し、コミットを実行する。 ここで[commit and push..]を選択することで、コミットとプッシュを一度に実行できますが、ここではコミットのみ実行します。 ④[Verstion Control]から[Log]タブを選択し、ブランチツリーを確認する。 先ほどコミットした内容がブランチツリーに反映されました。 なお、作業 ディレクト リ内の未コミットのファイルは以下の手順で確認することができます。 ①[Verstion Control]から[Local Changes]タブを選択し、作業 ディレクト リの状態を表示する。 ファイル名を右クリックし、[Show Diff]を選択することで、最新のコミットとの差分を表示することができます。 ローカルの変更をリモートにプッシュする [git push] それでは、ローカルの変更をリモートに反映するため、プッシュを実行しましょう。 ①[ VCS ] - [Git] - [Push...]を選択する。 ダイアログが表示され、これからプッシュする差分の情報などが表示されます。 ②[Push]ボタン - [Push]を選択し、プッシュを実行する。 作業中のブランチを切り替える [git checkout] 次に、作業中のブランチを切り替える方法について確認します。 ①画面右下の[Git Branches]を押下し、表示されるポップアップから切り替えたいブランチ名を選択し、[checkout]を選択する。 上の例は、既にローカルブランチとして存在するブランチに切り替える場合を説明したものです。 まだローカルブランチとして存在しないブランチに切り替える場合は、次の通りです。 ①画面右下の[Git Branches]を押下し、表示されるポップアップから切り替えたいブランチ名を選択し、[Checkout as new branch]を選択する。 ②作成するブランチ名を入力する。 ローカルブランチとして展開する際に、任意の名前を付けることが可能ですが、特別な理由がない限り、基本的にはデフォルトで入力されている名前をそのまま使用すれば良いでしょう。 [OK]ボタンを押下すると、ブランチの切り替えが完了します。 さて、PhpStormでGitを利用するうえで、混乱が生じやすいLocalBrancesとRemoteBranchesについて簡単に補足しておきます。 LocalBranches … ローカル上に存在するブランチ。コミットはこのブランチに対して実行される。 RemoteBranches … リモート追跡ブランチ。リモー トリポジ トリとの同期に使用するブランチで、fetchを実行するとリモー トリポジ トリの最新の状態が反映される。 ブランチを最新化する [git fetch/merge] 別の開発者によって、リモー トリポジ トリ側でブランチに加えられた変更内容を取り込む方法を見てみましょう。 ここではmasterブランチに変更が加えられた場合を例に、最新化する手順を確認します。 ①[ VCS ] - [Git] - [fetch]を選択し、RemoteBranchesにリモー トリポジ トリの変更を取り込む。 ②作業 ディレクト リを、最新化したいブランチに切り替える。 ③[Git Branches]から、最新化したいブランチに対応したリモートブランチを選択し、[Merge]を選択する。 上記の操作は、指定したブランチの変更内容を、現在checkoutしているブランチに取り込む操作です。 これでリモート側の変更をローカルに反映することができました。 少々、fetchとmergeの仕組みはわかりにくいので、簡単に解説します。 fetch前とfetch後で、ブランチツリーがどのように変化しているかを確認してみましょう。 ブランチツリー上でコミット履歴にマウスオーバーすると、そのコミットを指しているブランチの一覧を表示することができます。 fetch前の状態を見ると、ローカルブランチとmasterとリモート追跡ブランチのorgin/masterが同じコミットを指していることがわかります。 fetch後の状態をみると、ローカルブランチのmasterが指すコミットは変わりませんが、origin/masterが別の開発者によって行われたコミットを指している状態になっていることが分かります。 この状態では、まだ作業 ディレクト リの ソースコード に変化はありません。 では、fetchの後、mergeを実行するとどうなるでしょうか。 ブランチツリーの変化と ソースコード の変化を見てみましょう。 mergeを実行すると、ローカルブランチmasterの指すコミットが、origin/masterと同じコミットを指すようになりました。 この時、 ソースコード の方はどう変化しているでしょうか。 ご覧の通り、リモート側の変更が ソースコード に反映されています。 なお、一連の作業は[ VCS ] - [Git] - [Pull...]で一括実行することも可能です。 別のブランチの変更を取り込む [git merge] それでは、別のブランチに行われた変更を取り込む方法を見てみましょう。 例では、[master]から派生した別のブランチ[merge-test]に行われた変更を取り込む流れを確認します。 ①[ VCS ] - [Git] - [fetch]を選択し、RemoteBranchesにリモー トリポジ トリの変更を取り込む。 ②作業 ディレクト リを、最新化したいブランチに切り替える。 ③[Git Branches]から、マージしたいブランチを選択し、[Merge]を選択する。 マージが実行されると、デフォルトの設定では以下のようにマー ジログ が追加されます。(fast-forwardについては割愛) ブランチツリー上も、[master]ブランチと[merge-test]ブランチが統合されていることが分かります。 ここでお気づきの方もいると思いますが、「あるブランチを最新化する」という操作と、「別のブランチの変更を取り込む」という操作は、Git上では本質的には同じです。 同じブランチ同士のマージか、異なるブランチ同士のマージかという違いだけで、いずれもブランチ間のマージが行われています。 不要になったブランチを削除する [git branch -D] マージを実行したので、[merge-test]ブランチは不要になりました。 ここでは、ブランチの削除方法を見てみましょう。 ①[Git Branches]から、削除したいブランチを選択し、[Delete]を選択する。 なお、この操作はローカルブランチ、リモート追跡ブランチのいずれにも実行することが可能です。 リモート追跡ブランチを削除すると、自動的にリモー トリポジ トリ上のブランチを削除することができます。 ブランチ間の差分を見る [git diff] 続いて、ブランチ間の差分を確認する方法を見てみましょう。 ここでは、[master]ブランチと[new-branch]の差分を比較してみます。 ①[Git Branches]から、比較したいブランチを選択し、[Compare]を選択する。 ②ダイアログから[Files]タブを選択し、差分ファイル一覧を表示する。 ③確認したいファイルの名前をダブルクリックし、差分を表示する。 コミット前のソースを元に戻す ソースコード の修正をリセットしたい。そんな時はRevertを使用しましょう。 ①[Verstion Control]から[Local Changes]タブを選択し、作業 ディレクト リの状態を表示する。 ②修正を元に戻したいファイルを右クリックする。 ③ コンテキストメニュー から[revert]を選択する。 おわりに さて、いかがでしたでしょうか。 冒頭にも記載している通り、今回はPhpStormでGitを利用するための一部の基本的な機能しかご紹介していません。 別の機会に、rebaseやstash、conflictの解消方法などの重要な機能についても投稿させていただく予定です。 ではまた。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 https://career-recruit.rakus.co.jp/career_engineer/ カジュアル面談お申込みフォーム どの職種に応募すれば良いかわからないという方は、カジュアル面談も随時行っております。 以下フォームよりお申込みください。 forms.gle イベント情報 会社の雰囲気を知りたい方は、毎週開催しているイベントにご参加ください！ rakus.connpass.com

はじめに はじめまして。新卒入社で3年目のNIR-AMAUQAです。 今回は少し前に触ったnodemailerについて記事を書こうと思います。 具体的にはnode.jsからnodemailerというモジュールを使って、メールを送信してみようと思います。 以前nodemailerを触る機会があったんですが、調査している時に日本語の資料が少なかったり、 見つけても古いバージョンのものが多かったので、記事にしてみようと思いました。 node.jsについて分からない人はこちらをどうぞ Node.js を5分で大雑把に理解する - Qiita いまアツいJavaScript！ゼロから始めるNode.js入門〜5分で環境構築編〜 nodemailerとは 2010年から作られているnode.jsからメール送信を可能にするモジュールで、多くのユーザに利用されています。 ソフトウェアのライセンスはMITです。 Nodemailer :: Nodemailer 目次 はじめに node.jsについて分からない人はこちらをどうぞ nodemailerとは 目次 nodemailerをインストール サンプルプログラムを作成 詳細説明 SMTPサーバ設定 メールヘッダ作成 メール送信処理 実行してみる まとめ nodemailerをインストール では早速、nodemailerをインストールしたいと思います。 npmでインストールする際にモジュール名のみだと最新版をインストールします。 $ npm install nodemailer グローバルの場合は $ npm install nodemailer -g インストールの確認 $ npm list --depth=0 以下のように表示されていれば成功(2017/09/06 時点での最新が4.1.0です。) nodemailer@4.1.0 グローバルの場合は上記のコマンドと同じく末尾に -g を入れて下さい。 もし過去バージョンをインストールしたい場合は以下の書き方でバージョンを指定できます。 @ の後ろにバージョン番号を書いてください。 $ npm install nodemailer@4.0.1 サンプルプログラムを作成 //モジュールの読み込み var nodemailer = require( "nodemailer" ); //SMTPサーバの設定 var smtp = nodemailer.createTransport( { host: 'localhost' , port: 25 } ); //メール情報の作成 var message = { from: 'Fromアドレス' , to: 'Toアドレス' , subject: 'nodemailer test mail' , text: 'テストメールです。' } ; // メール送信 try { smtp.sendMail(message, function (error, info) { // エラー発生時 if (error) { console.log( "send failed" ); console.log(error.message); return ; } // 送信成功 console.log( "send successful" ); console.log(info.messageId); } ); } catch (e) { console.log( "Error" ,e); } 詳細説明 SMTP サーバ設定 //SMTPサーバの設定 var smtp = nodemailer.createTransport( { host: 'localhost' , port: 25 } ); ここで SMTP サーバの設定を行います。 今回はローカルのメールサーバを利用した最も簡単な例です。 nodemailerの記事で探すと Gmail などの SMTP サーバを利用しているものが多いので、 外部の SMTP サーバを利用したい方はそちらを参考にしてください。 nodemailerでGmailから送信するための方法 - Qiita メールヘッダ作成 //メール情報の作成 var message = { from: 'Fromアドレス' , to: 'Toアドレス' , subject: 'nodemailer test mail' , text: 'テストメールです。' } ; こちらも最もシンプルなメールヘッダの例になります。 私の調べた限りではReturn-Pathの設定はできないようです。 ただし、envelopeの設定はできるのでバウンスメールなどをコン トロール したい場合は以下のようにすれば可能です。 //メール情報の作成 var message = { from: 'Fromアドレス' , // 表示名つきにする場合は'表示名<Fromアドレス>' to: 'Toアドレス' , 　　envelope: { from: 'envelopeFromアドレス' , // バウンスメールの戻り先アドレス to: 'envelopeToアドレス' 　　　 // 実際の送信先 } , subject: 'nodemailer test mail' , text: 'テストメールです。' } ; envelopeを付与した場合は to: 'Toアドレス' はなくても送信可能ですが、メールヘッダのToが無くなってしまうので書いておくのが無難かと思います。 メール送信処理 // メール送信 try { smtp.sendMail(message, function (error, info) { // エラー発生時 if (error) { console.log( "send failed" ); console.log(error.message); return ; } // 送信成功 console.log( "send successful" ); console.log(info.messageId); } ); } catch (e) { console.log( "Error" ,e); } メッセージの送信に失敗するとerrorオブジェクトが返ってきます。 送信先 を消してメール送信に失敗した場合の例 $ node サンプルファイル名.js send failed No recipients defined メール送信に成功すると様々な情報が返されます。 公式のリファレンスによれば以下の情報が返されているそうです。 info.messageId info.envelope info.accepted info.rejected info.pending response 英語が苦手な私が訳すと誤解させる恐れがありますので 詳しくは公式のリファレンス *1 で確認お願いします。 実行してみる 以下のようになればメール送信成功です。 $ node サンプルファイル名.js send successful <Message-IDが出力されている> まとめ 今回はnode.jsにnodemailerを入れてメールを送信してみました。 想定していたよりも手軽にメール送信できました。 node.jsのモジュールに関して日本語の記事が増えてくれると嬉しいので、 私のために 記事を書いてくれると嬉しいです。 エンジニア 中途採用 サイト ラク スでは、エンジニア・デザイナーの 中途採用 を積極的に行っております！ ご興味ありましたら是非ご確認をお願いします。 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 : https://nodemailer.com/usage/#sending-mail