Help us understand the problem. What is going on with this article?

phina-starter - とりあえずイイ感じにゲームを作り始めたい人のためのボイラープレート

More than 3 years have passed since last update.

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.jsNo such directory or fileみたいなエラー吐いたらmkdir buildでbuildディレクトリを作ってください。

基本的な構成としては、./src/index.jsでガリガリ書くと、./build/bundle.jsに吐き出されて、それをindex.htmlから読み込み、RUN!!って感じです。

環境ができたところで、ちゃんとゲーム作ります。

0x50
コーダーです。インターフェイス周りのデザインや実装をやります。フロントエンドからサーバーサイドまで、色んな領域に足を突っ込んでは引き抜いてを繰り返しています。
http://p1ch.jp
dena_coltd
    Delight and Impact the World
https://dena.com/jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした