vagrantの公式サイトのdocsを見てみよう

公式サイトにアクセスします。

ざっと流し読みしてみたい思います。見出しは、
overview, installation, Commands(CLI), VagrantShare, Vagrantfile, Boxes, Provisioning, Networking, Synced Folders, Multi-Machine, Providers, Plugins, Push, Triggers, Other とあります。順番に見ましょうか。

Overview
まず、初めて見るなら、getting startedのページを見よ、と書いている。

Getting Started
おい、ちょっとまて、凄い重要なこと書いてあるやんけ。

今週末は、vagrantやるかー

vagrantファイルの中身

vagrantファイルの中身を見ていきましょう。
Vagrantfile
rubyで書かれているっぽいですね。1行ずつ見ていきたいと思います。

# -*- mode: ruby -*-
# vi: set ft=ruby :

# All Vagrant configuration is done below. The "2" in Vagrant.configure
# configures the configuration version (we support older styles for
# backwards compatibility). Please don't change it unless you know what
# you're doing.
Vagrant.configure("2") do |config|
  # The most common configuration options are documented and commented below.
  # For a complete reference, please see the online documentation at
  # https://docs.vagrantup.com.

  # Every Vagrant development environment requires a box. You can search for
  # boxes at https://atlas.hashicorp.com/search.
  config.vm.box = "bento/centos-6.8"

  # Disable automatic box update checking. If you disable this, then
  # boxes will only be checked for updates when the user runs
  # `vagrant box outdated`. This is not recommended.
  # config.vm.box_check_update = false

  # Create a forwarded port mapping which allows access to a specific port
  # within the machine from a port on the host machine. In the example below,
  # accessing "localhost:8080" will access port 80 on the guest machine.
  # config.vm.network "forwarded_port", guest: 80, host: 8080

  # Create a private network, which allows host-only access to the machine
  # using a specific IP.
  config.vm.network "private_network", ip: "192.168.33.10"

  # Create a public network, which generally matched to bridged network.
  # Bridged networks make the machine appear as another physical device on
  # your network.
  # config.vm.network "public_network"

  # Share an additional folder to the guest VM. The first argument is
  # the path on the host to the actual folder. The second argument is
  # the path on the guest to mount the folder. And the optional third
  # argument is a set of non-required options.
  # config.vm.synced_folder "../data", "/vagrant_data"

  # Provider-specific configuration so you can fine-tune various
  # backing providers for Vagrant. These expose provider-specific options.
  # Example for VirtualBox:
  #
  # config.vm.provider "virtualbox" do |vb|
  #   # Display the VirtualBox GUI when booting the machine
  #   vb.gui = true
  #
  #   # Customize the amount of memory on the VM:
  #   vb.memory = "2048"
  # end
  #
  # View the documentation for the provider you are using for more
  # information on available options.

  # Define a Vagrant Push strategy for pushing to Atlas. Other push strategies
  # such as FTP and Heroku are also available. See the documentation at
  # https://docs.vagrantup.com/v2/push/atlas.html for more information.
  # config.push.define "atlas" do |push|
  #   push.app = "YOUR_ATLAS_USERNAME/YOUR_APPLICATION_NAME"
  # end

  # Enable provisioning with a shell script. Additional provisioners such as
  # Puppet, Chef, Ansible, Salt, and Docker are also available. Please see the
  # documentation for more information about their specific syntax and use.
  # config.vm.provision "shell", inline: <<-SHELL
  #   apt-get update
  #   apt-get install -y apache2
  # SHELL
end
&#91;/ruby&#93;

<pre>
-*- mode: ruby -*-
vi: set ft=ruby :
</pre>
rubyで書かれている、ということでしょうか。

<pre>
# All Vagrant configuration is done below. The "2" in Vagrant.configure
# configures the configuration version (we support older styles for
# backwards compatibility). Please don't change it unless you know what
# you're doing.
</pre>
configuration versionが"2"だといってます。


Vagrant.configure("2") do |config|
end

この中に記載してください。と書いている。

  # The most common configuration options are documented and commented below.
  # For a complete reference, please see the online documentation at
  # https://docs.vagrantup.com.

vagrantの公式ドキュメントです。これは後で見ましょう。マニアックになってきた。

  # Every Vagrant development environment requires a box. You can search for
  # boxes at https://atlas.hashicorp.com/search.
  config.vm.box = "bento/centos-6.8"

これはosです。ここでは、contos-6.8を使用しています。

  # Disable automatic box update checking. If you disable this, then
  # boxes will only be checked for updates when the user runs
  # `vagrant box outdated`. This is not recommended.
  # config.vm.box_check_update = false

