Wiresharkをインストールする

開発環境は、Windows 7 Professional(32bit)。

1.公式サイトへアクセスする
https://www.wireshark.org/

2.ダウンロードアイコンをクリック

3.Windows Installer (32-bit)をクリックしてインストーラをダウンロード

4.ダウンロードしたインストーラを実行

5.Nextボタンをクリック

6.I Agreeボタンをクリック

7.Nextボタンをクリック

8.Nextボタンをクリック

9.Nextボタンをクリック

10.Nextボタンをクリック

11.Installボタンをクリック

12.インストール中に、WinPcapのインストールが始まるので、Nextボタンをクリック

13.I Agreeボタンをクリック

14.Installボタンをクリック

15.Finishボタンをクリック

16.Wiresharkのインストールが終わったら、Nextボタンをクリック

17.Finishボタンをクリック

Visual Studio Code + Gitをインストールする

開発環境は、Windows 7 Professional(64bit)。

1.公式サイトへアクセス
https://code.visualstudio.com/
2.Download for Windowsと書かれたボタンをクリックし、ダウンロードする

3.ダウンロードしたVSCodeSetup-x64-1.24.1.exeを実行する

4.次へボタンをクリックする

5.同意するにチェックを入れて、次へボタンをクリックする

6.次へボタンをクリックする

7.次へボタンをクリックする

8.デスクトップ上にアイコンを作成するにチェックを入れて、次へボタンをクリックする

9.インストールボタンをクリックする

10.インストールが終了したら、完了ボタンをクリックする

11.Visual Studio Codeが起動します

※すでにGitをインストールしている場合は、パスを指定してください。

12.Gitのダウンロードと書かれたボタンをクリックします

13.Gitのサイトへ飛ばされ、右側にある
青っぽい色のボタンをクリック(自分の場合は、Download 2.17.1 for Windowsと書かれていた)して、ダウンロードする。

14.ダウンロードしたGit-2.17.1.2-64-bit.exeをクリックして実行する。

15.Nextボタンをクリックする

16.Nextボタンをクリックする

17.Nextボタンをクリックする

18.Nextボタンをクリックする

19.Use Visual Studio Code as Git's default Editorを選択して、Nextボタンをクリックする

20.。Use Git from the Windows Command Promptを選択して、Nextボタンをクリックする。Use Git from the Windows Command Promptを選択するとWindowsのコマンドプロンプトで、Gitが使えるようになる。

21.Nextボタンをクリックする

22.Nextボタンをクリックする

23.Nextボタンをクリックする

24.Installボタンをクリックする

25.Finishボタンをクリックする

26.コマンドプロンプトを起動して、

git

と入力して、以下のように表示された、きちんとインストールされています。

もし、すでにコマンドプロンプトを起動していて、gitと入力して、認識されていなければ、コマンドプロンプトを消して、もう一度起動し、gitと入力してみてください。
環境変数PATHへは自動で追加しているはずです。

27.続いて、gitを使用する前に、emailとnameを入力しておかないと、commit(登録みたいなもの)したときに以下のようなメッセージが表示されますので、入力しておきます。

以下のコマンドを順番に入力してください。
emailもnameもダブルクォートの中の値は適当で構いません。

git config --global user.email "you@example.com"
git config --global user.name "Your Name"

28.とりあえず、何か適当なプログラムを書いてみて実行してみます。
rubyで書きますが、すでにrubyのインタプリタはパソコン内に入っているという前提で進めます。
上部にあるファイル - 新規ファイルをクリックします。すると、Untitled-1というファイルが作成されます。

29.以下のコードを入力します。

puts "Hello VS Code!"

そして、test.rbという名前で、C:ドライブ直下に、vscというディレクトリを作成して、そこに入れます。

30.エディタ下部のコンソール部分で、

cd c:\vsc
ruby test.rb

と入力すると実行されます。

参考リンク
Documentation for Visual Studio Code
・使い方を習うならここのFirst Stepの欄が参考になる(英語)

RailsでBootstrap4のパッケージを使ってみる

開発環境は、Windows 7 Professional(32bit) + ruby 2.3.3p222 + Rails 4.2.1。

1.Gemfileに

gem 'boostrap', '~> 4.1.1'

を追加。
2.以下のコマンドでパッケージをインストール。

bundle install

3./app/assets/stylesheets/ディレクトリ内のapplication.cssをapplication.scssにリネームする。
4.application.css内に、

@import "bootstrap";

を追加する。
同時に、

 *= require_tree .
 *= require_self

は削除しておく。
5./app/assets/javascripts/application.js内に

//= require jquery3
//= require popper
//= require bootstrap-sprockets

を追加。
6.テストしてみるために、適当なビューにて、

<%= form_tag("/create", :method => "post") do %>
<%= text_field_tag(:name) %>
<%= text_field_tag(:description) %>
<%= submit_tag("投稿",:class => "btn btn-primary") %>
<% end %>

と入力する。
実行結果

リンクの色やフォントなども変わっています。

参考サイト
GitHub - twbs/bootstrap-rubygem: Bootstrap 4 Ruby Gem for Rails / Sprockets and Compass.
Railsアプリで Bootstrap 4 を利用する
submit_tag - リファレンス - - Railsドキュメント
Buttons · Bootstrap

Railsでデータベースとのやりとりをするメソッドのまとめ

開発環境は、Windows 7 Professional(32bit) + ruby 2.3.3p222 + Rails 4.2.1。

■データを追加する
・postsテーブル(モデル名はpost)のname,ageカラムにデータ(nameカラムにはTaro、ageカラムには20)を入れるとする。今回は以下に4つの方法を書いておく。

post = Post.new
post.name = "Taro"
post.age = 20
post.save

post = Post.new
post.assign_attributes(name: "Taro", age: 20)
post.save

post = Post.new(name: "Taro", age: 20)
post.save

Post.create(name: "Taro", age: 20)

■データを更新する
・idが3のデータのname,ageカラムにデータが入っているとして、新たなデータ(nameカラムには、Hanako、ageカラムには30)を入れて、データを上書きします。以下に3つの方法を書いておきます。

post = Post.find(3)
post.name = "Hanako"
post.age = 30
post.save

post = Post.find(3)
post.assign_attributes(name: "Hanako", age: 30)
post.save

# update_attributesは、assign_attributesとsaveを合わせたようなもの
post = Post.find(3)
post.update_attributes(name: "Hanako", age: 30)

# 取得した複数のレコードを一気に変更する
# urlカラムがhttp://k01ken.hatenablog.com/で始まっているレコードすべてのmobile_friendlyカラムをtrueに変更する
Post.where("url LIKE 'http://k01ken.hatenablog.com/%'").update_all(mobile_friendly: true)

参考リンク
ActiveRecord の attribute 更新方法まとめ

■データを削除する

post = Post.find(1)
post.destroy

■データを取得する

post = Post.first

# allは、Rails 3.2まではすべてのレコードをモデルオブジェクトの配列にして返していた
# Rails 4からは検索条件のないリレーショナルオブジェクトを返すようになった
posts = Post.all

# idが3のデータを取得する。存在しない数字を入力すると例外が発生
post = Post.find(3)

# 任意のカラムを使ってレコードを検索する
# 以下の場合は、nameカラムがTaroのデータを取得する
# なければnilを返す
posts = Post.find_by(name: "Taro")
# カラムは複数指定することができる
posts = Post.find_by(name: "Taro", age: 20)

# where句を使ってデータを取得する
posts = Post.where(name: "Taro")
# whereメソッドを複数つなげることで複数の条件を指定できる。
posts = Post.where(name: "Taro").where(age: 30)
# 文字列で検索条件を指定することもできる。ageが30より小さいものを取得。
posts = Post.where("age < 30")
# WHEREの否定も使える。以下はnameカラムがTaro『でない』データを取得。
posts = Post.where.not(name: "Taro")
# ハッシュの値を配列にすると、複数の候補のどれかと同じなら取得。
posts = Post.where(id: [2,7,13])
# ハッシュの値を範囲オブジェクトにすると、その範囲の値があれば取得。
posts = Post.where(id: 5..10)

whereメソッドでは、条件に文字列などを入力しますが、外部から受け取る場合、文字列中にシングルクォテーションなどを挿入して、SQLインジェクションを起こそうとする人がいるため、その対策として、プレースホルダーというものを使います。SQL文に書かれた?を文字列に置き換えます。

name = "Taro"
posts = Post.where("name = ?", name)

# プレースホルダーは複数指定できます。
posts = Post.where("name = ? AND member = ?", "Taro", true)

whereメソッドなどのリレーショナルオブジェクトは、書いた時点では実行されず、Rubyと同名の配列に関するメソッドである、eachやmapやlengthを用いることで始めて実行され、モデルオブジェクトの配列が得られる。もし、すぐにモデルオブジェクトを得たければ、

posts = Post.where(name: "Taro").load

上記のように、loadメソッドを用います。

■Railsのメソッドを用いたSQLのSELECT文の書き方
メソッドはメソッドチェーンでつなげることができます。SQLと違って、つなげる順番は自由です。
select(文字列) - SELECT
from(文字列) - FROM
joins(シンボル/文字列) - JOIN - テーブルの結合
includes(シンボル) - データベースによる - 関連付けの名前を指定することで関連するモデルオブジェクトをロード。
where(ハッシュ/文字列/配列) - WHERE - 検索条件の指定
group(文字列) - GROUP
having(文字列) - HAVING
limit(整数) - LIMIT - 取得するレコード数の上限
offset(整数) - OFFSET - 何行目のレコードから取得するか指定
order(文字列/シンボル/ハッシュ) - ORDER BY - ソート対象のカラム名

# カラム名をシンボルで指定
posts = Post.where(age: 30).order(:id)
# カラム名をハッシュのキーとして、降順/昇順を :desc or :ascでハッシュの値に指定
posts = Post.where(age: 30).order(id: :desc)

reorder(文字列) - ORDER BY - ORDER BY句の上書き
reverse_order - ORDER BY - ORDER BY句の降順/昇順を逆にする
lock(文字列) - データーベースによる - MySQLのロック機能をつかう
readonly - レコードを読み込み専用にする
distinct - 検索結果の重複をなくす
none - 何も検索しないリレーショナルオブジェクトを返す

■発行されたSQL文を知る

posts = Post.all
puts posts.to_sql

■SQL文を直接書く

posts = post.find_by_sql("select * from posts where name = 'Taro'")

# SQL文でプレースホルダーを用いる場合、全体を配列で指定しないといけない。
posts = post.find_by_sql(["select * from posts where name = ?", "Taro"])

Railsでデータベースからデータを受け取って表示する

開発環境は、Windows 7 Professional(32bit) + ruby 2.3.3p222 + Rails 4.2.1。

※下記のすべてのコマンド入力時は作ったアプリのディレクトリをカレントディレクトリに設定しておいてください。

■データベースを作る
・railsでは最初に何も指定しなければSQliteを使うことになっている。
アプリを作成した段階でdbディレクトリ内にdevlopment.sqlite3とtest.sqlite3が自動的に作成されている。
・データベースの設定はconfig/database.ymlに書いてある。
　・development(開発),test(テスト),production(本番)の3つのモードに分かれている。
・アプリのルート部分をカレントディレクトリにすると、

rake db:create

既に作られているのでここは、飛ばして良い。
データベースを削除する場合は、

rake db:drop

を入力する。

■モデルを作る
モデルは下記のようなコマンドで作成することができます。

rails generate model モデル名
rails generate model モデル名 フィールド名1:データ型1...

今回は

rails generate post

と入力します。すると、app/models/ディレクトリ内にpost.rbが作成されています。

■テーブルを作る
・モデルを作成した段階で、db/migrateディレクトリ内にマイグレーションスクリプトというファイルが作成されています。このファイルを利用することで、コマンド上からテーブルを作成することができます。
カラムのデータ型として指定可能なものは以下のサイトが参考になります。
モデルの作成とRailsで指定可能なデータ型 - Ruby on Rails入門
今回は、create_tableブロック内に以下のコードを追加。改行ごとにカンマはいりません。

	t.string :name
	t.text :description

次に

rake db:migrate

と入力することでpostsテーブルが作成されています。
次に、作ったテーブルにデータを入れてみます。
dbディレクトリにseeds.rbが作成されているので、

6.times{
	Post.create(:name => '太郎', :description => 'こんにちは。投稿になります。')
}

同じデータを6個入れてみます。実行は、

rake db:seed

これでデータが入ります。

■データベースからデータを受け取る
呼び出したいコントローラ(今回はtop_controller.rb)に以下のメソッドを追加する。

	def hello
		@posts = Post.all
	end

config/routes.rbに、

	get 'hello' => 'top#hello'

app/views/topディレクトリにhello.html.erbという名前で以下のコードを追加する。

<% @posts.each do |item| %>
	名前 <%= item.name %>, 投稿 <%= item.description %><br />
<% end %>

サーバーを

rails server

で立ち上げて、localhost:3000/helloへアクセスすると成功。CakePHPと違ってモデルと同じ名前のコントローラじゃなくても問題なく読み出せる。
CakePHPの場合は、TableRegistry::getでテーブル名を取得しないといけないが、Railsはシンプルに取得できる。

実行結果

■フォームからデータベースに入れる

ビュー側の作成 - app/views/top/index.html.erb

<%= form_tag("/add", :method => "post") do %>
<%= text_field_tag(:name) %>
<%= text_field_tag(:description) %>
<%= submit_tag("投稿") %>
<% end %>

コントローラ側に追加 - app/controllers/top_controllers.rb

	def index
	end

	def add
		@post = Post.new(name: params[:name], description: params[:description])
		if @post.save
			redirect_to "/hello"
		else
			redirect_to "/index"
		end
	end

config/route.rbにて、

  	root 'top#index'
	post 'add' => 'top#add'

を追加。
これで、フォームからデータを入力して、データベースに入れることができます。

Unity2Dでサンプルサイトを参考にしてゲームを1本作ってみる

効率的に上達するためには、何か1本ゲームを作ることだろうと思い、下記の記事を参考にして、ゲームを1本作ってみたいと思いました。
【Unity入門】60分で作るシューティングゲーム 第１回 - おもちゃラボ

1.Unityを起動し、右上のNEWボタンをクリックします。

2. 3Dにチェックが入っているところを2Dにチェックを入れて、Create Projectボタンをクリックします。

3.ページ上部のGameタグをクリックし、Free Aspectの部分をクリックし、＋ボタンをクリックし、Typeの部分をAspect Ratioにして、Width & Heightの部分に、それぞれ、9と16を入れる。Aspect Ratioにしないと画像がうまく表示されないので注意。

4.下記のリンクにアクセスして、ゲームに必要な素材をダウンロードする。右上の3つの丸をクリックし、直接ダウンロードをクリックすると、ダウンロードが始まる。
Dropbox - SampleShooting_Material.zip

5.ダウンロードが終わったら、解凍し、SampleShootingディレクトリ内にある.DS_Store以外のファイルをすべてを、ドラッグ＆ドロップで、UnityのProjectタブのAssetsに移す。

6.Assetsにあるrocketをドラッグ＆ドロップでSceneタブ内のウィンドウへ移す。

7. ProjectタブのCreateをクリックし、C# Scriptをクリックし、名前をRocketControllerとする。RocketControllerをクリックして、次にInspectorタブをクリックし、Openボタンをクリックします。

8.スクリプトを記入して、RocketControllerをHierarchyタブにあるrocketにドラッグ＆ドロップして、ゲーム実行。

