プログラミング初心者がphina.jsでゲームを作る①

phina.js
在宅さん
在宅さん

みなさんこんにちは
在宅勤務中に、プログラミングの練習をしている在宅さんです
※仕事はちゃんとやっています(震え声)

いきなりですがゲームを作っていきます。
プログラミングを始めたら一度は作ってみたいと思ってました。

phina.js

今回使っていくのは「phina.js」です。
リンク先:https://phinajs.com/

日本語で書いてあるので初心者でも入りやすいのではと思います。
「GETTING STARTED」ボタンよりまず資材を入手します。

在宅さん
在宅さん

ホームページの鳥かわいい

試してみる

先ほどダウンロードしたZipを解凍すると、htmlファイルとjsファイルがあります。

なんとindex.htmlを開くだけでもうサンプルが出来上がっています。
初心者にはとてもありがたいです。

HTMLの中身を見ると、以下のように記述されています。

<!doctype html>

<html>
  <head>
    <meta charset='utf-8' />
    <meta name="viewport" content="width=device-width, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />

    <title>Getting started | phina.js</title>
    <!-- phina.js を読み込む -->
    <script src='http://cdn.rawgit.com/phi-jp/phina.js/v0.2.0/build/phina.js'></script>
    <!-- メイン処理 -->
    <script src='main.js'></script>
  </head>
  <body>
  </body>
</html>
在宅さん
在宅さん

htmlにこの1文を入れればよさそうです
結構簡単ですね

<script src='http://cdn.rawgit.com/phi-jp/phina.js/v0.2.0/build/phina.js'></script>

テキストエディタがない方は、phina.jsのサイトにあるRunstantというWebエディタを使うと楽に編集ができます。
Runstantでテンプレートを作成をすると、このようになります。

test - Runstant | Runstant
思いたったらすぐ開発. プログラミングに革命を...


勉強できそうなラインナップもあるのでここら辺もいつかはやりたいです。

タイトルとURLをコピーしました