Spica*

プログラミングの話。

WebGLメモ

wgld.org | WebGL |を見ながら勉強中

  • OpenGLは手前に行くほどZの値はプラスになる
  • 座標変換は三種類ある
    • モデル変換
      • 位置
      • 拡大縮小
      • 回転
    • ビュー変換
      • カメラの位置
      • カメラの向き
    • プロジェクション変換
      • ディスプレイ縦横比率
      • 視野角
  • 固定機能パイプラインはない
    • 座標変換を行ってくれる仕組みのこと
  • シェーダは座標変換を記述するための仕組み
  • シェーダは2種類
    • 頂点シェーダ
    • フラグメントシェーダ(ピクセルシェーダ)
  • 行列(Matrix)
    • 正方行列
      • "行"と"列"が同じ要素数の行列
    • 掛ける順序によって結果が変わる
  • ポリゴン
    • 三点を結んでできた三角形のこと

仕様

Firefox Quantumで、「新しいタブ」の背景に好きな画像を使う

Chromeは仕事、趣味や調べ物のときはFirefox Quantum使うようにしてるんだけど、about:homeがシンプルで寂しいので壁紙付けたかった。ので調べた。

https://github.com/Aris-t2/CustomCSSforFx

…という素晴らしいプロジェクトがあるので、これのDocumentationとサンプルを読んで書く感じ。

  • about:support を開く
  • プロファイルフォルダーの行のFinderに表示を押す
  • プロファイルフォルダの中に入る
  • そのフォルダの中に chrome というフォルダを作り、その下を下記のような階層にする
.
├── css
│   └── aboutnewtab
│       └── appearance.css
├── img
│   └── mywallpaper.jpg
└── userContent.css
  • userContent.css
@import url(./css/aboutnewtab/appearance.css);
  • appearance.css
@-moz-document url(about:newtab), url(about:home) {
    body {
        background: url('../../img/mywallpaper.jpg') center/cover no-repeat fixed !important;
    }
}

f:id:esperia:20171216234025p:plain

さみしくない!ほくほく。

GitbucketをUbuntuに入れる

自分用リポジトリが欲しかったので。

環境

  • Ubuntu 16.04.3 LTS (Xenial Xerus) on AWS
  • nginx version: nginx/1.10.3 (Ubuntu)
$ cat /etc/os-release
NAME="Ubuntu"
VERSION="16.04.3 LTS (Xenial Xerus)"
(省略)

手順

## javaインストール
$ sudo apt install openjdk-8-jre-headless
$ java -version
openjdk version "1.8.0_151"
OpenJDK Runtime Environment (build 1.8.0_151-8u151-b12-0ubuntu0.16.04.2-b12)
OpenJDK 64-Bit Server VM (build 25.151-b12, mixed mode)

## 普通に手順進めていく
$ sudo groupadd -g 555 gitbucket
$ sudo useradd \
  -g gitbucket --no-user-group \
  --home-dir /opt/gitbucket --no-create-home \
  --shell /usr/sbin/nologin \
  --system --uid 555 gitbucket

## 勝手にディレクトリできないので作って、ファイルのダウンロードもしておく
$ sudo mkdir -p /opt/gitbucket
$ sudo curl -o /opt/gitbucket/gitbucket.war -L https://github.com/gitbucket/gitbucket/releases/download/4.19.2/gitbucket.war
$ sudo chown -R gitbucket:gitbucket /opt/gitbucket

## ファイルを作る。内容は後述
$ sudo vim /etc/systemd/system/gitbucket.service

## 起動
$ sudo chown root:root /etc/systemd/system/gitbucket.service
$ sudo chmod 644 /etc/systemd/system/gitbucket.service
$ sudo systemctl daemon-reload
$ sudo systemctl start gitbucket.service
$ sudo systemctl enable gitbucket.service

## 起動確認
$ curl localhost:8100

gitbucket.serviceこれを少し編集して使った。公式repoの中はちゃんと探してない。そこにもあるんだろうか

[Unit]
Description=Git hosting service