osのアップデートです。vagrant box outdatedでアップデートできるが非推奨と書いてあります。そりゃそーでしょうね。

  # Create a forwarded port mapping which allows access to a specific port
  # within the machine from a port on the host machine. In the example below,
  # accessing "localhost:8080" will access port 80 on the guest machine.
  # config.vm.network "forwarded_port", guest: 80, host: 8080

ポートフォワーディング 8080

  # Create a private network, which allows host-only access to the machine
  # using a specific IP.
  config.vm.network "private_network", ip: "192.168.33.10"

ホストのみがアクセスできるip

  # Create a public network, which generally matched to bridged network.
  # Bridged networks make the machine appear as another physical device on
  # your network.
  # config.vm.network "public_network"

bridge ip

  # Share an additional folder to the guest VM. The first argument is
  # the path on the host to the actual folder. The second argument is
  # the path on the guest to mount the folder. And the optional third
  # argument is a set of non-required options.
  # config.vm.synced_folder "../data", "/vagrant_data"

マウントするフォルダーの指定
mountとは設置すること、などの意味
最初の引数はホストのフォルダ、2つめのパスはマウント対象のフォルダ

# Provider-specific configuration so you can fine-tune various
  # backing providers for Vagrant. These expose provider-specific options.
  # Example for VirtualBox:

プロバイダーのコンフィギュレーション

  # config.vm.provider "virtualbox" do |vb|
  #   # Display the VirtualBox GUI when booting the machine
  #   vb.gui = true
  #
  #   # Customize the amount of memory on the VM:
  #   vb.memory = "2048"
  # end

gui true, memory 2048

  # View the documentation for the provider you are using for more
  # information on available options.

ドキュメントに他の情報

  # Define a Vagrant Push strategy for pushing to Atlas. Other push strategies
  # such as FTP and Heroku are also available. See the documentation at
  # https://docs.vagrantup.com/v2/push/atlas.html for more information.
  # config.push.define "atlas" do |push|
  #   push.app = "YOUR_ATLAS_USERNAME/YOUR_APPLICATION_NAME"
  # end

atlas atlas Not Foundじゃんか!!

  # Enable provisioning with a shell script. Additional provisioners such as
  # Puppet, Chef, Ansible, Salt, and Docker are also available. Please see the
  # documentation for more information about their specific syntax and use.
  # config.vm.provision "shell", inline: <<-SHELL
  #   apt-get update
  #   apt-get install -y apache2
  # SHELL

プロビジョニングも可能
shell, puppet, chef, ansible, salt, docker
これこれ

config.vm.provision "shell", inline: <<-SHELL
  #   apt-get update
  #   apt-get install -y apache2
  # SHELL

shellのサンプルですね。

vagrantファイルの中身、ちゃんと見たの初めてだけど、割とベーシックなこと書いてるやんけ。もっと難しいことかと思ってた。

文字サイズ/テキストサイズ/フォントサイズをCSSで指定する

px, em, rem, %, xx-small, x-small, medium, large, x-large, xx-large, vw, vhなどがあります。
実際にコーディングしてみましょう。

<head>
<style>
.px12 {
	font-size:12px;
}
.em12 {
	font-size:12em;
}
.ex12 {
	font-size:12ex;
}
.p75 {
	font-size:75%;
}
.p120 {
	font-size:120%;
}
.xx-small {
	font-size:xx-small;
}
.x-small {
	font-size:x-small;
}
.small {
	font-size:small;
}
.medium {
	font-size:medium;
}
.large {
	font-size:large;
}
.x-large {
	font-size:x-large;
}
.xx-large {
	font-size:xx-large;
}
</style>
</head>
<form>
	<span>普通の文字サイズ</span><br>
	<span class="px12">文字サイズ12px</span><br>
	<span class="em12">文字サイズ12em</span><br>
	<span class="ex12">文字サイズ12ex</span><br>
	<span class="p75">文字サイズ75%</span><br>
	<span class="p120">文字サイズ120%</span><br>
	<span class="xx-small">文字サイズxx-small</span><br>
	<span class="x-small">文字サイズx-small</span><br>
	<span class="small">文字サイズsmall</span><br>
	<span class="medium">文字サイズmedium</span><br>
	<span class="">文字サイズ普通</span><br>
	<span class="large">文字サイズlarge</span><br>
	<span class="x-large">文字サイズx-large</span><br>
	<span class="xx-large">文字サイズxx-large</span>
</form>

ex, emがとてつもなくでかい!?
mediumはスタイリングしないのと同じサイズでした。

emは%と同じ
1emなら100%、12emなら1200%
そりゃでかいわw

remは相対的

<head>
<style>
.em2 {
	font-size:2em;
}
.rem2 {
	font-size:2rem;
}
</style>
</head>
<form>
	<span>普通の文字サイズ</span><br>
	<span class="em2">文字サイズ2em</span><br>
	<span class="rem2">文字サイズ2rem</span><br>
</form>

使いどころがイマイチぴんとこない。

vw:viewport width、vh:viewport height
それぞれviewportに対する割合。100vw, 100vhがブラウザの横幅、縦幅

<head>
<style>
.vw20 {
	font-size:20vw;
}
.vh20 {
	font-size:20vh;
}
</style>
</head>
<form>
	<span>普通の文字サイズ</span><br>
	<span class="vw20">文字サイズvw2</span><br>
	<span class="vh20">文字サイズvh2</span><br>
</form>

ブラウザを動かすと、文字サイズが変わります。

これすげー

【時間の無駄】Youtubeの見るのを止めたい時

あることに気が付いた。
Youtubeって完全に時間の無駄じゃね? 

現実逃避にはいいんだけど、なんと言ったらいいのかわからいんだけど、なんか価値観や思考を奪われる感じがするんだよね。思考の影響を受けやすい、というか。だから、できるだけ見ないようにしようと思ってるんだけど、ついつい見てしまう。そして、殆ど無駄だとわかってるんだけど、たまに役立つような情報もあるからたちが悪い。

で、しばらく考えたんだが、閲覧ブロックするアプリをインストールして、強制的に見れないようにすることにした。

1.アプリの設定を無効化する
設定->アプリと通知->アプリ->Youtube

2.BlockSiteをインストールして閲覧ブロックする

あれ、何気に、大事なことしたような気がする。

Laravel5.7 バリデーションのエラーメッセージをカスタマイズ

Laravel5.7 バリデーションのエラーメッセージをカスタマイズしたいと思います。
複雑なことやってんのかな? いえ、こんなに奇怪なことはやってません。

まず、app/Http/Requests 配下にフォームリクエストのCompanyRequest.phpがあります。

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class CompanyRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array
     */
    public function rules()
    {
        return [
            'company_name' => 'required',
            'agent_name' => 'required',
        ];
    }
}

この状態だと、fieldの値がnullだと、「The ${value} field is required.」とアラートメッセージが表示されます。

公式ドキュメントバリデーション(https://readouble.com/laravel/5.7/ja/validation.html)のページ中段にあるエラーメッセージのカスタマイズを実装します。
public function rulesの下、overrideするメッセージを書きます。
適当に日本語で、「会社名を入力してください」「代理店名を入力してください」としておきましょう。

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class CompanyRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array
     */
    public function rules()
    {
        return [
            'company_name' => 'required',
            'agent_name' => 'required',
        ];
    }
    public function messages()
    {
        return [
            'company_name.required' => '会社名を入力してください',
            'agent_name.required' => '代理店名を入力してください',
        ];
    }
}

日本語で表示されるようになりました。

おお、割と簡単だった。

特殊文字とはなにか?

プログラマーって、みんな文字や文字コードの知識が詳しいな。まいるぜ。

wikipediaを参考にします。
特殊文字の定義
特殊文字(とくしゅもじ、special character)とは、情報処理において文字集合に含まれる文字(図形文字)として扱われるもののうち、伝統的な言語学でいう「文字」(表音文字や表意文字)に入らないものであって、しばしば通常の文字とは異なる特殊な扱いをされるものをいう。

なんだそれは? 

伝統的な言語学で扱われてきた約物(句読点や:/;/”/?/!等)のほか、数学記号などの学術記号、単位記号、通貨記号、国際音声記号、といったさまざまな記号類、矢印や罫線素片、ハートやダイヤなどのトランプのマーク、絵文字といったものも含まれる。

絵文字も特殊文字なのか。ややこしいな。

エンジニアと英語

仕事で英語は使っているか?
=> Yes(コミュニケーション/ドキュメント両方)

英語は必要だと思うか?
=> Yes、ドキュメントの読み込みは英語ができないとかなりキツイ。

エンジニアとして、どういう英語の勉強をしたか、しているか?
=> udacityの講座は全部やった。

英会話スクールなどに行った方がいいか?
=> No。高校生の頃、30万位払ってECCに通ったが、全く上達しなかった。英会話はエンジニアには金の無駄。

英語のプログラミング関係の本を買って勉強するのはどうか?
=> No。まず、売ってる本の種類が少ない。Amazonで買おうとすると、海外取り寄せになる場合が多い。すると、到着するのに1週間以上かかったりするので、そのころにはマインドが変わっている。

おすすめの勉強方法は?
=> 英語のサイト/アプリケーションを構築すると勉強になると思う。

