前から気になっていたwebサイトの表現を試してみた&#8230;

<p>我々が普段生活している中では、気づかないところでコンピュータが生み出す「ランダム（乱数）」にお世話になっています。</p>
<p>スマホのゲームでガチャを回した時、アタリつき自動販売機で飲み物を買った時、モンテカルロ法シミュレーションを実行する時とさまざまです。</p>
<p>20年くらい前に日本人の数学者グループが考案した「メルセンヌツイスタ（MT）」と呼ばれる疑似乱数生成アルゴリズムは多くのプログラミング言語に実装され、今では疑似乱数が欲しいときのデファクトスタンダードになってるんじゃないでしょうか。</p>
<p>疑似乱数とは、乱暴に言っちゃえば「数が出るパターンに周期があるから、厳密には正しくないけど、だいたいランダムな数字の集まり」というものです。詳しいことは専門家の説明を読みましょう。疑似乱数の質はCPUの計算速度とメモリ量で決定するのですが、その中で効率が良い方法のひとつがMTなのです。MTの乱数周期は2<sup>19937</sup>-1と、とても長いので実用に耐えられるわけです。</p>
<p>余談ですが計算資源が貧弱な頃、例えば8bit、16bit時代のテレビゲームは1から255までの数字を良い具合に散らしたテーブルで保持する、なんて無茶をやってます。この場合、乱数列周期2<sup>8</sup>-1非常に短い。</p>
<p>一方、RSA暗号キーの生成など、暗号を作るときには周期性がある疑似乱数を使うと解読される可能性があります。そのため、キーを生成する際に「マウスを無作為に動かせ」「キーボードのキーをしっちゃかめっちゃかに叩け」といった指示が出ていた時代もありました。人為的なランダム入力を乱数の元にしていたわけです。</p>
<p>ところが10年くらい前から、CPUが持つ熱雑音などをもとに暗号化用の乱数がPCのハードウェアから取得できるようになりました。Linux処理系だと/dev/random、/dev/urandomがそれに該当します。</p>
<p>/dev/randomをファイルとして読み出すだけで、システムに溜まっている乱数が手に入ります。ただし、保持している情報量には限りがあるため、次の乱数が生成されるまで「処理をブロッキングする」か「疑似乱数で代用する」という限定条件があります。</p>
<p>前置きが長くなりました。その良質な乱数である/dev/randomがMTの乱数生成の代わりになるかどうか、を簡単なプログラムで検証してみました。</p>
<p>ちなみにphpであれば</p>
<div>


		<div id="crayon-6495402649157027523049" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
hexdec(bin2hex(file_get_contents('/dev/urandom', false, NULL, 0, 4)));</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402649157027523049-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402649157027523049-1"><span class="crayon-e">hexdec</span><span class="crayon-sy">(</span><span class="crayon-e">bin2hex</span><span class="crayon-sy">(</span><span class="crayon-e">file_get_contents</span><span class="crayon-sy">(</span><span class="crayon-s">'/dev/urandom'</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-t">false</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-t">NULL</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-cn">4</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>


</div>
<p>これで4byte=32bit長の乱数が整数で入手できます。</p>
<p>ひたすらループを繰り返して、乱数を生成するテストプログラムを私のphp開発環境にて実行してみました。</p>
<table>
<tbody>
<tr>
<td>試行回数(回)</td>
<td>MT<br />
(10,000,000回ループ)</td>
<td>/dev/random<br />
(10,000回ループ)</td>
</tr>
<tr>
<td style="text-align: right;">1</td>
<td style="text-align: right;">2.84585</td>
<td style="text-align: right;">9.743988</td>
</tr>
<tr>
<td style="text-align: right;">2</td>
<td style="text-align: right;">2.868848</td>
<td style="text-align: right;">9.796494</td>
</tr>
<tr>
<td style="text-align: right;">3</td>
<td style="text-align: right;">2.865435</td>
<td style="text-align: right;">9.752865</td>
</tr>
<tr>
<td style="text-align: right;">4</td>
<td style="text-align: right;">2.836898</td>
<td style="text-align: right;">10.043154</td>
</tr>
<tr>
<td style="text-align: right;">5</td>
<td style="text-align: right;">2.832968</td>
<td style="text-align: right;">9.751514</td>
</tr>
<tr>
<td style="text-align: right;">6</td>
<td style="text-align: right;">2.866058</td>
<td style="text-align: right;">9.690516</td>
</tr>
<tr>
<td style="text-align: right;">7</td>
<td style="text-align: right;">2.91101</td>
<td style="text-align: right;">9.747249</td>
</tr>
<tr>
<td style="text-align: right;">8</td>
<td style="text-align: right;">2.857296</td>
<td style="text-align: right;">10.180832</td>
</tr>
<tr>
<td style="text-align: right;">9</td>
<td style="text-align: right;">2.856203</td>
<td style="text-align: right;">10.204445</td>
</tr>
<tr>
<td style="text-align: right;">10</td>
<td style="text-align: right;">2.872247</td>
<td style="text-align: right;">10.323912</td>
</tr>
<tr>
<td style="text-align: right;">平均</td>
<td style="text-align: right;">2.8612813</td>
<td style="text-align: right;">9.9234969</td>
</tr>
</tbody>
</table>
<p>結論から言えば、実行速度的に比べる必要もありませんでした。速度差およそ300倍。</p>
<p>しかし、/dev/randomからの乱数取得も実装コストが低いため、用途と利用シーンによっては利用することも検討してよいのでは、と思います。</p>
<p>&nbsp;</p>

その乱数、適切ですか？

wordpressのサーバー移行をphpmyadminを使わずにターミナルでやってみた

<p><span style="font-family: georgia, palatino, serif;">はじめまして、<span style="font-family: tahoma, arial, helvetica, sans-serif;">4</span>月からプログラマとして働きはじめたmotokiと申します。</span></p>
<p><span style="font-family: georgia, palatino, serif;">さてさて、発売日が発表され、じわじわと詳細が明らかになるドラゴンクエスト<span style="font-family: tahoma, arial, helvetica, sans-serif;">11</span>。<span style="font-family: tahoma, arial, helvetica, sans-serif;">PS4</span>版か、<span style="font-family: tahoma, arial, helvetica, sans-serif;">3DS</span>版か悩みますよね。</span><br />
<span style="font-family: georgia, palatino, serif;"> 今回のドラクエ11には「ふっかつのじゅもん」機能が復活するとのことで、ファミコン時代を思い出すピコピコ<del><span style="font-family: georgia, palatino, serif;">おじさん</span></del>おにいさんは多いと思います。私もそうです。</span></p>
<p><span style="font-family: georgia, palatino, serif;">復活の呪文をご存じない方へ端的に説明すると「ゲームの進行状態を電子データとして保存せず、代わりに文字列として書き出しておき、それを利用してゲームを再開する」という、今時の感覚からすれば謎の仕様ですね。</span><span style="font-family: georgia, palatino, serif;">ゲームカセットに電池を搭載して<span style="font-family: tahoma, arial, helvetica, sans-serif;">RAM</span>の状態を保持する技術が普及し、フラッシュメモリが浸透し、クラウド保存があたりまえになった今では逆に新しく感じるかもしれません。</span></p>
<p><span style="font-family: georgia, palatino, serif;">ドラクエ11でも現在の進行状態を「復活の呪文」化することで、だいたい同じ進行度を維持したまま別環境で再現できる、とのことで、ゲーム解析勢がどれくらい無茶なことをするのか今からワクワクしています。また、過去のドラクエ1や2で使えた復活の呪文も転用できるそうです。ではここで、復活の呪文の仕組みについてプログラミングの観点から簡単に解説します。大丈夫、ギリギリ技術ブログです。</span></p>
<p><span style="font-family: georgia, palatino, serif;">ドラクエ1と2では使える文字数・種類に違いがありますが、どちらの復活の呪文も「ひらがな＋濁音文字＋半濁音」から<span style="font-family: tahoma, arial, helvetica, sans-serif;">64</span>文字を用います。この<span style="font-family: tahoma, arial, helvetica, sans-serif;">64</span>文字にピンとくる人も居るんじゃないでしょうか。実は、メールの添付ファイル符号化などに使われる<span style="font-family: tahoma, arial, helvetica, sans-serif;">base64</span>とほぼ同じ技術です。おっ、技術ブログらしくなってきましたね。</span></p>
<p><span style="font-family: georgia, palatino, serif;">というわけで、ドラクエのことはひとまず置いて、<span style="font-family: tahoma, arial, helvetica, sans-serif;">base64</span>について解説したいと思います。これは電子メールのデータ転送が<span style="font-family: tahoma, arial, helvetica, sans-serif;">7bit</span>単位で行なわれる規格であるため、<span style="font-family: tahoma, arial, helvetica, sans-serif;">8bit</span>めのデータ欠損を起こさず転送する方法の一つとして生まれた符号化規格です。電子メールに半角カタカナを使っちゃいけない、っていう謎ルールもこの辺が由来です。</span></p>
<p><span style="font-family: georgia, palatino, serif;"><span style="font-family: tahoma, arial, helvetica, sans-serif;">8bit</span>の情報を<span style="font-family: tahoma, arial, helvetica, sans-serif;">3</span>つまとめて、<span style="font-family: tahoma, arial, helvetica, sans-serif;">6bit</span>ごと<span style="font-family: tahoma, arial, helvetica, sans-serif;">4</span>つに分割します。<span style="font-family: tahoma, arial, helvetica, sans-serif;">6bit</span>で表現可能な範囲は<span style="font-family: tahoma, arial, helvetica, sans-serif;">0</span>から<span style="font-family: tahoma, arial, helvetica, sans-serif;">63</span>まで。それぞれの値を<span style="font-family: tahoma, arial, helvetica, sans-serif;">64</span>個の文字に置き換えます。<span style="font-family: tahoma, arial, helvetica, sans-serif;">3</span>で割り切れない場合の<span style="font-family: tahoma, arial, helvetica, sans-serif;">bit</span>情報もひとまず<span style="font-family: tahoma, arial, helvetica, sans-serif;">6bit</span>ごとに分割して、残りは&#8221;=&#8221;記号で埋めます。以上、ここまでが<span style="font-family: tahoma, arial, helvetica, sans-serif;">base64</span>エンコードを簡単に説明したものです。デコードはこの手順を逆に行います。以下はデータと文字の関係について変換表にまとめたものです。</span></p>
<div id="attachment_12882" style="width: 610px" class="wp-caption alignnone"><a href="/admin/wp-content/uploads/2017/05/base64.png"><img aria-describedby="caption-attachment-12882" decoding="async" loading="lazy" class="wp-image-12882" src="/admin/wp-content/uploads/2017/05/base64-1024x597.png" alt="base64変換表" width="600" height="350" srcset="/uploads-archive/2017/05/base64-1024x597.png 1024w, /uploads-archive/2017/05/base64-300x175.png 300w, /uploads-archive/2017/05/base64-768x448.png 768w, /uploads-archive/2017/05/base64-228x133.png 228w, /uploads-archive/2017/05/base64.png 1044w" sizes="(max-width: 600px) 100vw, 600px" /></a><p id="caption-attachment-12882" class="wp-caption-text"><span style="font-family: tahoma, arial, helvetica, sans-serif;">base64</span>変換表</p></div>
<p><span style="font-family: georgia, palatino, serif;">それでは実際に短いデータ”STERFIELD”という文字列を<span style="font-family: tahoma, arial, helvetica, sans-serif;">base64</span>エンコードしてみましょう。</span></p>
<p><img decoding="async" loading="lazy" class="alignnone size-full wp-image-12894" src="/admin/wp-content/uploads/2017/05/sterfield.png" alt="" width="222" height="380" srcset="/uploads-archive/2017/05/sterfield.png 222w, /uploads-archive/2017/05/sterfield-175x300.png 175w" sizes="(max-width: 222px) 100vw, 222px" /></p>
<p><span style="font-family: georgia, palatino, serif;">上記は”STERFIELD”を1文字ずつ文字コードを16進数化したものです。これらを連結すると以下のビット列になります。</span></p>
<p><code>010100110101010001000101010100100100011001001001010001010100110001000100</code></p>
<p><span style="font-family: georgia, palatino, serif;">これを6桁ずつに区切ります。</span></p>
<p><code>010100 110101 010001 000101 010100 100100 011001 001001 010001 010100 110001 000100</code></p>
<p><span style="font-family: georgia, palatino, serif;">6桁ずつ上の表に従って文字を割り当てていきます。</span><br />
<code>U1RFUkZJRUxE</code><br />
<span style="font-family: georgia, palatino, serif;">あら不思議、<span style="font-family: tahoma, arial, helvetica, sans-serif;">base64</span>エンコードの完了です。</span></p>
<p><span style="font-family: georgia, palatino, serif;">お待たせしました。ドラクエの話に戻りましょう。前述した<span style="font-family: tahoma, arial, helvetica, sans-serif;">base64</span>変換表の&#8221;A&#8221;から&#8221;/&#8221;までの文字の代わりに、後述するひらがなを割り当てれば、復活の呪文風エンコーダ・デコーダが作れますね。（ドラクエのデコーダ実装上でのひらがなの順番はよく分かりません……）</span></p>
<p><span style="font-family: georgia, palatino, serif;">ついでなので、それぞれのドラクエの復活の呪文がどれだけのデータを保持していたのか、計算してみましょう。</span></p>
<table>
<tbody>
<tr>
<td></td>
<td> 使用文字</td>
<td>復活の呪文長</td>
<td>実データ長</td>
</tr>
<tr>
<td>ドラクエ1</td>
<td>あいうえお<br />
かきくけこ<br />
さしすせそ<br />
たちつてと<br />
なにぬねの<br />
はひふへほ<br />
まみむめも<br />
らりるれろ<br />
やゆよわ<br />
がぎぐげご<br />
ざじずぜぞ<br />
だぢづでど<br />
ばびぶべぼ</td>
<td>20文字固定</td>
<td><span style="font-family: tahoma, arial, helvetica, sans-serif;">6(bit)×20＝120(bit)</span><span style="font-family: tahoma, arial, helvetica, sans-serif;">＝15</span>バイト相当</td>
</tr>
<tr>
<td>ドラクエ2</td>
<td>あいうえお<br />
かきくけこ<br />
さしすせそ<br />
たちつてと<br />
なにぬねの<br />
はひふへほ<br />
まみむめも<br />
らりるれろ<br />
やゆよわ<br />
がぎぐげご<br />
ざじずぜぞ<br />
ばびぶべぼ<br />
ぱぴぷぺぽ</td>
<td>18～52文字</td>
<td><span style="font-family: tahoma, arial, helvetica, sans-serif;">6(bit)×52＝312(bit)</span><span style="font-family: tahoma, arial, helvetica, sans-serif;">＝39</span>バイト相当</td>
</tr>
</tbody>
</table>
<p><span style="font-family: georgia, palatino, serif;">信じがたいコンパクト設計ですね。プレイ状況の再現に必要な情報を極限まで切り詰めた結果ですが、当時のプログラマの叡智が詰まっています。復活の呪文というのは、ゲームの中でだいたいこのように処理されて「よくぞもどった」と言われるようになるわけです。今はゲーム内の情報も膨大になったので、こんな短い文字だけでどれだけ再現できるのかな、という技術的興味がふつふつと沸いてきますね。</span><br />
<span style="font-family: georgia, palatino, serif;">もうすぐ発売されるドラクエ<span style="font-family: tahoma, arial, helvetica, sans-serif;">11</span>でも復活の呪文の入力が間違っていたらやっぱり絶望に打ちひしがれるのだろうか、と思うと今から楽しみです。</span></p>
<p>&nbsp;</p>


ふっかつのじゅもんとbase64の関係

Amazonのレビュー信頼度を測ってみる

<h2>visual studio codeを使って、git管理に視覚化しょう</h2>
<p>visual studio codeはmicrosoft開発されたエディター。</p>
<p>アメリカにMacのプロジェクトの開発する人の中に、人気ものです。</p>
<h2>git 管理</h2>
<ul>
<li>ブランチーの新規追加</li>
<li>ブランチーの入り替え</li>
<li>差分を見る</li>
<li>修正のコミットを戻す</li>
<li>コミットを戻す</li>
<li>ブランチーを公開する</li>
<li>コミットをサーバーに上げます</li>
<li>実行するgitコマンドを見える</li>
</ul>
<p>&nbsp;</p>
<p><iframe loading="lazy" width="500" height="375" src="https://www.youtube.com/embed/AKNYgP0yEOY?feature=oembed" frameborder="0" allowfullscreen></iframe></p>
<h2>pluginを使って、もっと便利だ</h2>
<ul>
<li>gitプロジェクトの入り替え</li>
<li>特定の言語を色を着ける</li>
<li>使うクラス探す</li>
<li>css 色表示</li>
<li>etc.</li>
</ul>
<p>&nbsp;</p>
<p><a href="/uploads-archive/2017/04/6FC296A9-BC94-41E4-BA2E-22ADF48D9910.png"><img decoding="async" loading="lazy" class="alignnone wp-image-12740" src="/uploads-archive/2017/04/6FC296A9-BC94-41E4-BA2E-22ADF48D9910-300x166.png" alt="6FC296A9-BC94-41E4-BA2E-22ADF48D9910" width="593" height="328" srcset="/uploads-archive/2017/04/6FC296A9-BC94-41E4-BA2E-22ADF48D9910-300x166.png 300w, /uploads-archive/2017/04/6FC296A9-BC94-41E4-BA2E-22ADF48D9910-768x425.png 768w, /uploads-archive/2017/04/6FC296A9-BC94-41E4-BA2E-22ADF48D9910-1024x566.png 1024w, /uploads-archive/2017/04/6FC296A9-BC94-41E4-BA2E-22ADF48D9910-228x126.png 228w, /uploads-archive/2017/04/6FC296A9-BC94-41E4-BA2E-22ADF48D9910.png 1908w" sizes="(max-width: 593px) 100vw, 593px" /></a></p>
<h2>大事なdebugを活用</h2>
<ul>
<li>実行中の変数を表す</li>
<li>問題あるファンクションを全てチェック</li>
<li>実行中変数の監視</li>
<li>etc.</li>
</ul>
<p>変数の表示、問題解決早いです</p>
<p><img decoding="async" loading="lazy" class="alignnone" src="https://i.stack.imgur.com/1nIpO.png" width="1109" height="784" /></p>
<h2>プロジェックト内キーワード探す</h2>
<ul>
<li>普通なキーワード検索</li>
<li>正規表現</li>
<li>ファイル限定</li>
</ul>
<p><a href="/uploads-archive/2017/04/5D57E08E-3760-4124-835C-DC335298969D.png"><img decoding="async" loading="lazy" class="alignnone wp-image-12742" src="/uploads-archive/2017/04/5D57E08E-3760-4124-835C-DC335298969D-300x166.png" alt="5D57E08E-3760-4124-835C-DC335298969D" width="616" height="341" srcset="/uploads-archive/2017/04/5D57E08E-3760-4124-835C-DC335298969D-300x166.png 300w, /uploads-archive/2017/04/5D57E08E-3760-4124-835C-DC335298969D-768x425.png 768w, /uploads-archive/2017/04/5D57E08E-3760-4124-835C-DC335298969D-1024x566.png 1024w, /uploads-archive/2017/04/5D57E08E-3760-4124-835C-DC335298969D-228x126.png 228w, /uploads-archive/2017/04/5D57E08E-3760-4124-835C-DC335298969D.png 1908w" sizes="(max-width: 616px) 100vw, 616px" /></a></p>
<p>&nbsp;</p>
<h2>インストール</h2>
<p>https://code.visualstudio.com/download</p>


visual studio code の紹介

javascriptフレームワークのvue.jsを使ってみる②（ソート機能っぽいもの）

<p></p>
<h2>はじめに</h2>
<div style="padding-left: 15px;">
  プロジェクトを上手く進行するにあたって欠かせないプロジェクト管理ツール。<br />
  redmine, JIRA, サイボウズ などフリーのものから有料のものまで色々とあります。</p>
<p>  今回はコスパの良さげなBacklogについてフォーカスします</p></div>
<h2>出来ること・出来ないこと</h2>
<div style="padding-left: 15px;">
  出来ること</p>
<blockquote><p>
    1. タスク管理<br />
    2. スケジュール管理<br />
    3. 工数管理<br />
    4. Gitでのバージョン管理とタスクの連携<br />
    5. ファイル共有
  </p></blockquote>
<p>  出来ないこと</p>
<blockquote><p>
    1. チケット管理<br />
    2. 複数の担当者に対するタスク登録<br />
    3. 詳細なガントチャート機能
  </p></blockquote>
<p>  低コストで手軽なプロジェクト管理で良いという企業向けです。</p></div>
<h2>大まかな構成、構成要素について</h2>
<div style="padding-left: 15px;">
<h3>プロジェクト</h3>
<p>  案件とほぼ同義</p>
<h3>スペース</h3>
<p>  「プロジェクト」の母体。共同で案件をリリースしていく団体、大抵は企業にあたります。</p>
<h3>メンバ</h3>
<p>  社員など「プロジェクト」に参加してタスクの追加、あるいは閲覧のみなど権限設定によって挙動は異なりますがプロジェクトの情報を共有する対象者となる存在。</p>
<h3>グループ</h3>
<p>  「メンバ」のカテゴライズ用の存在。例えば「コーダー」「エンジニア」などでしょうか。</p>
<h4>プロジェクトを作る</h4>
<p>  「スペース」を立ち上げたら(招待されたら)まず「プロジェクト」を作成しましょう。<br />
  「スペース」「プロジェクト」の「プロジェクトの追加」ボタンから登録画面で作成出来ます。<br />
  <a href="/uploads-archive/2017/03/64a936a5302c905140a4a0ba1f870c6a.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/64a936a5302c905140a4a0ba1f870c6a-285x300.png" alt="スクリーンショット 2017-03-14 15.08.11" width="285" height="300" class="alignnone size-medium wp-image-12657" srcset="/uploads-archive/2017/03/64a936a5302c905140a4a0ba1f870c6a-285x300.png 285w, /uploads-archive/2017/03/64a936a5302c905140a4a0ba1f870c6a-768x809.png 768w, /uploads-archive/2017/03/64a936a5302c905140a4a0ba1f870c6a-228x240.png 228w, /uploads-archive/2017/03/64a936a5302c905140a4a0ba1f870c6a.png 813w" sizes="(max-width: 285px) 100vw, 285px" /></a></p>
<h4>メンバの招待</h4>
<p>  次に「プロジェクト」に関係者を「メンバ」として招待します。権限の設定もここでします。<br />
  各プロジェクトページの「プロジェクト設定」「参加ユーザ」から「スペース」に居るユーザを追加出来ます。<br />
<a href="/uploads-archive/2017/03/e7b9e907e012f32dbb4bc8cddd5a9d2d.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/e7b9e907e012f32dbb4bc8cddd5a9d2d-300x179.png" alt="スクリーンショット 2017-03-14 15.09.14" width="300" height="179" class="alignnone size-medium wp-image-12658" srcset="/uploads-archive/2017/03/e7b9e907e012f32dbb4bc8cddd5a9d2d-300x179.png 300w, /uploads-archive/2017/03/e7b9e907e012f32dbb4bc8cddd5a9d2d-768x458.png 768w, /uploads-archive/2017/03/e7b9e907e012f32dbb4bc8cddd5a9d2d-228x136.png 228w, /uploads-archive/2017/03/e7b9e907e012f32dbb4bc8cddd5a9d2d.png 962w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>  メンバを追加したらタスクを担当者割り振りしますが、その前に「タスク」登録後にプロジェクト管理を進行しやすくするための項目別に触れます</p></div>
<h2>プロジェクトを進めるための指標</h2>
<div style="padding-left: 15px;">
<h3>カテゴリ</h3>
<p>  「プロジェクト設定」「カテゴリー」から追加編集削除が可能。<br />
  課題の管理時にグルーピングを管理しやすくするためのタグのようなものです。複数項目を課題に付与出来ます。上手く活用しましょう。<br />
  例)<br />
  作業カテゴリ: テスト, 修正, 開発, 構築<br />
  機能カテゴリ: 管理者ページ, フロントページ, バッチ<br />
  などなど。。課題のカテゴライズはその後のフローのキモです！</p>
<h3>種別</h3>
<p>  課題の種類。<br />
  デフォルトで &#8220;タスク&#8221;, &#8220;バグ&#8221;, &#8220;要望&#8221;, &#8220;その他&#8221; が登録済みです。<br />
  これも課題を上手く活用するために最初に整備しましょう。</p>
<h3>マイルストーン</h3>
<blockquote><p>マイルストーンとは、物事の進捗を管理するために途中で設ける節目をいう。もとは道路などに置かれ、距離を表示する標識（里程標）のこと。</p>
<p>コトバンクより引用</p></blockquote>
<p>  例えばを全体の大きなマイルストーンとしつつ、その中で &#8220;要件定義&#8221;,&#8221;開発&#8221;,&#8221;テスト&#8221; などとフェーズを分けて管理することで節目の管理をすることが可能です。</p>
<h3>発生バージョン</h3>
<p>  これはBacklog独自の仕様かもしれないのですが、タスクや要望が発生したプロジェクトのバージョンを指します。<br />
  進行しているプロジェクトに対して現在アクティブなバージョンを決める必要があります、、、が項目が見当たらなかったので割愛。</p></div>
<h2>いざ課題の登録</h2>
<div style="padding-left: 15px;">
  「課題の追加」メニューからすぐに出来ます。<br />
  前項のマイルストーンやカテゴリを活用すると、リリースまでの期限・進捗をガントチャートで意識しやすくなります。<br />
  また「予定時間」「実績時間」も活用するとマイルストーンに対して進捗、残時間をグラフにて可視化してマネージしやすいでしょう。</p>
<p>  サンプルで作ったガントチャートでこんな感じになります。<br />
<a href="/uploads-archive/2017/03/7834ec994025e73bf776f023cc71bfc9-1.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/7834ec994025e73bf776f023cc71bfc9-1-300x219.png" alt="スクリーンショット 2017-03-14 16.14.42" width="300" height="219" class="alignnone size-medium wp-image-12682" srcset="/uploads-archive/2017/03/7834ec994025e73bf776f023cc71bfc9-1-300x219.png 300w, /uploads-archive/2017/03/7834ec994025e73bf776f023cc71bfc9-1-768x561.png 768w, /uploads-archive/2017/03/7834ec994025e73bf776f023cc71bfc9-1-1024x748.png 1024w, /uploads-archive/2017/03/7834ec994025e73bf776f023cc71bfc9-1-228x166.png 228w, /uploads-archive/2017/03/7834ec994025e73bf776f023cc71bfc9-1.png 1156w" sizes="(max-width: 300px) 100vw, 300px" /></a></div>
<h2>使えると更に便利な機能 (ファイル共有)</h2>
<div style="padding-left: 15px;">
  ファイルサーバーとしての機能も便利。</p>
<p>  メニューから「ファイル」を選択し、自由にディレクトリやファイルを作成出来ます。<br />
  またファイル共有も可能でWindowsならExplorer, MacならFinder経由でリモートと同期してファイルへのアクセスが可能です。<br />
  <a href="/uploads-archive/2017/03/409b55e1307e39cc000dd6391aef1140.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/409b55e1307e39cc000dd6391aef1140-300x208.png" alt="スクリーンショット 2017-03-14 16.19.46" width="300" height="208" class="alignnone size-medium wp-image-12673" srcset="/uploads-archive/2017/03/409b55e1307e39cc000dd6391aef1140-300x208.png 300w, /uploads-archive/2017/03/409b55e1307e39cc000dd6391aef1140-228x158.png 228w, /uploads-archive/2017/03/409b55e1307e39cc000dd6391aef1140.png 341w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
<a href="/uploads-archive/2017/03/90f551366c2dd775e5e94760f486ce3b.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/90f551366c2dd775e5e94760f486ce3b-300x206.png" alt="スクリーンショット 2017-03-14 16.58.18" width="300" height="206" class="alignnone size-medium wp-image-12683" srcset="/uploads-archive/2017/03/90f551366c2dd775e5e94760f486ce3b-300x206.png 300w, /uploads-archive/2017/03/90f551366c2dd775e5e94760f486ce3b-768x526.png 768w, /uploads-archive/2017/03/90f551366c2dd775e5e94760f486ce3b-228x156.png 228w, /uploads-archive/2017/03/90f551366c2dd775e5e94760f486ce3b.png 1014w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
<a href="/uploads-archive/2017/03/7e089e8fcfe6346836c8b2c7c699cdad.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/7e089e8fcfe6346836c8b2c7c699cdad-300x122.png" alt="スクリーンショット 2017-03-14 16.56.52" width="300" height="122" class="alignnone size-medium wp-image-12684" srcset="/uploads-archive/2017/03/7e089e8fcfe6346836c8b2c7c699cdad-300x122.png 300w, /uploads-archive/2017/03/7e089e8fcfe6346836c8b2c7c699cdad.png 768w, /uploads-archive/2017/03/7e089e8fcfe6346836c8b2c7c699cdad-228x93.png 228w" sizes="(max-width: 300px) 100vw, 300px" /></a>
</div>
<h2>使えると更に便利な機能 (Gitによるバージョン管理)</h2>
<div style="padding-left: 15px;">
  開発者であればこの機能は嬉しい。</p>
<p>  「プロジェクト設定」「Git」を選択。<br />
  初回は「このプロジェクトでGitを使う」と言うダイアログが出て来るので押下。</p>
<p>  リポジトリ名を入力してリポジトリを作成します。<br />
<a href="/uploads-archive/2017/03/de035c18957f0869151b1543c935a86f.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/de035c18957f0869151b1543c935a86f-300x234.png" alt="スクリーンショット 2017-03-14 16.24.14" width="300" height="234" class="alignnone size-medium wp-image-12674" srcset="/uploads-archive/2017/03/de035c18957f0869151b1543c935a86f-300x234.png 300w, /uploads-archive/2017/03/de035c18957f0869151b1543c935a86f-768x598.png 768w, /uploads-archive/2017/03/de035c18957f0869151b1543c935a86f-228x178.png 228w, /uploads-archive/2017/03/de035c18957f0869151b1543c935a86f.png 818w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>  これだけではバージョン管理は出来ません。<br />
  参加メンバ各「個人設定」の「SSH公開鍵」でGitアクセス時に使用する公開鍵を貼り付けて登録します。<br />
  鍵の生成はPuTTYやターミナルの</p>

		<div id="crayon-6495402647a57378243706" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">Shell</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
ssh-keygen -t rsa</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402647a57378243706-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402647a57378243706-1"><span class="crayon-i">ssh</span>-<span class="crayon-i">keygen</span><span class="crayon-h"> </span>-<span class="crayon-i">t</span><span class="crayon-h"> </span><span class="crayon-i">rsa</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>などで各自作ります。</p>
<p>  作業ディレクトリにて</p>

		<div id="crayon-6495402647a5c676483379" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">Shell</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
git clone sterfield@sterfield.git.backlog.jp:/SAMPLE_01/sample_git.git</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402647a5c676483379-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402647a5c676483379-1"><span class="crayon-e">git </span><span class="crayon-r">clone</span><span class="crayon-h"> </span><span class="crayon-i">sterfield</span><span class="crayon-sy">@</span><span class="crayon-i">sterfield</span><span class="crayon-e">.git</span><span class="crayon-e">.backlog</span><span class="crayon-e">.jp</span><span class="crayon-sy">:</span>/<span class="crayon-i">SAMPLE_01</span>/<span class="crayon-i">sample_git</span><span class="crayon-e">.git</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>としてまず複製。その後はgit add, pushなどで以下のようにcommit履歴や差分を手軽に確認することが可能です。<br />
<a href="/uploads-archive/2017/03/ebbbf696b24cf5e4096045f9375d5747.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/ebbbf696b24cf5e4096045f9375d5747-300x144.png" alt="スクリーンショット 2017-03-14 16.38.52" width="300" height="144" class="alignnone size-medium wp-image-12675" srcset="/uploads-archive/2017/03/ebbbf696b24cf5e4096045f9375d5747-300x144.png 300w, /uploads-archive/2017/03/ebbbf696b24cf5e4096045f9375d5747-228x109.png 228w, /uploads-archive/2017/03/ebbbf696b24cf5e4096045f9375d5747.png 727w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
<a href="/uploads-archive/2017/03/5f3e2d9e6a34e989df9bf95cb80ecafd.png"><img decoding="async" loading="lazy" src="/uploads-archive/2017/03/5f3e2d9e6a34e989df9bf95cb80ecafd-300x251.png" alt="スクリーンショット 2017-03-14 16.42.03" width="300" height="251" class="alignnone size-medium wp-image-12676" srcset="/uploads-archive/2017/03/5f3e2d9e6a34e989df9bf95cb80ecafd-300x251.png 300w, /uploads-archive/2017/03/5f3e2d9e6a34e989df9bf95cb80ecafd-228x191.png 228w, /uploads-archive/2017/03/5f3e2d9e6a34e989df9bf95cb80ecafd.png 736w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>  また課題キーと連動することが可能。<br />
  以下のような課題を追加後、Git上で課題キーと課題ステータスをセットでcommitへのコメントでpushします。</p>
<p>  push後、以下のようにステータスが自動的に変わってくれます。</p></div>

Backlogの活用術について

<p>&nbsp;</p>
<h2><b>Scratch</b> (スクラッチ)とは</h2>
<blockquote><p><b>Scratch</b> (スクラッチ) とは初心者が最初に正しい構文の書き方を覚えること無く結果を得られるプログラミング言語学習環境である。MITメディアラボが開発し、遊び心のある実験やインタラクティブアニメーション、ゲームなどの製作を通してさらなる学習のやる気を起こさせることを意図している。（wiki）</p></blockquote>
<h2>特点</h2>
<p>今までクラシックプログラマは</p>

		<div id="crayon-649540264776a989795457" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">Java</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
	// pre: list != null
	// post: return sum of elements
	// use traditional for loop
	public static int sumListOld(int[] list)
	{	int total = 0;
		for(int i = 0; i &lt; list.length; i++)
		{	total += list[i];
			System.out.println( list[i] );
		}
		return total;
	}</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-649540264776a989795457-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264776a989795457-2">2</div><div class="crayon-num" data-line="crayon-649540264776a989795457-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264776a989795457-4">4</div><div class="crayon-num" data-line="crayon-649540264776a989795457-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264776a989795457-6">6</div><div class="crayon-num" data-line="crayon-649540264776a989795457-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264776a989795457-8">8</div><div class="crayon-num" data-line="crayon-649540264776a989795457-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264776a989795457-10">10</div><div class="crayon-num" data-line="crayon-649540264776a989795457-11">11</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-649540264776a989795457-1"><span class="crayon-h">	</span><span class="crayon-c">// pre: list != null</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264776a989795457-2"><span class="crayon-h">	</span><span class="crayon-c">// post: return sum of elements</span></div><div class="crayon-line" id="crayon-649540264776a989795457-3"><span class="crayon-h">	</span><span class="crayon-c">// use traditional for loop</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264776a989795457-4"><span class="crayon-h">	</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-m">static</span><span class="crayon-h"> </span><span class="crayon-t">int</span><span class="crayon-h"> </span><span class="crayon-e">sumListOld</span><span class="crayon-sy">(</span><span class="crayon-t">int</span><span class="crayon-sy">[</span><span class="crayon-sy">]</span><span class="crayon-h"> </span><span class="crayon-i">list</span><span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-649540264776a989795457-5"><span class="crayon-h">	</span><span class="crayon-sy">{</span><span class="crayon-h">	</span><span class="crayon-t">int</span><span class="crayon-h"> </span><span class="crayon-i">total</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264776a989795457-6"><span class="crayon-h">		</span><span class="crayon-st">for</span><span class="crayon-sy">(</span><span class="crayon-t">int</span><span class="crayon-h"> </span><span class="crayon-i">i</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-i">i</span><span class="crayon-h"> </span><span class="crayon-h">&lt;</span><span class="crayon-h"> </span><span class="crayon-i">list</span><span class="crayon-sy">.</span><span class="crayon-i">length</span><span class="crayon-sy">;</span><span class="crayon-h"> </span><span class="crayon-i">i</span>++<span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-649540264776a989795457-7"><span class="crayon-h">		</span><span class="crayon-sy">{</span><span class="crayon-h">	</span><span class="crayon-i">total</span><span class="crayon-h"> </span>+=<span class="crayon-h"> </span><span class="crayon-i">list</span><span class="crayon-sy">[</span><span class="crayon-i">i</span><span class="crayon-sy">]</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264776a989795457-8"><span class="crayon-h">			</span><span class="crayon-i">System</span><span class="crayon-sy">.</span><span class="crayon-i">out</span><span class="crayon-sy">.</span><span class="crayon-e">println</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-i">list</span><span class="crayon-sy">[</span><span class="crayon-i">i</span><span class="crayon-sy">]</span><span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264776a989795457-9"><span class="crayon-h">		</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264776a989795457-10"><span class="crayon-h">		</span><span class="crayon-st">return</span><span class="crayon-h"> </span><span class="crayon-i">total</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264776a989795457-11"><span class="crayon-h">	</span><span class="crayon-sy">}</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>スクラッチは</p>
<p><a href="/uploads-archive/2017/03/screencapture-scratch-mit-edu-projects-1300590-1489472059298.png"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-12656" src="/uploads-archive/2017/03/screencapture-scratch-mit-edu-projects-1300590-1489472059298-300x163.png" alt="screencapture-scratch-mit-edu-projects-1300590-1489472059298" width="300" height="163" srcset="/uploads-archive/2017/03/screencapture-scratch-mit-edu-projects-1300590-1489472059298-300x163.png 300w, /uploads-archive/2017/03/screencapture-scratch-mit-edu-projects-1300590-1489472059298-768x417.png 768w, /uploads-archive/2017/03/screencapture-scratch-mit-edu-projects-1300590-1489472059298-1024x556.png 1024w, /uploads-archive/2017/03/screencapture-scratch-mit-edu-projects-1300590-1489472059298-228x124.png 228w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>積み木なように構成されている。</p>
<h2>プログラマーの基礎鍛錬必要な機能</h2>
<p>アーキテクチャ</p>
<p>MVCの理念</p>
<p><img decoding="async" loading="lazy" class="alignnone" src="http://write-remember.com/wordpress/wp-content/uploads/2013/04/mvc_model.png" width="1090" height="470" /></p>
<p>&nbsp;</p>
<p><a href="/uploads-archive/2017/03/579aa5d62395548e81dd0923d09ffd9a.png"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-12665" src="/uploads-archive/2017/03/579aa5d62395548e81dd0923d09ffd9a-300x204.png" alt="QQ20170314-153954@2x" width="300" height="204" srcset="/uploads-archive/2017/03/579aa5d62395548e81dd0923d09ffd9a-300x204.png 300w, /uploads-archive/2017/03/579aa5d62395548e81dd0923d09ffd9a-228x155.png 228w, /uploads-archive/2017/03/579aa5d62395548e81dd0923d09ffd9a.png 418w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>View:  motion, looks, sound, pen</p>
<p>Model: data</p>
<p>Control: Events, control</p>
<h2>利点</h2>
<p>正しいプログラマーロジックのトレンドに優秀。</p>
<p>小さいDEMOプロジェクトを作るにも便利です。</p>
<p><a href="https://scratch.mit.edu/projects/1300590/#editor">Demoサイト</a></p>
<p>Reference:</p>
<p>https://ja.wikipedia.org/wiki/Scratch_(%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E8%A8%80%E8%AA%9E)</p>

初心者向け、プログラマーロジックトレンド

<p>以前、<br />
<a href="/programmer/%E7%8A%B6%E6%B3%81%E3%81%AB%E3%82%88%E3%81%A3%E3%81%A6validation%E3%82%92%E5%A4%89%E3%81%88%E3%82%8B%EF%BC%88ruby-on-rails%EF%BC%89/">状況によってvalidationを変える（Ruby on Rails）</a>というブログを書き、on contextで指定するという方法を記事にしました。<br />
今回はその続きです。</p>
<p>on contextという方法は、状況に応じて少し変えるという際には楽だったのですが、<br />
validationがだんだん複雑になってくるにつれて、<br />
かくコードの量が多くなり、煩雑になりがちです。</p>
<p>そこでwith_optionsを用いると綺麗にまとめて書く事ができます。</p>
<p>仮に下記のようなモデルがあったとします（商品モデル）。</p>

		<div id="crayon-6495402645ae0805224652" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
# == Schema Information                                            
#
# Table name: product
#
#  id                     :integer          not null, primary key
#  product_name           :string(255)
#  price                  :float(24)
#  product_code           :string(255)
#  created_at             :datetime         not null
#  updated_at             :datetime         not null
#
#
class Product &lt; ActiveRecord::Base
end</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402645ae0805224652-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae0805224652-2">2</div><div class="crayon-num" data-line="crayon-6495402645ae0805224652-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae0805224652-4">4</div><div class="crayon-num" data-line="crayon-6495402645ae0805224652-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae0805224652-6">6</div><div class="crayon-num" data-line="crayon-6495402645ae0805224652-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae0805224652-8">8</div><div class="crayon-num" data-line="crayon-6495402645ae0805224652-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae0805224652-10">10</div><div class="crayon-num" data-line="crayon-6495402645ae0805224652-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae0805224652-12">12</div><div class="crayon-num" data-line="crayon-6495402645ae0805224652-13">13</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae0805224652-14">14</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402645ae0805224652-1"><span class="crayon-p"># == Schema Information&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae0805224652-2"><span class="crayon-p">#</span></div><div class="crayon-line" id="crayon-6495402645ae0805224652-3"><span class="crayon-p"># Table name: product</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae0805224652-4"><span class="crayon-p">#</span></div><div class="crayon-line" id="crayon-6495402645ae0805224652-5"><span class="crayon-p">#&nbsp;&nbsp;id&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :integer&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;not null, primary key</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae0805224652-6"><span class="crayon-p">#&nbsp;&nbsp;product_name&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :string(255)</span></div><div class="crayon-line" id="crayon-6495402645ae0805224652-7"><span class="crayon-p">#&nbsp;&nbsp;price&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:float(24)</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae0805224652-8"><span class="crayon-p">#&nbsp;&nbsp;product_code&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :string(255)</span></div><div class="crayon-line" id="crayon-6495402645ae0805224652-9"><span class="crayon-p">#&nbsp;&nbsp;created_at&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :datetime&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; not null</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae0805224652-10"><span class="crayon-p">#&nbsp;&nbsp;updated_at&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :datetime&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; not null</span></div><div class="crayon-line" id="crayon-6495402645ae0805224652-11"><span class="crayon-p">#</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae0805224652-12"><span class="crayon-p">#</span></div><div class="crayon-line" id="crayon-6495402645ae0805224652-13"><span class="crayon-t">class</span><span class="crayon-h"> </span><span class="crayon-i">Product</span><span class="crayon-h"> </span><span class="crayon-h">&lt;</span><span class="crayon-h"> </span><span class="crayon-i">ActiveRecord</span><span class="crayon-sy">:</span><span class="crayon-sy">:</span><span class="crayon-e">Base</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae0805224652-14"><span class="crayon-st">end</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<p>いろいろと省略しますが、システムとして登録される商品の値段の通貨が日本円のときだけ、priceの型をintegerにしたいというvalidationがあれば下記のようにします。</p>
<p></p>

		<div id="crayon-6495402645ae5672348118" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
# == Schema Information                                            
#
# Table name: product
#
#  id                     :integer          not null, primary key
#  product_name           :string(255)
#  price                  :float(24)
#  product_code           :string(255)
#  created_at             :datetime         not null
#  updated_at             :datetime         not null
#
#
class Product &lt; ActiveRecord::Base
　　with_options if: :jpy? do
　　　　validates :price, presence: true, numericality: { only_integer: true }
　　end

　　def jpy?
　　　　return true if 基軸通貨が日本円かどうか
　　　　false
　　end
end</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402645ae5672348118-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-2">2</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-4">4</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-6">6</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-8">8</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-10">10</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-12">12</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-13">13</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-14">14</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-15">15</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-16">16</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-17">17</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-18">18</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-19">19</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-20">20</div><div class="crayon-num" data-line="crayon-6495402645ae5672348118-21">21</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402645ae5672348118-22">22</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402645ae5672348118-1"><span class="crayon-p"># == Schema Information&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-2"><span class="crayon-p">#</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-3"><span class="crayon-p"># Table name: product</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-4"><span class="crayon-p">#</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-5"><span class="crayon-p">#&nbsp;&nbsp;id&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :integer&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;not null, primary key</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-6"><span class="crayon-p">#&nbsp;&nbsp;product_name&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :string(255)</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-7"><span class="crayon-p">#&nbsp;&nbsp;price&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:float(24)</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-8"><span class="crayon-p">#&nbsp;&nbsp;product_code&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :string(255)</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-9"><span class="crayon-p">#&nbsp;&nbsp;created_at&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :datetime&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; not null</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-10"><span class="crayon-p">#&nbsp;&nbsp;updated_at&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :datetime&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; not null</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-11"><span class="crayon-p">#</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-12"><span class="crayon-p">#</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-13"><span class="crayon-t">class</span><span class="crayon-h"> </span><span class="crayon-i">Product</span><span class="crayon-h"> </span><span class="crayon-h">&lt;</span><span class="crayon-h"> </span><span class="crayon-i">ActiveRecord</span><span class="crayon-sy">:</span><span class="crayon-sy">:</span><span class="crayon-i">Base</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-14">　　<span class="crayon-e">with_options </span><span class="crayon-st">if</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-i">jpy</span><span class="crayon-sy">?</span><span class="crayon-h"> </span><span class="crayon-st">do</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-15">　　　　<span class="crayon-i">validates</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-i">price</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-i">presence</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-t">true</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-i">numericality</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-sy">{</span><span class="crayon-h"> </span><span class="crayon-i">only_integer</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-t">true</span><span class="crayon-h"> </span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-16">　　<span class="crayon-st">end</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-17">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-18">　　<span class="crayon-e">def </span><span class="crayon-i">jpy</span><span class="crayon-sy">?</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-19">　　　　<span class="crayon-st">return</span><span class="crayon-h"> </span><span class="crayon-t">true</span><span class="crayon-h"> </span><span class="crayon-st">if</span><span class="crayon-h"> </span>基軸通貨が日本円かどうか</div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-20">　　　　<span class="crayon-t">false</span></div><div class="crayon-line" id="crayon-6495402645ae5672348118-21">　　<span class="crayon-st">end</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402645ae5672348118-22"><span class="crayon-st">end</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>のような形で書く事ができます。on contextより汎用性が高いと思います。</p>

状況によってvalidationを変える（Ruby on Rails）その2

<h3>前置き</h3>
<div style="padding-left: 15px;">
  Windowsでは細かなアップデートも不用意にしてはいけないのが似非自作erにとっては常識となりつつある昨今。</p>
<p>  Macのメジャーアップデートの「MacOS Sierra」が出たばかりでなんの情報も無い状態でアップデートした人柱レポートとなります。</p></div>
<h3>結果から</h3>
<div style="padding-left: 15px;">
<ul>
<li><strong>幾つかのアプリが動作しなくなりました</strong>。<br />
      主にOSの基本動作に関係する以下のアプリが未対応状況＠2016.10.25</li>
<ol>
<li>XtraFinder<br />
        Finderの機能拡張アプリ</li>
<li>Karabiner<br />
        キーボードのマッピングやちょっとした機能などのカスタマイズアプリ</li>
<li>viChrome<br />
    Chromeの拡張アドオン<br />
    vim風にカスタマイズ出来るのですが、急に使えなく。。OSとは無関係の可能性はあり</li>
</ol>
<li><strong>代わりにあいほんユーザーおなじみの「Siri」が使えます</strong>。<br />
  <u>SiriかわいいよSiri</u>.<br />
  暇人、友達の居ない人には優しいSiri登場です。</p>
<p>  泥ユーザーは「OK Google」と連呼してみましょう。拗ねます。</p>
<p>  iPhoneなどとの連携機能は増えたようですが、泥ユーザーにとってはあまりメリット無し。</li>
<li><strong>全体的にもっさり</strong><br />
    たまに虹玉がぐるぐる回ります。<br />
    以前はそんなことなかったのに</li>
<li><strong>ピクチャ イン ピクチャ機能</strong><br />
    一言で言えばブラウザ(実質Safari限定)から動画部分を抜き取ってウィンドウ表示<br />
    これはYoutubeなどを巡回するユーザーにとっては便利ではないでしょうか。</li>
</ul>
</div>
<h3>検証したこと・情報</h3>
<div style="padding-left: 15px;">
  アプリに関しては大元のサイトにて「MacOS Sierra not Supported」的な情報のみにて終了。</p>
<p>  viChromeは特に情報が無く、試行錯誤中です。</p>
<p>  ピクチャ イン ピクチャはChromeでもアドオンがあって再現出来るそうですが、<br />
  https://chrome.google.com/webstore/detail/picture-in-picture-viewer/efaagmolahogmekmnmkigonhfcdiemnl/related<br />
  Chrome自体をカスタマイズしないと動作しないようなのでスルーしました。</p></div>
<h3>まとめ</h3>
<div style="padding-left: 15px;">
  結果的に言えばフライング感が否めません。</p>
<p>  セキュリティ等のアップデートはあるだろうと思うので一概にしなくても良いとも言えない。</p>
<p>  ただし普段の使い勝手などの側面からすればマイナスが目立つ。</p>
<p>  ご参考になれば幸いです</p></div>


MacOS Sierra人柱レビュー

RailsにCapistranoによる自動デプロイの導入

<p>レスポンシブデザインでは、<br />
PC、タブレット、スマホそれぞれに合わせて、フォントサイズを変更するということが多いと思います。</p>
<p>その際、タイトルなどのアイコンを、<br />
CSSでのアイコンの大きさや背景画像などをpxによって行っていた場合、<br />
フォントサイズごとに指定の変更を行う必要が出てきます。</p>
<p>私はずっとそうしてきたのですが、<br />
そうすると、アイコンが追加になったり、変更になった場合に、多くのCSSコードを追加・変更しなければならなくなるため、<br />
非常に面倒なことになります。</p>
<p>しかし、以下のサイトで、</p>
<p><a class="link" href="http://coliss.com/articles/build-websites/operation/css/resizeable-components-with-relative-units.html" target="_blank" rel="noopener">CSSの単位（em, rem）を使った、これから取り入れていきたい実装テクニックのまとめ | コリス</a></p>
<p>CSSでの単位として、emを積極的に使うことで、<br />
問題が解決されることを知りましたので、試しにやってみました。</p>
<p><a class="demo" href="/demo/ninomiya/121/">DEMO</a></p>
<h2>例</h2>
<p></p>

		<div id="crayon-649540264504a425741992" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