Unity(3D/C#編)で詰まったところ

開発環境は、Windows 7 Professional(32bit) + Unity 5.6.3f1 Personal。

■特定の要素を消したい
要素を消したければ、Hierarchyタブから消したい要素を選択し、右クリックして、Deleteを選択する。

■エディタを変更する
自分の場合は、デフォルトでは、Visual Studio 2017(Community)が使われているんですが、起動すると自分の貧弱な処理能力のパソコンで動作が重くてエディタを切り替えることにしました。
1.Unity上部のEditボタンをクリックし、Preferences...をクリックします。
2.External Toolsを選択し、External Script Editorのプルダウンメニューから、Browse...を選択すると、パソコン内のエディタが選択できるので自分の場合は、TeraPadを選択しました。(C:\Program Files\TeraPad\TeraPad.exe)
3.スクリプトのInspectorタブでOpen...ボタンをクリックすると、TeraPadが起動するようになります。後は、TeraPadで書いて、保存すると、自動的に、Unity側の内容も更新されるようになります。

■GameObjectの色を変える
1.ProjectタブのCreateをクリックして、Materialをクリックする。
2.ProjectタブのAssets内の作ったMaterialをクリックし、InspectorタブのAlbedoと書かれた欄の
3.白色の四角をクリックするとColorウィンドウという色の一覧表が出るので好きな色にする。
色を選択したら、Colorウィンドウの×ボタンで閉じる。New Materialタブで色が変更されたと思います。
4.ProjectタブのAssetsのマテリアルをドラッグ＆ドロップでHierarchyタブの色を変更したい
GameObjectに持っていくことで、Sceneタブの特定のGameObjectの色が変更されたと思います。

■シーンを変える
1.複数シーンを作っておく
2.Unity上部のFile - Build Settingをクリック
3.Assetタブにある読み込みたいシーンすべてをウィンドウ内にドラッグ＆ドロップして、そのBuild Settingウィンドウを×ボタンで消しておく。
4.後はC#のスクリプト内に以下のコードを追加する。

// コード上部に
using UnityEngine.SceneManagement;

// メソッド内に入れる
SceneManager.LoadScene("読み込みたいシーン名");

5.そのスクリプトを自分が望むもの(例えば、ボタンなど)に適用させる。

■ボタンを表示させる
1.HierarchyタブのCreateボタンをクリックし、UI - Buttonをクリックする。そうすると、Hierarchyタブに、Canvas - Buttonが追加される。
2.Hierarchyタブ内の今作ったButtonの左側にある右向きの矢印をクリックし、Textを表示し、Textをクリックする。そうすると、TextのInspectorタブが表示されるので、InspectorタブのText(Script)にSTARTと入力し、Unityを実行すると、以下のように表示される。何度押しても、何も実行されない。

・ボタンの位置は、Buttonをダブルクリックして、カメラをButton基準にしてからだと、動かしやすい。

■ボタンの作成＋クリックイベントの追加
1.ボタンを作る - 上記に書いている。
2.ProjectタブのCreateボタンをクリックし、C# Scriptをクリックする。
3.作ったC#スクリプトをダブルクリックし、表示させ、以下のコードを入力する。

// 以下のメソッドを追加する
	public void OnClick(){
		Debug.Log("clicked");
	}

4.ProjectタブのAssets内にある先ほど作ったC#スクリプトを、HierarchyタブのButtonにドラッグ＆ドロップする。
5.HierarchyタブのButtonをクリックし、ButtonのInspectorタブを表示し、On Click()の欄の+ボタンをクリックする。
6.None (Oとなっている左下のところに、InspectorタブのButtonをドラッグ＆ドロップする。
7.InspectorタブのNo Functionの部分をクリックし、作成したC#スクリプト名 - OnClick()を選択する。
8.実行して、成功しているならば、STARTボタンをクリックすると、Consoleタブにclickedという文字が表示されているはず。

■GameObjectを削除する
・GameObjectを削除するには、Destroyメソッドを用います。
・今回は、CubeとButtonを作って、Buttonをクリックしたら、表示されているCubeを削除するようなプログラムを作ります。■ボタンの作成＋クリックイベントの追加を参考にして、作ってみてください。

	public GameObject Cube;
	void Start () {
		Cube = GameObject.Find("Cube");
	}
	
	public void OnClick(){
		Destroy(Cube);
	}

参考リンク
Destroy - Unity

■要素を動かす(自動)
1.Unity上部のAssetsボタンをクリックし、Create - C# Scriptをクリックする。
2.Assetsタブに、スクリプトが作成されているので、それをクリックし、Inspectorタブを見て、Open...ボタンをクリックする。
3.以下のコードを追加して、保存する。

private Vector3 m_pos;
void Start(){
m_pos  = transform.localPosition;
}

void Update(){
transform.localPosition = m_pos;
m_pos.y += 0.05f;
}

4.そのC#スクリプトをスクリプトを適用させたいHierarchyタブの要素にドラッグ&ドロップして、後は、Unityを実行すると、その要素は、1フレームごとに上昇していく。

参考リンク
unity_move_gameobject - FreeStyleWiki
【Unity】C#でtransform.positionの値を変更する

■操作したいGameObjectを指定するにはどうすればいいか？

	GameObject obj;
	void Start(){
		obj = GameObject.Find("GameObject名");
	}

という風に取得する。なければ、nullが入るので、受け取る変数は、初期化していないとエラーになる。

参考リンク
GameObject.Find - Unity スクリプトリファレンス

GameObjectに手持ちの画像を貼りつける
1.事前にCubeとMaterialを作成しておく。
2.作ったMaterialを右クリックして、Import New Asset...をクリックし、任意の画像を選択するとAssetsに追加される。
3.Materialをクリックして、InspectorタブのShaderをStandardからLegacy Shaders - Diffuseをクリックする。
4.Selectと書かれた四角の部分にAssetsにある画像をドラッグ＆ドロップする。
5.AssetsにあるMaterialをCubeにドラッグ＆ドロップすると、Cubeの各面に画像が貼り付けられている。

参考リンク
第4回目：オブジェクトにマテリアルやテキスチャを適用する（後編）｜Tech Book Zone Manatee

■キー入力を受け取る
・Input.GetKeyだと押しっぱなしでも毎回機能する。押している状態で発生。
・Input.KeyDown - 押していない状態から押すと発生。
・Input.KeyUp - 押している状態から離すと発生。
参考リンク
UnityのInputで入力を扱う
【Unity】2D用の、キーボードで上下左右動かせるスクリプト · GitHub