文字のバイト数とは?

システムによって、バイト数の制限があることがあります。
よくある例としては、画像ファイルは〇M byteまで など。

まず、言葉の定義から。
1バイトとは
0か1かを表すビットという単位が8つ並んで構成される。2の8乗で256通りのデータ

1KB、1MB、1GB
1キロバイト=1024バイト、1メガバイト=1024キロバイト、1ギガバイト=1024メガバイト
※1000バイト単位でないので注意が必要

半角のアルファベットと数字、1文字のデータ量は1バイト
– 日本語は漢字が数千あり、256種類では表現しきれないので、2バイト(16ビット)で1文字を表現する。いわゆる全角文字。2バイト(2^16)は65536種類の情報を表現できる。

500バイトだと250文字
WordのA4でフォントサイズ10.5で40文字程度

アルファベットは7ビットで表現
つまり1バイト?

PHPでバイト数を図ってみましょう。
strlen()でバイト数を計測

$single = "a";
$multi = "あ";
var_dump(strlen($single), strlen($multi));

あれ、”あ”が3byteになってる。何故だ!?

phpのマニュアルを見てみる。
http://php.net/manual/ja/function.strlen.php
うーん、やっぱりバイトだ。 あ、マルチバイト文字列はmb_strlen()でカウントするらしい。なるほど。つまり、”あ”は3バイトで表現されているってことか。

Mysqlのテーブルの文字コードを変更する

まずmysql のtableの文字コードを確認します。
show create table table_name
mysql> show create table items;
+——-+———————————————————————————————————————————————————————————–+
| Table | Create Table |
+——-+———————————————————————————————————————————————————————————–+
| items | CREATE TABLE `items` (
`item_id` int(11) NOT NULL AUTO_INCREMENT,
`name` text,
`price` int(11) DEFAULT NULL,
PRIMARY KEY (`item_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 |
+——-+———————————————————————————————————————————————————————————–+
1 row in set (0.06 sec)


utf-8なのがわかります。

[vagrant@localhost ~]$ cd /usr/share/mysql/charsets/
[vagrant@localhost charsets]$ ls
Index.xml cp1251.xml cp866.xml hp8.xml latin2.xml swe7.xml
README cp1256.xml dec8.xml keybcs2.xml latin5.xml
armscii8.xml cp1257.xml geostd8.xml koi8r.xml latin7.xml
ascii.xml cp850.xml greek.xml koi8u.xml macce.xml
cp1250.xml cp852.xml hebrew.xml latin1.xml macroman.xml
ん? なんだこれは?

とりあえず、テーブルの文字コードを変更します。
alter table table_name default character set utf8mb4;
mysql> alter table items default character set utf8mb4;
Query OK, 0 rows affected (0.16 sec)
Records: 0 Duplicates: 0 Warnings: 0

utf8mb4に変更されているのがわかります。
mysql> show create table items;
+——-+———————————————————————————————————————————————————————————————————+
| Table | Create Table |
+——-+———————————————————————————————————————————————————————————————————+
| items | CREATE TABLE `items` (
`item_id` int(11) NOT NULL AUTO_INCREMENT,
`name` text CHARACTER SET utf8,
`price` int(11) DEFAULT NULL,
PRIMARY KEY (`item_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 |
+——-+———————————————————————————————————————————————————————————————————+
1 row in set (0.00 sec)

こちらは変更ありません。
mysql> show variables like “chara%”;
+————————–+—————————-+
| Variable_name | Value |
+————————–+—————————-+
| character_set_client | utf8 |
| character_set_connection | utf8 |
| character_set_database | utf8 |
| character_set_filesystem | binary |
| character_set_results | utf8 |
| character_set_server | utf8 |
| character_set_system | utf8 |
| character_sets_dir | /usr/share/mysql/charsets/ |
+————————–+—————————-+
8 rows in set (0.00 sec)

mysql> describe items;
+———+———+——+—–+———+—————-+
| Field | Type | Null | Key | Default | Extra |
+———+———+——+—–+———+—————-+
| item_id | int(11) | NO | PRI | NULL | auto_increment |
| name | text | YES | | NULL | |
| price | int(11) | YES | | NULL | |
+———+———+——+—–+———+—————-+
3 rows in set (0.09 sec)

mysql> select * from items;
Empty set (0.07 sec)

mysql> insert into items (name) values (‘\U+1F363’);
Query OK, 1 row affected (0.06 sec)

mysql> select * from items;
+———+———+——-+
| item_id | name | price |
+———+———+——-+
| 1 | U+1F363 | NULL |
+———+———+——-+
1 row in set (0.00 sec)

あれ、なんか違くねー???