north-memo

数学できない方の数学科のブログ、一応デザイナー…なのか…?

備忘: 23歳になった

23歳になりました。

今まで、僕は誕生日と言うものはそんなに祝うほど重要なものではないと思っていました。

ですから、人の誕生日も祝う気はそんなに起こりませんし、ましてや自分の誕生日を他人に祝ってもらうのも、もらわないのも、そこまで何も感じません。

ただ、そんな人生を繰り返していたら…

3日前、母からのLINE 「23歳になったとね」

僕「(今何歳だっけ…)」

自分の年齢を忘れていました。

祝うことは重要だと思いませんが、ちゃんと自分の年齢を覚えておくためにも、何らかのイベントは持っておくべきかもしれないなと思った23歳の誕生日になります。

ひとえに、皆さんの支え合っての23歳だと思っている気持ちは変わりません。両親も、同期も、先輩方も、友達も…本当に有難うございます。

さて、今年も目標を書きます。

来年やること

  • 体重を必ず10kg落とす
  • 5月までに何らかの(決まっていますが、まだ未公開)のWebブラウザアプリケーションを作る
  • 月に一回はインプットの日を設ける。以下から2つ以上を目標に習得する
  • フォントをln-north名義で公開する

できるといいなぁ。

今年もどうかよろしくお願いします。

アントニオ猪木でわかる関数

深夜テンションで書いたら筆が滑りすぎた。

関数

関数は、コードの一部をひとかたまりのものとして名前を付けて切り出すものです。

名前を付けることで、より処理の見通しが良くなったり、簡単に再利用することができたりすることが出来ます。

処理を一つにまとめる

アントニオ猪木はよく「1, 2, 3, ダー!」といいますが、これをJavaScriptで書くとこうなります。

for(var i = 1; i <= 3; i++) {
  console.log(i + "、");
}
console.log("ダー!");

アントニオ猪木はよくこのフレーズを使うので、再利用出来るように関数にまとめてみましょう。

やり方は簡単で、

function antonio() {
  for(var i = 1; i <= 3; i++) {
    console.log(i + "、");
  }
  console.log("ダー!");
} 

このように、上にfunction 関数名()と書き、{}でくくってあげるだけです。

これは、処理のひとまとまりに名前を付けただけで(var i = 0; と宣言したようなもの)、まだ実行されていません。実行するには、また簡単で、

antonio();

とするだけです。これでどこでもアントニオ猪木ができます。

引数を渡してみる

さて、関数名の後に()があります。これについて説明してみます。
先程のアントニオ猪木は3カウントの後に「ダー!」といいますが、4カウント、5カウントしたいことがあるかと思います。このようにカウントが変わる場合に、次のように使います。

function antonio(count) {
  for(var i = 1; i <= count; i++) {
    console.log(i + "、");
  }
  console.log("ダー!");
} 
antonio(3);    // 通常のアントニオ猪木
antonio(4);    // チョット多めのアントニオ猪木
antonio(100);  // かなり多めのアントニオ猪木

このように、()に変数名(宣言しなくて良い、仮の変数のような感じ)を入れることで、その関数の中で使うことが出来ます。これを「引数」といいます。

引数は一つだけじゃなく、複数とることが出来ます。

function antonio(count, shout) {
  for(var i = 1; i <= count; i++) {
    console.log(i + "、");
  }
  console.log(shout);
} 

antonio(3, "ダー!"); // 通常のアントニオ猪木
antonio(1, "だ~!!!!");  // 突然のアントニオ猪木
antonio(10, "KO!!");  // プロレスで勝負が決まった瞬間

値を返してみる

テレビにアントニオ猪木が出たら、

「1っ、2っ、3っ、ダー!」
「ありがとうございます!今日も決まりましたね猪木さん」

と言うように進行していきます。これをプログラムで書くと

function antonio(count, shout) {
  for(var i = 1; i <= count; i++) {
    console.log(i + "、");
  }
  console.log(shout);
} 

antonio(3, "ダー!");
console.log("ありがとうございます!今日も決まりましたね猪木さん。");

となるわけですが、忙しい放送業界、antonio(3, "ダー!")ではなく、antonio("ダー!", 3)のように、間違った引数をとることだってあるわけです。こうなると…、

「3」
「ありがとうございます!今日も決まりましたね猪木さん。」

放送事故になってしまいます。
ここで、司会が上手く切り返すためには、antonio関数が成功したかを確認する必要があります。そのために、antonio関数に返り値というものを持たせてみましょう。

function antonio(count, shout) {
  if((typeof count !== "number"  || count <= 0) || (typeof shout !== "string" || shout === "")) {
    // countの型がnumberでない、もしくはcountが0以下だったらカウントできない
    // shoutの型がstringでない、もしくはshoutが何もない状態だったら叫ばない
    // countとshoutのどちらか一つでもだめだったら放送事故
    return false;
  }
  for(var i = 1; i <= count; i++) {
    console.log(i + "、");
  }
  console.log(shout);
  return true; // 成功
} 

以上のようにreturn というキーワードを用いると、

var check1 = antonio(3, "ダー!");
console.log(check1); // true

var check2 = antonio(-1, "ダー!");
console.log(check2); // false

var check3 = antonio("ダー!", 3);
console.log(check3); // false

というように、antonio関数自体が true, falseに置き換わってくれます。
このreturn で返す値を「返り値」と言います。

今回、true, false を使いましたが、当然、文字列や数値など、他のタイプの値も返すことが出来ます。

さて、コレをつかえば、MCもif文を使って次のように臨機応変に対応できます。

function antonio(count, shout) {
  if((typeof count !== "number"  || count <= 0) || (typeof shout !== "string" || shout === "")) {
    return false;
  }
  for(var i = 1; i <= count; i++) {
    console.log(i + "、");
  }
  console.log(shout);
  return true;
} 

var check1 = antonio(3, "ダー!");
if(check1) {
  // 成功
  console.log("ありがとうございます!今日も決まりましたね猪木さん。");
} else {
  // 失敗
  console.log("さて、猪木さんにご登場頂いたわけですが・・・")
}

var check2 = antonio("ダー!", 3);
if(check2) {
  // 成功
  console.log("ありがとうございます!今日も決まりましたね猪木さん。");
} else {
  // 失敗
  console.log("さて、猪木さんにご登場頂いたわけですが・・・")
}

めでたしめでたし

console.log("ありがとーっ!")

Opentype ver. 1.8で入ってくるバリアブルフォントについての雑感

http://wired.jp/2016/11/23/tech-giant-typographic-problem/

僕としてはこの考えはだいぶ前からあった、ブログ(http://creator.dwango.co.jp/8741.html)で書いたりもしたし、Opentype1.8の仕様書読んだ時点である程度話としては理解していました。

ただ、ずっと思ってるのは、この技術がWebに入ってくると、今までのWebおけるフォント技術の進化の考え方とは別の方向を向いているということです。

基本的に、今までのOpentypeやらWebfontやCSSのfont-features-settingsのようなWeb上のフォント技術の進化は、雑に言ってしまうと紙面デザインでの文字の立ち振る舞いの再現。紙面デザインで培った「いかに組み文字を美しく見せるか」の再現だったわけです。

しかし、今回のバリアブルフォントは、それだけじゃなくて、おそらくインタラクティブな表現を念頭に踏まえた進化です。ですから、紙面デザインでもより自由にフォントを選ぶことが出来るようになる恩恵もあると思いますが、目玉として大きく影響を受けるのはインタラクティブを含むWebとゲームでしょう。

そして、今までは「セリフ体」「サンセリフ体」というオーソッドックスな分け方がありましたが、それも変わっていくのかなぁと思っています。そもそも、このバリアブルフォントはセリフ体には再現が難しい。だから、セリフ体のエレメントは別に分けて装飾ルールとしてのカテゴリとして分けられるのではないか、と考えています。

そうすると、セリフ体やサンセリフ体という考えが無くなって、よりメタに、「アルファベット(=文字種)という区別可能なコンセプト」だけが残って、そこから装飾のカテゴリで文字分類が進んでいくのかなぁと考えています。大分先の話だとは思いますが…。

それを踏まえ、作りたいものメモがもう100を超えてしまっているのですが、チョット手が追いつきません…!!

熊本に帰った

いろいろ落ち着いたので(個人的には落ち着いてないけど)丸1週間ほどお休みを頂き、熊本に帰っていました。

なんか、休んでいるとすごく不安になります。
みんな働いているのに何してるんだろう…と。

有給中はSlackは絶対見ないようにするべきだなぁ、と。

やったこと

  • ロボコン部にいってサーバーの引き継ぎをした
  • ロボコン部のみんなと飲み会した
  • 友人に実家の椅子の引き渡し
  • 高校に挨拶
  • 阿蘇にいった
  • 依頼されていたお仕事をした(Not 仕事、Not 副業的なもの)

写真

阿蘇

f:id:ln_north:20161016175205j:plain
僕は将来こんな所にすみたいなぁと。この景色、買おうと思ったらいくら掛かるのか。ものすごい価値があるんじゃないのか。

成田に帰ってくる時

f:id:ln_north:20161016175245j:plain f:id:ln_north:20161016175250j:plain
雲と海と雲の間に挟まれているようで、すごく不思議な気分でした。

思ったこととか

大学まで実家から離れたことが無かったので、久々の実家は絶妙なノスタルジーと過ごしにくさを感じました。
あと、実家にいる時に、何をしたらいいんだろうなぁと思っていました。
なんで旅行でも何でも無く、実家にいるんだろうか、何をしたら実家にいて特に出来ることって何なんだろうか…(変に意識が高い…)

迷った結果、極力親と話すようにしました。
生きてるうちに、いろいろ聞いとこうと。
母のことも、父のことも、兄のことも、そして自分のことも。

別に母も父も、僕の不健康さに比べ、死ぬ間際でもなんでもないんですが、今までに比べると圧倒的に父親母親と接する時間が減って、もっと大切にすべきだなぁと感じた所があったからですね…。

なんかポエミーになってしまいまいした。
すごく蚊にさされた。
ボロボロの日記だ。
そして、ユーリ!!! on ICE が本当にすごい。

Docker勉強備忘録1

節目を迎えたので、今週平日はUQをもらっている。

興味が出てきたのでDockerを勉強してみている。

相変わらずお世話になっているドットインストール
http://dotinstall.com/lessons/basic_docker

Dockerっちゅうのは...

Dockerってのは、アプリケーションを環境とまとめてパッケージ化する(環境をコンテナ、パッケージされたものをイメージという)ものらしい。
環境もまとめてパッケージ化するから、Dockerさえ立ち上がれば、他のマシンでも同じ動作を保証できるというもの(マシン性能等再現できないものもあるけど)
仮想環境との違いは、仮想環境はホストOS上に仮想マシンを作るが、Dockerコンテナでは、この仮想マシンがない(代わりにDockerEngine)。マシンリソースは全コンテナで共有。仮想マシンがないから軽量で手軽。

Dockerの構成

面倒なので図にした。引用元を記述すれば自由に転載していいです。

f:id:ln_north:20161012044301p:plain

Dockerの操作

Dockerのインストール

この辺に乗っている。 今回はSandbox的に用意している仮想Ubuntu 14.04上にインストールした。
https://www.docker.com/products/docker

Ubuntuはこっち
https://docs.docker.com/engine/installation/linux/ubuntulinux/

Dockerの一連の流れ

  • docker search {検索ワード} | more DockerHubのIndexからイメージを探す
  • docker pull {イメージ名} Docker Hub から イメージを持ってくる
  • docker run {イメージ名} イメージの実行
  • Docker

イメージの操作

  • docker search {検索ワード} | more イメージの検索
  • docker pull {イメージ名} イメージをDocker Hubからホストへ持ってくる
  • docker images ホストにあるイメージ一覧を表示
  • イメージの指定は {イメージ名}:{バージョン} or {イメージのIDの先頭n文字(識別できるまで)}
  • docker inspect {イメージ指定] イメージの詳細を表示
  • docker rmi {イメージ指定} イメージを削除

イメージの実行 / 終了 / 削除・コンテナの管理

  • docker run {イメージ指定} イメージの実行
    • ex. Ubuntuの実行 docker run -i -t ubuntu /bin/bash
    • -iインタラクティブモード
    • docker run {イメージ指定} の後にはコマンドが打てる
    • -d をつけるとバックグラウンド実行(Dockerに限らないけど…)
      • docker attach --sig-proxy=false {コンテナ指定} コンテナをフォアグラウンドにもってくる
  • docker ps 実行中のコンテナの一覧
    • docker ps -a 停止しているコンテナも表示
  • コンテナの指定は、IDか名前で指定できる
  • docker logs {コンテナ指定} コンテナのログを取れる
  • docker kill {コンテナ指定} コンテナの終了
  • docker start {コンテナ指定} コンテナの再開
  • docker rm {コンテナ指定} コンテナの削除

コンテナに変更を加えてイメージを作る(例)

コンテナに直接変更を加える(docker commit)

  • Ubuntuの実行などでコンテナに変更を加える docker run -i -t ubuntu /bin/bash
  • docker commit {コンテナID} {イメージ名(username/imagename)} でイメージを作成

DockerFileで自動化(docker build)

  • Dockerfile という名前のファイルを作る
  • https://docs.docker.com/engine/reference/builder/ を参照して作る
    • FROM {イメージ名} 継承するファイル
    • MAINTAINER 名前 <email> で作成者を記入
    • RUN {コマンド} ビルドされるときに実行
    • CMD ["コマンド", "コマンド", ... ] runするときに実行
  • `docker build -t {イメージ名(username/imagename)} {Dockerfileがあるディレクトリのpath}
  • イメージができる!(docker images で確認しよう)

作成したイメージをDocker Hubにpush

  • docker login
  • docker push {イメージ名(username/imagename)}

参考文献

20160919_進捗

久しぶりにブログの管理画面を開いたら、進捗を書くのをすっかり忘れていた

この3日間でやろうと考えてたことはあったんだが、かなり精神的に消耗してしまい、何もやる気が起きなくて寝たり起きたりの自堕落な生活を送っていた。

やったこと

  • Re:ゼロ 23, 24話を見た
  • Leap Chairを買うことにした
  • 試験的にmi5をbangoodで買うことにした
  • 依頼された案件の調査と見積もりをつくって送った

やらなければならないこと

  • React, storybook, fluxの勉強
  • UI設計に関する勉強
  • 携帯周辺の整備
  • 考えてたことの実装

やりたいこと

ほしいもの

  • UI設計の本
  • Moto360

そろそろクレジットカードが届く。nifmoがようやく契約できる。softbankにはもう懲り懲りだ。

今日の進捗

今日やったこと

引っかかったこと

Heroku toolbeltがインストール出来ない

  • もともと入ってたrubyのバージョンが低すぎる

PostgreSQLが入らない( gem install pg が出来ない)

  • sudo yum install postgresql postgresql-develで解決

rails s をしてもブラウザからアクセス出来ない問題

  • iptablesでport開いてもダメ
  • rails s -b 0.0.0.0でもだめ
  • vagrantのHostとguestを3000にしてもダメ
  • 仮想環境上でwgetとかcurlとかはOK 未解決…。ドットインストールのように全く進まなくて泣ける。5時間近くやったが解決しないのでRubyとかRailsとか嫌いになりそう…。

おまけ

rbenv

  • 次のコマンドでインストール候補を表示できる
    rbenv install -l
  • 次のコマンドでこのバージョンのrubyをインストール
    rbenv install バージョン名
  • 最後にこのコマンドで切り替え
    rbenv global バージョン名

railsのインストールの仕方

gem install rails

railsの使い方

  • 新しいアプリケーションの作成
    rails new アプリ名 [option]

今回は rails new mymemo -d PostgreSQL としたが、 -d はデータベースの選択のよう

参考にした記事