[Service]
User=gitbucket
ExecStart=/usr/bin/java -jar /opt/gitbucket/gitbucket.war --port=8100 --host=127.0.0.1 --gitbucket.home=/opt/gitbucket

[Install]
WantedBy=multi-user.target

起動確認までできたら、次は外から見えるようにReverse Proxyの設定をする

Reverse Proxy

$ sudo vim /etc/nginx/sites-available/gitbucket
$ sudo ln -s /etc/nginx/sites-available/gitbucket /etc/nginx/sites-enabled/
$ sudo systemctl restart nginx

Reverse Proxyの設定、僕はほとんど同じにしました。 server_nameproxy_pass のポートを変えただけ。

ついでにDBをMySQL使うように設定しておく

$ mysql -uroot -p
> create database gitbucket;
> grant all privileges on `gitbucket`.* to gitbucket@localhost identified by 'testPassword';
> flush privileges; 
> quit

$ sudo vim /opt/gitbucket/database.conf
db {
  url = "jdbc:mysql://localhost/gitbucket?useUnicode=true&characterEncoding=utf8"
  user = "gitbucket"
  password = "testPassword"
}

$ sudo systemctl restart gitbucket.service

余談

ちなみに僕の環境はt2.nanoなので、よくメモリ足りなくなるため、スワップファイルも作ってます。途中でメモリ足りない系エラーでるならこれやると吉かもしれない

AWS Amazon Linux スワップファイル作成によりSwap領域のサイズを増やす - Qiita

DTI使ってみたけど、やめてAWSにしてみようと思う

要件

  • node, php with nginx, java が使いたい

なぜ

検索したらヒットしたけど、php-fpm等がインストールできないらしい。 僕の場合 yum install openssl-devel したら発生。つまり openssl-devel パッケージを入れることが出来ないので、phpコンパイルが通らない

Error: systemd conflicts with initscripts-9.49.17-1.el7_0.1.x86_64
 You could try using --skip-broken to work around the problem
 You could try running: rpm -Va --nofiles --nodigest

頑張ってもいいけど、時間がもったいない気がするのでやめよかなと思っている

以下メモ

契約の流れ

  • 登録は簡単、住所氏名クレジットカード番号を入れるとすぐに利用できた
  • 支払いは、月の途中だと月末までの日数払いになるっぽい。僕の場合は2017/11/23に契約したので134円だった

解約の流れ

プランの解約と退会がそれぞれある。両方やっておいたほうがいい 退会は少し面倒。たらい回しにされるのでページを探すのにはちょっと苦労した。退会はメールフォームからの問い合わせになる。

解約できたらまた書く

CLIでのWordpressのドメイン移行方法

Wordpressのお引っ越しについて

Wordpressにおいて、下記のようにお引っ越しをすることがよくあります。

  • サイトを引っ越しする際
  • ローカルで動かしていたサーバをリモートへデプロイする際

ただ、このように別ドメインへ移行する際、

  • ファイルを全てそっくりそのままコピー
  • 移行元のDBのデータをエクスポートして、移行先でインポート

という手順を踏んでも、移行先でそのまま動作しません。これは、ドメイン名がデータベースの中に入り込んでいるせいなのですが、この問題自体は検索すると詳しい手順がたくさんヒットします

殆どの記事はよく出来ていて困らないと思うのですが、SSH使える人であればもう少し簡単に移行出来るのになと思ったので、メモしておきます。

なぜこの記事を書いたか

移行方法を検索するとよく出てくるのは、こちらのツールを使用する方法です。

https://interconnectit.com/products/search-and-replace-for-wordpress-databases/

検索した時に出てくる方法だと、このツールをWebから見れるようにデプロイして移行する方法が多く取られているようにみえました。しかしこのツール、コマンドラインのインターフェースも用意されているので、僕的にはその方がメリットあるなと思ったので書き残しておこうかなと思った次第です。

メリットあると思った理由は以下の通り。

  • 誰でもアクセスできる場所にさらされる期間がないため、セキュリティリスクが低い
  • cliは文字のため、どのような引数を指定して移行したのかをまるごと記録として残せる
  • ダウンロードしてすぐに実行出来るので、煩雑さがない

お引っ越し方法

  • 先程のツール のContributionsセクションに書かれてある、 GitHubのURL からアクセス
    • アクセスする前に、きちんと Download Search Replace DB セクションの内容は読んでおきましょう。
    • 2017/10/16現在、emailアドレス入力→ダウンロードした時と、git-cloneした時のものの内容は同じようです。
  • 移行先のサーバへSSHで接続し、 git clone https://github.com/interconnectit/Search-Replace-DB.git する
    • git-cloneする場所はどこでもいいです。DocumentRoot以下は避けましょう
  • cd Search-Replace-DB する
  • move.sh 等の名前でファイルを作成し、その中に下記のスクリプトを入力
php srdb.cli.php \
  --host localhost \
  --name <データベース名> \
  --user <ユーザー名> \
  --pass <パスワード> \
  --search "<移行元ドメイン>" \
  --replace "<移行先ドメイン>" \
  --dry-run

引数の詳細は https://github.com/interconnectit/Search-Replace-DB#cli-script を確認してください。

  • . ./move.sh を実行
    • --dry-run がついているので、実際にはまだ実行されません
    • ここでどれだけのクエリが実行されるかを確認できる
  • move.sh を再度開き、 --dry-run を削除
  • 再度 . ./move.sh を実行
    • 実際にクエリが実行されます
  • 移行先ドメインへアクセスして動作しているかを確認

その他

  • PHP 7.1.8 (cli) を使って移行したところ、PHP Noticeがでました。が、移行は正常にできました。 (Issueはこちら)
Notice: A non well formed numeric value encountered in /path/to/Search-Replace-DB/srdb.cli.php on line 202

Call Stack:
    0.0012     387272   1. {main}() /path/to/Search-Replace-DB/srdb.cli.php:0
    0.0050     526432   2. icit_srdb_cli->__construct() /path/to/Search-Replace-DB/srdb.cli.php:227
    0.0092     544968   3. icit_srdb_cli->replacer() /path/to/Search-Replace-DB/srdb.class.php:337
    0.5026     642544   4. icit_srdb_cli->log() /path/to/Search-Replace-DB/srdb.class.php:995

VimFxではてなブックマーク

[2017-06-01 18:23 追記] 公式のブックマークレット、内部でhttp呼んでるからhttpsで使えない(Mixed Contentになる)!!だめじゃん!!ということでこの記事は早くも消費期限切れです

前に導入記事に加えてこれ書いたんですけど、その時はショートカットで新しくウィンドウを開いて、ブックマークさせる感じでした。で、よく考えたらブックマークレット実行してあげたほうが良いじゃんって思ってエントリ書いてます。

ちなみになんでFirefox拡張使わないのかというと、現状それ入れるとe10sが無効になるからです。

導入

下記をそれぞれconfig.js/frame.jsに入れます。

config.js

vimfx.addCommand({
  name: 'open_hatena_bookmark_entry',
  description: 'Open Hatena Bookmark Entry',
}, ({vim}) => {
  vimfx.send(vim, 'openHatena', {}, () => {});
});


let map = (shortcuts, command, custom=false) => {
  vimfx.set(`${custom ? 'custom.' : ''}mode.normal.${command}`, shortcuts)
}

map('cc', 'open_hatena_bookmark_entry', true);

frame.js

vimfx.listen('openHatena', (params, callback) => {
  var document = content.document;
  // Hatena ブックマークレットの中身
  // https://www.hatena.ne.jp/tool/bookmarklet
  (function() {
    var d = (new Date);
    var s = document.createElement('script');
    s.charset = 'UTF-8';
    s.onload = callback;
    s.src = 'https://b.hatena.ne.jp/js/Hatena/Bookmark/let.js?' + d.getFullYear() + d.getMonth() + d.getDate();
    (document.getElementsByTagName('head')[0] || document.body).appendChild(s);
  })();
});

React Nativeとionic2

この記事書きながら調査。ある程度調査した後気づいたけど、ReactNative、WebView上で動かない意味でアーキテクチャ全然違うので比較として微妙だ…。

認識あってるんかなー