TL; DR
- JS製国産ゲームライブラリ、phina.jsを使おうと思った
- イイ感じのボイラープレートがなかった
- phina-starterを作ってGitHubに上げた
- 良ければ使ってね
phina.jsを使い始めた
どうも、カタチから入るマンことPちゃんです。
昨日から、以前より気になっていた、新進気鋭のJS製国産ゲームライブラリのphina.jsを使い始めました。
使ってみようとした
開発を始めようと思い、公式サイトを見たがnpmの表記が一切ない。
CDNから読み込んで簡単に使い始められるよ！的なことが書いてあるが、ES6だなんだって言ってる時代にCDNから読み込んで使うのか、うーんとなる。
そう思ったぼくは、Twitterで「phina.js、npmで使えないのがなぁ...」(よく考えれば直接githubのリポジトリ指定してnpm installしろみたいな話ではある)みたいなことを呟いたら、作者の人がリプくれて、リプを返したら、ものの数時間もしないうちにnpmに最新のphina.jsを登録してくださいました。ありがとうございました。
(こういうのが個人開発、国産ライブラリの良いところだと思う)
これで$ npm i phina.jsで最新版のphina.jsがインストールできるようになりました。
カタチから入るマン、ボイラープレートを作る
さてさて、ネットで軽くphina.jsについてググっても、だいたいのサンプルがCDNから読み込んで使っているわけですね。
簡単でとても良いと思うのですが、せっかくなのでもう少しイイ感じに開発を進められるようにしたいです。
そんなこんなで、phina-starterを作りました。
p1ch-jp/phina-starter
A starter kit for phina.js
watchifyを使った自動コンパイル、babelifyを使ったES6対応、budoを使ったローカルサーバー(ライブリロード対応)という感じにしました。
なんとなく気分でGruntやGulpなどのタスクランナーを使わずnpm scriptsだけで動く感じにしました。
使い方
使い方は以下
$ git clone git@github.com:p1ch-jp/phina-starter.git
$ cd phina-starter
$ npm install
$ npm start
http://localhost:9966にアクセスしてphina.jsのバージョンが出たら成功ですので、頑張ってゲーム作ってください。
./build/bundle.jsがNo such directory or fileみたいなエラー吐いたらmkdir buildでbuildディレクトリを作ってください。
基本的な構成としては、./src/index.jsでガリガリ書くと、./build/bundle.jsに吐き出されて、それをindex.htmlから読み込み、RUN!!って感じです。
環境ができたところで、ちゃんとゲーム作ります。