PRIMARY KEYがついているカラムをAUTO_INCREMENTに
ある、hoge_tb というテーブルをつくって、しばらく運用してしまった後に、そのカラム ID をAUTO_INCREMENTにしたくなったときにどうしたらよいか、という話。
といあえず思いついた2パターンを試してみる。
mysql> ALTER TABLE hoge_tb CHANGE id INT(11) NOT NULL AUTO_INCREMENT; ERROR 1064 (42000): You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near 'INT(11) NOT NULL AUTO_INCREMENT' at line 1
mysql> ALTER TABLE hoge_tb CHANGE id id INT(11) NOT NULL AUTO_INCREMENT; ERROR 1062 (23000): ALTER TABLE causes auto_increment resequencing, resulting in duplicate entry '1' for key 'PRIMARY'
ダメだ、、、。
調べてみると、どうやら sql_mode をいじればよいとのこと。
mysql> SET SESSION sql_mode='NO_AUTO_VALUE_ON_ZERO'; mysql> ALTER TABLE hoge_tb CHANGE id id INT(11) NOT NULL AUTO_INCREMENT; mysql> SET SESSION sql_mode='';
ちなみに、その後大体テストをすると思うのだが、それはすなわち AUTO_INCREMENT のインデックスが進んでしまうということ。 インデックスをリセットするためには、
ALTER TABLE hoge_tb AUTO_INCREMENT=1000;
とかすればよい。
参考： MySqlでauto_increment を追加しようとしたら、エラー！！ | Webridge Tech Blog
JavaScriptの勉強方法
Node やら Socket.io を使うプロジェクトがはじまったので、きちんと JavaScript を勉強しようと思って、二週間ほど記事読んだり、いろいろ見たりしていた。 普段、ブラウザで表示するためのものを書く分には何も気にせず jQuery 使っていればいいのだと思うのだけれど（この時点で異論がある人もいる気がするけれど、僕はフロントエンドフリークじゃないんで、 jQuery ファイルひとつで済むようなことしかしないし、アニメーション描きたい人は Bower や CoffeeScript の達人でも参照してくれ）、サーバサイド書くとなるともう少しいろいろ気にしなければいけないなと思ったので。 結論から言うと、下の三つのサイトがかなり役に立った。
JavaScript をきちんと学ぶ How to Learn JavaScript Properly | JavaScript is Sexy
関数の宣言方法（と使い方） 連載：Ajax時代のJavaScriptプログラミング再入門：第2回 JavaScriptの関数をマスターしよう (4/4) - ＠IT
コールバックを理解する Understand JavaScript Callback Functions and Use Them | JavaScript is Sexy
補足：コールバックがどう動作しているのかを理解するのはとても重要なことだと思うのだけれど、日本語の記事がまともに存在していない気がする。対処法ばかりではなく、そもそもの動作原理を知ると理解が早い気がする。 Node.jsフロー制御 Part 1 – コールバック地獄 vs. Async vs. Highland | プログラミング | POSTD とかは対処法についての解説として非常によいのだけれど。
JavaScript.isSexy はとても参考になる。 かなりいい記事がある印象。
この reddit のスレッド も随分参考になった。
なんとなく使い方が分かったら、あとは使うだけだと思うんだけれど、 Train with Programming Challenges/Kata | Codewars とか使って、調べつつも書き続けるのが一番上達しそうな気がした。
コールバックの記事とか和訳の価値ある気がするけど、長い、、、。
----- 2015/12/28追記
Qiita 上で年末まとめ記事が大量に出ている中で、keitarou さんがご自身の JavaScript 習得経験をまとめていらっしゃったので、追記：
Bower + RequireJS
なんとなく Bower 使って RequireJS するライブラリをマネージする方法が分かってきたのでメモ。
npm インストール後から。
# npm 使ってインストール npm install -g bower # 動作確認 bower -v # 好きなディレクトリへ cd myDir # bower の初期設定 質問は適当に答えれば OK bower init
bower initまで実行すると、実行したディレクトリ内に質問に答えた内容を記述した設定ファイル、bower.json が生成されているのが確認できる。このファイル内にパッケージ名を記入することで、bower はプロジェクトの依存ライブラリを管理できる仕組み。
bower init を実行するのはどこでもいいのだが、可視性のためにもプロジェクトのトップディレクトリにおいておくのがよい気がした。
たとえば、今回は Masonry の依存関係を記述するために使ってみたので、以下のようなものになる。
{
"name": "klee-arc",
"version": "1.4.1",
"authors": [
"klee-arc <hoge@gmail.com>"
],$
"description": "none",
"main": "index.js",
"keywords": [
"masonry"
],
"license": "MIT",
"dependencies": {
"jquery": "~2.1.4",
"masonry": "~3.3.0",
"infinite-scroll": "~2.1.0",
"requirejs": "~2.1.17",
"modernizr": "~2.8.3",
"jquery-bridget": "~1.1.0"
}
}
極めて分かりやすい。
パッケージを新しくインストールするためには、bower.json の置いてあるディレクトリ内で
bower install --save パッケージ名
と実行することでそのライブラリを bower_components 内にダウンロードした上で、bower.json への記述までやってくれる。ちなみに、--save を指定しないと bower.json への記述はせずにライブラリをダウンロードする。 実際には bower_components なんてフォルダに入れてもらいたくはないだろうから、bower.jsonと同じディレクトリ内に、.bowerrc というファイルを作成し、以下のようにダウンロード先のディレクトリを指定するといい。
{
"directory" : "js/components"
}
一方、開発用だけに使いたいライブラリ（コンパイル系など）は、
bower install --save-dev パッケージ名
とすることで、開発用のパッケージとして bower.json 内に記述される。
bower.json 内に記述されたライブラリをインストールする際は、引数に何も指定せずに、
bower install
もしくは、
bower install --production
とすればよい。 後者を実行すると先ほどの開発用のライブラリ群はインストールされない。
今回は RequireJS を使うので、RequireJS 、Masonry 、Masonry 用に jquery-bridget の三つを指定してインストール。
bower install --save requirejs masonry jquery-bridget
ここまで来ると、RequireJS を使うことができるようになる。 今後ディレクトリ構造が重要になるので、一度今回のプロジェクトのファイル構成を下に書く :
- .bowerrc
- bower.json
- index.html
- js --- components --- main.js
大体上記のとおりである。
さて、当然 RequireJS は components の中にあるので、index.html には以下のように記述する。
<script type="text/javascript" data-main="js/main" src="js/components/requirejs/require.js"></script>
上記の記述をすると、 require.js を呼び出したのち（を使って？）、js/main.js を実行してくれる。 なので、今度は js/main.js に呼び出しの記述をしていく。
js/main.js は以下のようになっている :
requirejs.config({
baseUrl: 'js/components',
paths: {
'jquery': 'jquery/dist/jquery.min',
'masonry': 'masonry/dist/masonry.pkgd.min',
'bridget': 'jquery-bridget/jquery.bridget'
},
shim: {
'masonry': {
deps: ['jquery','bridget']
}
}
});
require(['masonry'], function(masonry) {
$.bridget( 'masonry', masonry );
$("#container").masonry({
columnWidth: 100,
itemSelector: '.item'
});
})
まずは requirejs.config() で RequireJS の設定をすることができる。
- baseUrl : ライブラリを呼び出す際の可憐とパスとして指定されるパス。 ここでは js/components を指定しているので、以降パスを記述すると、js/components/~ という風に解釈される。
- paths : パスの記述。 ここに記述しておくと、実際にライブラリを呼び出すコードとライブラリの配置場所の記述を分離できてとても便利。
- shim : 依存関係の記述。 各ライブラリごとに、deps というパラメータで依存するライブラリを、exports というパラメータでそのライブラリに割り当てるグローバル変数を指定可能（exports は使ったことないけれど、jQuery の「$」みたいな感じだと思う）。
他にも bundles とかいろいろあるけど、とりあえず最低限上記三つを把握しておけば死なないと思った。
その後、require() で呼び出して、コールバックをセットしておくことで、ライブラリがロードされた後に実行したいコードを指定できる。
この要領で他のライブラリも追加していけばいい。 requirejs-plugin-bower とかいう bower.json を自動で読んでライブラリの記述を勝手にしてくれるプラグインもあるようだが、試してみても動かなかったことと、実際にはページによって使うライブラリが変わったりすることは割とあり得ることだなと思い、今回は使わなかった。 ちょっと記述が多めな SAP をつくるときには便利なのかもしれない。
ちなみに、Masonry が jquery-bridget とかいうライブラリがないと RequireJS では使えないことと、RequireJS のウェブサイトが異様に不親切なことにびっくりした。
参考 :
RequireJS RequireJS使い方メモ - Qiita [JS] RequireJSのオプションで良く利用するBaseUrl, Paths, Shimを学ぶ - YoheiM .NET
フロントエンド用の JavaScript フレームワーク選びに困っている話
人気上昇中のJavaScriptライブラリを調べてみた【2015年版】 - Build Insider
Backbone.JSからAngular2まで、全9大JavaScriptフレームワークを書き比べた! - paiza開発日誌
現在の JavaScript フロントエンドフレームワークの現状は大体上記の通りで、はっきり言ってめちゃくちゃ困る。 JavaScript 使ったサーバサイドフレームワークはほとんど Express 一択、というかシングルページの場合は最悪なくてもいいや、というのが世界の総意だと思っているのだけれど、結局そのような場合一番コストが高いのはデータバインディングなわけで、フロントエンド側に付随する JavaScript のメンテナンス性とかの方が重要になってくるのは当たり前の話。 で、今時そういうのは無限にある。 メジャーなところでいうと、
Angular 、Angular 2.0 、Backbone ( + Rendr? )、Ember、Knockout 、Reactive 、vue 、Ractive 、Polymer 、Aurelia ……。
無限にある。
みんな本当は meteor とか rendr みたいな、サーバサイドときちんと相互性を持ったライブラリが登場してくれるといいのだけれどと思ってると思うのだけれど（ Angular では役不足な場面が多いように思える meteor は使ったことないけど評判良さそう ）……※。
Angular 2.0 と React と Polymer は今度試してみたい。
※ Spine 、batman 、CanJS って流行っていないように思うんだけど、気のせい？
Raspberry PIが起動時にプログラムを実行して、自動的にブラウザを開くようにする
1. 自動ログイン設定
$ sudo vi /etc/inittab
して、以下の通りに変更
# こうなっている場所を 1:2345:respawn:/sbin/getty 115200 tty1 # こうする #1:2345:respawn:/sbin/getty 115200 tty1 1:2345:respawn:/bin/login -f pi tty1 </dev/tty1 >/dev/tty1 2>&1
2. スクリプトの自動実行を設定する
$ sudo vi /etc/rc.local
して、以下をexit 0 と書かれている前に書く
# パスやファイル名はお好きに $ sudo -u pi /home/pi/bin/my-script.sh
3. スクリプトを用意する
$ cd ~ $ mkdir bin $ vi bin/my-script.sh
書き込む内容はたとえば下記のような感じ
#!/bin/sh SCRIPT_PATH=/home/pi/script/ $OCTOPRINT_HOME/run
4. LXDE起動時にブラウザを自動で開く
Raspberry PI 2とかはこちら
$ sudo vi /etc/xdg/lssession/LXDE-pi/autostart
古いOSを動かしているときはこちら
$ sudo vi /etc/xdg/lssession/LXDE/autostart
書く内容は以下のような感じ
# @lxpanel --profile LXDE-pi # @pcmanfm --desktop --profile LXDE-pi # @xscreensaver -no-splash @xset s off @xset -dpms @xset s noblank @epiphany-browser http://localhost:3000 # 開きたいページ
5. Raspberry PI起動時に自動的にGUI（LXDE）を起動するように設定
$ sudo raspi-config
を実行して、
Select Enable Boot to Desktop/Scratch from the menu and press Enter > Step 3: Select Desktop Login as user pi at the Graphical Desktop.の順番で選択。再起動したいか>聞かれるので、ここまですべて済んでいたら再起動を実行。すべて動作するのを確認しておしまい。
6. おまけ：やめたいとき
いきなりビジュアルモード（OSのインタフェースなし）に突入するので、コマンドだけではどうしようもない。マウスの偉大な力が必要。マウスを使ってブラウザをずらし、バックグラウンド（真っ黒で怖い）を右クリックすると、Open Terminal Emulatorと出るので、再度sudo raspi-configやLXDEの設定をいじることで通常に戻ることができる。