h2::before {
  content: "";
  display: inline-block;
  width: 1.333333em;
  height: 1.333333em;
  margin-right: 0.5em;
  background-image: url(images/icons.png);
  background-size: 10.416667em auto;
  vertical-align: middle;
}
.ttl-chat::before {
  background-position: 0 0;
}
.ttl-pc::before {
  background-position: -1.458333em 0;
}
.ttl-sp::before {
  background-position: -2.916667em 0;
}
.ttl-calender::before {
  background-position: -4.375em 0;
}</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-649540264504a425741992-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-2">2</div><div class="crayon-num" data-line="crayon-649540264504a425741992-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-4">4</div><div class="crayon-num" data-line="crayon-649540264504a425741992-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-6">6</div><div class="crayon-num" data-line="crayon-649540264504a425741992-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-8">8</div><div class="crayon-num" data-line="crayon-649540264504a425741992-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-10">10</div><div class="crayon-num" data-line="crayon-649540264504a425741992-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-12">12</div><div class="crayon-num" data-line="crayon-649540264504a425741992-13">13</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-14">14</div><div class="crayon-num" data-line="crayon-649540264504a425741992-15">15</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-16">16</div><div class="crayon-num" data-line="crayon-649540264504a425741992-17">17</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-18">18</div><div class="crayon-num" data-line="crayon-649540264504a425741992-19">19</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-20">20</div><div class="crayon-num" data-line="crayon-649540264504a425741992-21">21</div><div class="crayon-num crayon-striped-num" data-line="crayon-649540264504a425741992-22">22</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-649540264504a425741992-1"><span class="crayon-i">h2</span><span class="crayon-sy">:</span><span class="crayon-sy">:</span><span class="crayon-e">before</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-2"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">content</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">""</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264504a425741992-3"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">display</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-i">inline</span>-<span class="crayon-i">block</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-4"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">width</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-cn">1.333333em</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264504a425741992-5"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">height</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-cn">1.333333em</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-6"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">margin</span>-<span class="crayon-i">right</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-cn">0.5em</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264504a425741992-7"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">background</span>-<span class="crayon-i">image</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-e">url</span><span class="crayon-sy">(</span><span class="crayon-i">images</span>/<span class="crayon-i">icons</span><span class="crayon-sy">.</span><span class="crayon-i">png</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-8"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">background</span>-<span class="crayon-i">size</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-cn">10.416667em</span><span class="crayon-h"> </span><span class="crayon-i">auto</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264504a425741992-9"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">vertical</span>-<span class="crayon-i">align</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-i">middle</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-10"><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-649540264504a425741992-11"><span class="crayon-sy">.</span><span class="crayon-i">ttl</span>-<span class="crayon-i">chat</span><span class="crayon-sy">:</span><span class="crayon-sy">:</span><span class="crayon-e">before</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-12"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">background</span>-<span class="crayon-i">position</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264504a425741992-13"><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-14"><span class="crayon-sy">.</span><span class="crayon-i">ttl</span>-<span class="crayon-i">pc</span><span class="crayon-sy">:</span><span class="crayon-sy">:</span><span class="crayon-e">before</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-649540264504a425741992-15"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">background</span>-<span class="crayon-i">position</span><span class="crayon-sy">:</span><span class="crayon-h"> </span>-<span class="crayon-cn">1.458333em</span><span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-16"><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-649540264504a425741992-17"><span class="crayon-sy">.</span><span class="crayon-i">ttl</span>-<span class="crayon-i">sp</span><span class="crayon-sy">:</span><span class="crayon-sy">:</span><span class="crayon-e">before</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-18"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">background</span>-<span class="crayon-i">position</span><span class="crayon-sy">:</span><span class="crayon-h"> </span>-<span class="crayon-cn">2.916667em</span><span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-649540264504a425741992-19"><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-20"><span class="crayon-sy">.</span><span class="crayon-i">ttl</span>-<span class="crayon-i">calender</span><span class="crayon-sy">:</span><span class="crayon-sy">:</span><span class="crayon-e">before</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-649540264504a425741992-21"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">background</span>-<span class="crayon-i">position</span><span class="crayon-sy">:</span><span class="crayon-h"> </span>-<span class="crayon-cn">4.375em</span><span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-649540264504a425741992-22"><span class="crayon-sy">}</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>今回の例では、</p>
<ol>
<li>width, height</li>
<li>background-size</li>
<li>background-position</li>
</ol>
<p>について、emを使った指定を行ってみました。</p>
<p>設定するときは、pxをemへ置き換えるための計算をしなくていはいけないので、若干手間のように感じますが、<br />
一つ設定してしまえば、あとは、font-sizeごとに設定する必要が無いため、<br />
全体としては手間を減らすことができました。</p>
<p>注意点としては、emで指定する場合、小数点6桁くらいまでは指定しないと、微妙にずれてしまうことがあるようです。</p>
<p>今後はこの方法を使っていきたいと思います。</p>
<p>&nbsp;</p>
<h3>追記(2019.09.10)：</h3>
<p><a href="https://launchcart.jp/blog/img%e3%82%bf%e3%82%b0%e3%81%a7%e8%aa%ad%e3%81%bf%e8%be%bc%e3%82%93%e3%81%a01%e3%81%a4%e3%81%aesvg%e7%94%bb%e5%83%8f%e3%82%92id%e3%81%a7%e5%87%ba%e3%81%97%e5%88%86%e3%81%91%e3%82%8b%e6%96%b9%e6%b3%95/" target="_blank" rel="noopener">1つのSVGでアイコンを出し分ける方法</a>を紹介しました</p>

【CSS】レスポンシブでは画像を使ったアイコンの指定をemで行う

<p>CentOS6.7にて、SSL VersionをNSSからOpenSSLに変更する際に、curlのバージョンアップが必要があったため、それを記事にしてみました。</p>
<p>現状のバージョンは下記コマンドで確認できます。</p>

		<div id="crayon-6495402644bea586191189" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
curl --version</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644bea586191189-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644bea586191189-1"><span class="crayon-i">curl</span><span class="crayon-h"> </span>--<span class="crayon-i">version</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>私が実行した環境では、curl 7.19.7でした。</p>
<p>いくつか必要なモジュールをインストールします。</p>

		<div id="crayon-6495402644bee322939001" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
yum install openssl-devel libmetalink-devel libssh2-devel c-ares-devel lbzip2</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644bee322939001-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644bee322939001-1"><span class="crayon-e">yum </span><span class="crayon-e">install </span><span class="crayon-i">openssl</span>-<span class="crayon-e">devel </span><span class="crayon-i">libmetalink</span>-<span class="crayon-e">devel </span><span class="crayon-i">libssh2</span>-<span class="crayon-i">devel</span><span class="crayon-h"> </span><span class="crayon-i">c</span>-<span class="crayon-i">ares</span>-<span class="crayon-e">devel </span><span class="crayon-i">lbzip2</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<p>curlのソースを落としてきます。<br />
最新のものは<br />
<a href="https://curl.haxx.se/download.html" target="_blank">https://curl.haxx.se/download.html</a><br />
より確認ができます。</p>

		<div id="crayon-6495402644bf0119489904" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
wget https://curl.haxx.se/download/curl-7.50.3.tar.gz</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644bf0119489904-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644bf0119489904-1"><span class="crayon-e">wget </span><span class="crayon-i">https</span><span class="crayon-sy">:</span><span class="crayon-c">//curl.haxx.se/download/curl-7.50.3.tar.gz</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<p>コンパイルし、インストールします。</p>

		<div id="crayon-6495402644bf1315921386" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
tar xfvz curl-7.50.3.tar.gz
 cd curl-7.37.0
./configure --enable-libcurl-option
make
sudo make install</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644bf1315921386-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644bf1315921386-2">2</div><div class="crayon-num" data-line="crayon-6495402644bf1315921386-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644bf1315921386-4">4</div><div class="crayon-num" data-line="crayon-6495402644bf1315921386-5">5</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644bf1315921386-1"><span class="crayon-e">tar </span><span class="crayon-e">xfvz </span><span class="crayon-i">curl</span>-<span class="crayon-cn">7.50.3.tar.gz</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644bf1315921386-2"><span class="crayon-h"> </span><span class="crayon-e">cd </span><span class="crayon-i">curl</span>-<span class="crayon-cn">7.37.0</span></div><div class="crayon-line" id="crayon-6495402644bf1315921386-3"><span class="crayon-sy">.</span>/<span class="crayon-i">configure</span><span class="crayon-h"> </span>--<span class="crayon-i">enable</span>-<span class="crayon-i">libcurl</span>-<span class="crayon-e">option</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644bf1315921386-4"><span class="crayon-e">make</span></div><div class="crayon-line" id="crayon-6495402644bf1315921386-5"><span class="crayon-e">sudo </span><span class="crayon-e">make </span><span class="crayon-i">install</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<p>以上で、インストールは終わりです。</p>

		<div id="crayon-6495402644bf2549218699" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
curl --version</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644bf2549218699-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644bf2549218699-1"><span class="crayon-i">curl</span><span class="crayon-h"> </span>--<span class="crayon-i">version</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>にて、バージョンが変更されていれば、成功です。</p>

curl-logo.png

cURLの最新版をインストールする

<h3>バルクインサート／アップデートとは？</h3>
<div style="padding-left: 15px;">
  一言で言えば「一括でデータの挿入・更新をする」です。</p>
<p>  symfonyではDoctrineというモノを経由して<br />
  データの登録・更新処理をしています。</p></div>
<h3>メリットデメリット</h3>
<div style="padding-left: 15px;">
  メリット<br />
  一括でアプリケーション側から実施するためデータ更新のタイミングがズレない<br />
  一つでも失敗したら全て例外として”実行されない&#8221;</p>
<p>  デメリット<br />
  大量のデータ更新・登録の際にDBへの負荷が大きい<br />
  上記に伴って失敗したら何も更新されない</p></div>
<h3>デメリットの解消法</h3>
<div style="padding-left: 15px;">
  サーバーのスペック等によって一括処理のしきい値をアプリケーションレベルで設定する。</p>
<p>  以下はSymfonyのDoctrineを介した更新時の例</p>
<p></p>

		<div id="crayon-6495402644a10477269043" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">PHP</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
  $em = $this-&gt;get('doctrine')-&gt;getEntityManager();
  $cnt = 0;
  $bulk_num = 10;// 同時に更新するデータの単位
  // 処理
  // 適当なループ
  foreach ($hoges as $hoge) {
      // 登録
      $em-&gt;persist($hoge);
      if (($cnt % $bulk_num) == ) {
          $em-&gt;flush();
      }
      $cnt++;
  }
  $em-&gt;flush();</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644a10477269043-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644a10477269043-2">2</div><div class="crayon-num" data-line="crayon-6495402644a10477269043-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644a10477269043-4">4</div><div class="crayon-num" data-line="crayon-6495402644a10477269043-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644a10477269043-6">6</div><div class="crayon-num" data-line="crayon-6495402644a10477269043-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644a10477269043-8">8</div><div class="crayon-num" data-line="crayon-6495402644a10477269043-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644a10477269043-10">10</div><div class="crayon-num" data-line="crayon-6495402644a10477269043-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644a10477269043-12">12</div><div class="crayon-num" data-line="crayon-6495402644a10477269043-13">13</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644a10477269043-14">14</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644a10477269043-1"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-v">$em</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">get</span><span class="crayon-sy">(</span><span class="crayon-s">'doctrine'</span><span class="crayon-sy">)</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">getEntityManager</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644a10477269043-2"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-v">$cnt</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-cn">0</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-6495402644a10477269043-3"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-v">$bulk_num</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-cn">10</span><span class="crayon-sy">;</span><span class="crayon-c">// 同時に更新するデータの単位</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644a10477269043-4"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-c">// 処理</span></div><div class="crayon-line" id="crayon-6495402644a10477269043-5"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-c">// 適当なループ</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644a10477269043-6"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-st">foreach</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-v">$hoges</span><span class="crayon-h"> </span><span class="crayon-st">as</span><span class="crayon-h"> </span><span class="crayon-v">$hoge</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-6495402644a10477269043-7"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-c">// 登録</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644a10477269043-8"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$em</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">persist</span><span class="crayon-sy">(</span><span class="crayon-v">$hoge</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-6495402644a10477269043-9"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-st">if</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-sy">(</span><span class="crayon-v">$cnt</span><span class="crayon-h"> </span><span class="crayon-sy">%</span><span class="crayon-h"> </span><span class="crayon-v">$bulk_num</span><span class="crayon-sy">)</span><span class="crayon-h"> </span>==<span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644a10477269043-10"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$em</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">flush</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-6495402644a10477269043-11"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644a10477269043-12"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$cnt</span>++<span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-6495402644a10477269043-13"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644a10477269043-14"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-v">$em</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">flush</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<p>  概要は<br />
  「データ登録毎にカウントしていき、しきい値に達した時点で初めて登録を実行する(flush)」</p></div>

symfonyでバルクインサート・アップデート

<p>もともとCarrierWaveを使用してファイルをサーバーに保存していたものを、S3(Amazon Simple Storage Service)に変更する場合の手続きを記事にしてみました。</p>
<h2>AWS側での設定</h2>
<h3>S3でバケットの作成</h3>
<p>s3でのバケットの作成を行う。</p>
<h3>IAM(Identity and Access Management)にてユーザーの作成</h3>
<p>AWSのIAMにてユーザーの作成を行う。<br />
ユーザー作成を行った際に、Access Key Id、Secret Access Keyが発行されるので保存しておく（csvダウンロードできる）。<br />
また、アクセス許可からポリシーのアタッチができるので、AmazonS3FullAccessの付与を行っておく。</p>
<h2>Rails側での設定</h2>
<h3>Gemfileにfogの追加</h3>
<p>Gemfileに下記を追加。</p>

		<div id="crayon-64954026445ff472658899" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
gem 'fog'</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64954026445ff472658899-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64954026445ff472658899-1"><span class="crayon-i">gem</span><span class="crayon-h"> </span><span class="crayon-s">'fog'</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<h3>CarrierWaveのUploadクラスの修正</h3>
<h4>storage先の変更</h4>
<p></p>

		<div id="crayon-6495402644603480573714" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
# Choose what kind of storage to use for this uploader:
# storage :file
storage :fog</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644603480573714-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644603480573714-2">2</div><div class="crayon-num" data-line="crayon-6495402644603480573714-3">3</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644603480573714-1"><span class="crayon-p"># Choose what kind of storage to use for this uploader:</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644603480573714-2"><span class="crayon-p"># storage :file</span></div><div class="crayon-line" id="crayon-6495402644603480573714-3"><span class="crayon-i">storage</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-i">fog</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>fogを使用する前は、storageがfileになっていると思うので、そちらをコメントアウトし、storage先をfogに変更します。</p>
<h3>CarrierWaveの設定ファイルの修正</h3>
<p>config/initializers/carrierwave.rb<br />
に追記を行う。もし、今までに作成していなければここで作成する（railsでCarrierWave導入時に自動作成はされない）。</p>
<p></p>

		<div id="crayon-6495402644605519607213" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
CarrierWave.configure do |config|
  config.fog_credentials = {
    provider: 'AWS',
    aws_access_key_id: '{{ Access Key Id }}',
    aws_secret_access_key: '{{ Secret Access Key }}',
    region: '{{ region }}'
  }

  config.fog_directory = '{{ bucket name }}'
  config.asset_host = 'https://s3-{{ region }}.amazonaws.com/{{ bucket name }}'
end</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402644605519607213-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644605519607213-2">2</div><div class="crayon-num" data-line="crayon-6495402644605519607213-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644605519607213-4">4</div><div class="crayon-num" data-line="crayon-6495402644605519607213-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644605519607213-6">6</div><div class="crayon-num" data-line="crayon-6495402644605519607213-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644605519607213-8">8</div><div class="crayon-num" data-line="crayon-6495402644605519607213-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402644605519607213-10">10</div><div class="crayon-num" data-line="crayon-6495402644605519607213-11">11</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402644605519607213-1"><span class="crayon-i">CarrierWave</span><span class="crayon-sy">.</span><span class="crayon-e">configure </span><span class="crayon-st">do</span><span class="crayon-h"> </span><span class="crayon-sy">|</span><span class="crayon-i">config</span><span class="crayon-sy">|</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644605519607213-2"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">config</span><span class="crayon-sy">.</span><span class="crayon-i">fog_credentials</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-6495402644605519607213-3"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-i">provider</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">'AWS'</span><span class="crayon-sy">,</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644605519607213-4"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-i">aws_access_key_id</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">'{{ Access Key Id }}'</span><span class="crayon-sy">,</span></div><div class="crayon-line" id="crayon-6495402644605519607213-5"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-i">aws_secret_access_key</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">'{{ Secret Access Key }}'</span><span class="crayon-sy">,</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644605519607213-6"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-i">region</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">'{{ region }}'</span></div><div class="crayon-line" id="crayon-6495402644605519607213-7"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644605519607213-8">&nbsp;</div><div class="crayon-line" id="crayon-6495402644605519607213-9"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">config</span><span class="crayon-sy">.</span><span class="crayon-i">fog_directory</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-s">'{{ bucket name }}'</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402644605519607213-10"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">config</span><span class="crayon-sy">.</span><span class="crayon-i">asset_host</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-s">'https://s3-{{ region }}.amazonaws.com/{{ bucket name }}'</span></div><div class="crayon-line" id="crayon-6495402644605519607213-11"><span class="crayon-st">end</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<p>上記の設定を行う。<br />
{{ Access Key Id }}、{{ Secret Access Key }}　: IAM(Identity and Access Management)にてユーザーの作成にて、取得できる。<br />
{{ region }} :　東京リージョンであれば、ap-northeast-1などとなる。<br />
{{ bucket name }} : s3で作成したバケット名。<br />
開発環境によって、バケット名を変える場合はここで行うこともできる。</p>
<p>以上で設定はおわりで、アプリケーションから画像をアップロードすれば、S3にファイルがアップロードされる。</p>
<h2>おわりに</h2>
<p>carrierwaveやfogを使用しない場合は、aws-sdkを使用することになる。<br />
<a href="http://docs.aws.amazon.com/AWSRubySDK/latest/AWS.html" target="_blank">Module: AWS &#8211; http://docs.aws.amazon.com/AWSRubySDK/latest/AWS.html</a></p>

RailsのアプリケーションからS3にファイルをアップロードする

<p>仮想環境であるVagrantへ同じwifi環境下にある他の端末から接続する方法を記事にしてみました。</p>
<h2>Vagrantfileの編集</h2>
<p>Vagrantfileを下記のように編集します。</p>

		<div id="crayon-6495402643ce6084678411" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
config.vm.network "public_network"</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643ce6084678411-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643ce6084678411-1"><span class="crayon-i">config</span><span class="crayon-sy">.</span><span class="crayon-i">vm</span><span class="crayon-sy">.</span><span class="crayon-i">network</span><span class="crayon-h"> </span><span class="crayon-s">"public_network"</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<h2>Vagranの起動・再起動</h2>
<p>vagrantの起動あるいは再起動を行います。<br />
実行すると、下記のように問われるので１を選択します。</p>

		<div id="crayon-6495402643cea378820774" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
==&gt; default: Available bridged network interfaces:
1) en0: Wi-Fi (AirPort)
2) en1: Thunderbolt 1
3) en2: Thunderbolt 2
4) p2p0
5) awdl0
6) bridge0
==&gt; default: When choosing an interface, it is usually the one that is
==&gt; default: being used to connect to the internet.
    default: Which interface should the network bridge to? 1
==&gt; default: Preparing network interfaces based on configuration...</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643cea378820774-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643cea378820774-2">2</div><div class="crayon-num" data-line="crayon-6495402643cea378820774-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643cea378820774-4">4</div><div class="crayon-num" data-line="crayon-6495402643cea378820774-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643cea378820774-6">6</div><div class="crayon-num" data-line="crayon-6495402643cea378820774-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643cea378820774-8">8</div><div class="crayon-num" data-line="crayon-6495402643cea378820774-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643cea378820774-10">10</div><div class="crayon-num" data-line="crayon-6495402643cea378820774-11">11</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643cea378820774-1">==<span class="crayon-h">&gt;</span><span class="crayon-h"> </span><span class="crayon-st">default</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-e">Available </span><span class="crayon-e">bridged </span><span class="crayon-e">network </span><span class="crayon-i">interfaces</span><span class="crayon-sy">:</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643cea378820774-2"><span class="crayon-cn">1</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">en0</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-i">Wi</span>-<span class="crayon-e">Fi</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-i">AirPort</span><span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-6495402643cea378820774-3"><span class="crayon-cn">2</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">en1</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-i">Thunderbolt</span><span class="crayon-h"> </span><span class="crayon-cn">1</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643cea378820774-4"><span class="crayon-cn">3</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">en2</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-i">Thunderbolt</span><span class="crayon-h"> </span><span class="crayon-cn">2</span></div><div class="crayon-line" id="crayon-6495402643cea378820774-5"><span class="crayon-cn">4</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">p2p0</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643cea378820774-6"><span class="crayon-cn">5</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">awdl0</span></div><div class="crayon-line" id="crayon-6495402643cea378820774-7"><span class="crayon-cn">6</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-i">bridge0</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643cea378820774-8">==<span class="crayon-h">&gt;</span><span class="crayon-h"> </span><span class="crayon-st">default</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-e">When </span><span class="crayon-e">choosing </span><span class="crayon-e">an </span><span class="crayon-t">interface</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-e">it </span><span class="crayon-st">is</span><span class="crayon-h"> </span><span class="crayon-e">usually </span><span class="crayon-e">the </span><span class="crayon-e">one </span><span class="crayon-e">that </span><span class="crayon-st">is</span></div><div class="crayon-line" id="crayon-6495402643cea378820774-9">==<span class="crayon-h">&gt;</span><span class="crayon-h"> </span><span class="crayon-st">default</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-e">being </span><span class="crayon-e">used </span><span class="crayon-st">to</span><span class="crayon-h"> </span><span class="crayon-e">connect </span><span class="crayon-st">to</span><span class="crayon-h"> </span><span class="crayon-e">the </span><span class="crayon-i">internet</span><span class="crayon-sy">.</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643cea378820774-10"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-st">default</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-e">Which </span><span class="crayon-t">interface</span><span class="crayon-h"> </span><span class="crayon-e">should </span><span class="crayon-e">the </span><span class="crayon-e">network </span><span class="crayon-e">bridge </span><span class="crayon-st">to</span><span class="crayon-sy">?</span><span class="crayon-h"> </span><span class="crayon-cn">1</span></div><div class="crayon-line" id="crayon-6495402643cea378820774-11">==<span class="crayon-h">&gt;</span><span class="crayon-h"> </span><span class="crayon-st">default</span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-e">Preparing </span><span class="crayon-e">network </span><span class="crayon-e">interfaces </span><span class="crayon-e">based </span><span class="crayon-e">on </span><span class="crayon-i">configuration</span><span class="crayon-sy">.</span><span class="crayon-sy">.</span><span class="crayon-sy">.</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p></p>
<h2>DHCPアドレスの確認</h2>
<p>vagrantに接続し、ifconfigコマンドによりDHCPにより割りあてられたipアドレスを確認します。</p>

		<div id="crayon-6495402643cec778779991" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
ifconfig | grep "inet addr"
          inet addr:10.0.2.15  Bcast:10.0.2.255  Mask:255.255.255.0
          inet addr:192.168.33.101  Bcast:192.168.33.255  Mask:255.255.255.0
          inet addr:192.168.31.223  Bcast:192.168.31.255  Mask:255.255.255.0
          inet addr:127.0.0.1  Mask:255.0.0.0</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643cec778779991-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643cec778779991-2">2</div><div class="crayon-num" data-line="crayon-6495402643cec778779991-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643cec778779991-4">4</div><div class="crayon-num" data-line="crayon-6495402643cec778779991-5">5</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643cec778779991-1"><span class="crayon-i">ifconfig</span><span class="crayon-h"> </span><span class="crayon-sy">|</span><span class="crayon-h"> </span><span class="crayon-i">grep</span><span class="crayon-h"> </span><span class="crayon-s">"inet addr"</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643cec778779991-2"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-e">inet </span><span class="crayon-i">addr</span><span class="crayon-sy">:</span><span class="crayon-cn">10.0.2.15</span><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">Bcast</span><span class="crayon-sy">:</span><span class="crayon-cn">10.0.2.255</span><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">Mask</span><span class="crayon-sy">:</span><span class="crayon-cn">255.255.255.0</span></div><div class="crayon-line" id="crayon-6495402643cec778779991-3"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-e">inet </span><span class="crayon-i">addr</span><span class="crayon-sy">:</span><span class="crayon-cn">192.168.33.101</span><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">Bcast</span><span class="crayon-sy">:</span><span class="crayon-cn">192.168.33.255</span><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">Mask</span><span class="crayon-sy">:</span><span class="crayon-cn">255.255.255.0</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643cec778779991-4"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-e">inet </span><span class="crayon-i">addr</span><span class="crayon-sy">:</span><span class="crayon-cn">192.168.31.223</span><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">Bcast</span><span class="crayon-sy">:</span><span class="crayon-cn">192.168.31.255</span><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">Mask</span><span class="crayon-sy">:</span><span class="crayon-cn">255.255.255.0</span></div><div class="crayon-line" id="crayon-6495402643cec778779991-5"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-e">inet </span><span class="crayon-i">addr</span><span class="crayon-sy">:</span><span class="crayon-cn">127.0.0.1</span><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-i">Mask</span><span class="crayon-sy">:</span><span class="crayon-cn">255.0.0.0</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>上の状況の場合、192.168.31.223が割り当てられたアドレスです。</p>
<p>以上で設定は終わりで、他の端末より192.168.31.223にアクセスすることが可能となります。</p>
<h2>参考</h2>
<p><a href="https://www.vagrantup.com/docs/networking/public_network.html">Public Networks &#8211; Networking &#8211; Vagrant by HashiCorp</a></p>

Vagrantのpublic networkを使用する

<h3>多言語対応</h3>
<div style="padding-left: 15px;">
  Symfonyでの国際化対応をした備忘録です。</p>
<p>  データの項目名など対応も可能。</p>
<p>  今回は主にエラー文言に対応しました。</p></div>
<h3>準備</h3>
<div style="padding-left: 15px;">
  特に必要なし</div>
<h3>記述方法</h3>
<div style="padding-left: 15px;">
  同じエラー文言でも記述ファイルが異なることがあります。</p>
<p>  FormTypeなどフォーム入力時に編集するのは</p>

		<div id="crayon-6495402643ac4854253010" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">Shell</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
src/Application/BackendBundle/Resources/translations/validators.ja.yml</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643ac4854253010-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643ac4854253010-1"><span class="crayon-i">src</span>/<span class="crayon-i">Application</span>/<span class="crayon-i">BackendBundle</span>/<span class="crayon-i">Resources</span>/<span class="crayon-i">translations</span>/<span class="crayon-i">validators</span><span class="crayon-e">.ja</span><span class="crayon-e">.yml</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>などです。</p>
<p>  拡張子の直前にあるドットで囲まれた文字列が<u>言語識別子</u>です。<br />
  日本語ならja, 英語ならen。</p>
<p>  以下のようにvalidators.ja.ymlでエラーを定義し</p>

		<div id="crayon-6495402643ad3884024846" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">YAML</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
  consumer:
    password:
      not_blank: パスワードは必須入力です</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643ad3884024846-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643ad3884024846-2">2</div><div class="crayon-num" data-line="crayon-6495402643ad3884024846-3">3</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643ad3884024846-1"><span class="crayon-h">&nbsp;&nbsp;</span>consumer<span class="">:</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643ad3884024846-2"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span>password<span class="">:</span></div><div class="crayon-line" id="crayon-6495402643ad3884024846-3"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>not<span class="crayon-sy">_</span>blank<span class="">: パスワードは必須入力です</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<p>  FormType側ではコロンとインデントで句切られた定義文字列を<br />
  ドットで以下のように渡せば言語ごとに上記の validators.{{ language code }}.yml を読み取ってくれます。</p>
<p></p>

		<div id="crayon-6495402643ad5252975328" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">PHP</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
  // ja言語に設定
  $this-&gt;container-&gt;get('translator')-&gt;setLocale('ja');
  $_trans = $this-&gt;container-&gt;get('translator');
  if (empty($consumer-&gt;password)) {
      $form['password']-&gt;addError(new FormError($_trans-&gt;trans('consumer.password.not_blank')));
  }</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643ad5252975328-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643ad5252975328-2">2</div><div class="crayon-num" data-line="crayon-6495402643ad5252975328-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643ad5252975328-4">4</div><div class="crayon-num" data-line="crayon-6495402643ad5252975328-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-6495402643ad5252975328-6">6</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643ad5252975328-1"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-c">// ja言語に設定</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643ad5252975328-2"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">container</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">get</span><span class="crayon-sy">(</span><span class="crayon-s">'translator'</span><span class="crayon-sy">)</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">setLocale</span><span class="crayon-sy">(</span><span class="crayon-s">'ja'</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-6495402643ad5252975328-3"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-v">$_trans</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">container</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">get</span><span class="crayon-sy">(</span><span class="crayon-s">'translator'</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643ad5252975328-4"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-st">if</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-k ">empty</span><span class="crayon-sy">(</span><span class="crayon-v">$consumer</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">password</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-6495402643ad5252975328-5"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$form</span><span class="crayon-sy">[</span><span class="crayon-s">'password'</span><span class="crayon-sy">]</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">addError</span><span class="crayon-sy">(</span><span class="crayon-r">new</span><span class="crayon-h"> </span><span class="crayon-e">FormError</span><span class="crayon-sy">(</span><span class="crayon-v">$_trans</span>-<span class="crayon-h">&gt;</span><span class="crayon-e">trans</span><span class="crayon-sy">(</span><span class="crayon-s">'consumer.password.not_blank'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-6495402643ad5252975328-6"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<p>  ラベルなどのバリデーション以外での翻訳は以下のようなファイルです</p>

		<div id="crayon-6495402643ad6065784711" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">Shell</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
src/Application/BackendBundle/Resources/translations/messages.ja.yml</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643ad6065784711-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643ad6065784711-1"><span class="crayon-i">src</span>/<span class="crayon-i">Application</span>/<span class="crayon-i">BackendBundle</span>/<span class="crayon-i">Resources</span>/<span class="crayon-i">translations</span>/<span class="crayon-i">messages</span><span class="crayon-e">.ja</span><span class="crayon-e">.yml</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>※ アクティブなBundleや読み込んでいるリソースによって {{ Application/BackendBundle }} 部分は都度変わることあり。</p>
<p>  使用方法は validators と同じです。</p>
<p>  テンプレート(twig)側では</p>

		<div id="crayon-6495402643ad7794125988" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">PHP</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
  {{ consumer.password.not_blank | trans }}</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-6495402643ad7794125988-1">1</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-6495402643ad7794125988-1"><span class="crayon-h">&nbsp;&nbsp;</span><span class="crayon-sy">{</span><span class="crayon-sy">{</span><span class="crayon-h"> </span><span class="crayon-i">consumer</span><span class="crayon-sy">.</span><span class="crayon-i">password</span><span class="crayon-sy">.</span><span class="crayon-i">not_blank</span><span class="crayon-h"> </span><span class="crayon-sy">|</span><span class="crayon-h"> </span><span class="crayon-i">trans</span><span class="crayon-h"> </span><span class="crayon-sy">}</span><span class="crayon-sy">}</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>のように記述すれば同様の言語毎の翻訳文字列が取得可能です。</p></div>

Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧 - タグ: #プログラマー

2017/08/10

2017/07/19

2017/07/11

2017/05/10

2017/05/10

2017/04/12

2017/04/12

2017/03/15

2017/03/15

2016/10/26

2016/10/26

2016/10/12

2016/10/12

2016/09/28

2016/09/28

2016/09/21

2016/09/14

2016/09/14