JavaScript
コマンド $ npm init $ npm i websocket $ node server.js #サーバー動かす コード server.js var http = require('http'); var WSServer = require('websocket').server; var url = require('url'); var clientHtml = require('fs').readFileSync('test.htm…
サーバー接続 一緒に見たいのでメモレベル削除予定 ※test.htmlを同階層に設置 const http = require('http'); const hostname = '127.0.0.1'; const port = 3000; var server = http.createServer(); server.on('request', doRequest); // ファイルモジュー…
プログラミングの難しい点は環境作りにある 初心者が最初につまづくであろう物がプログラミング環境の準備だ バージョンがOSが前提ライブラリがモジュールが… 人間が紙に命令や手続きを書いて実行するのをプログラムと呼ぶのであれば 純粋なプログラミングに…
Reactの^公式チュートリアルわからん！ cdnを使おう HelloWorld!! <html> <head> <meta charset="utf-8"> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.min.js"></script> </meta></head></html>
想定環境 基本ローカルのみでのFirebase開発、シンプルなZenHab管理 独自のユニークな機能のためのAPIサーバー 現状どうしても追記したAPIサーバーが必要になるように思う ※上層の要望や機能洗い出しや資料作成は含めてない 構成 [管理] Githubでの世代管理 …
var tiruno_img_url = { "up" : [ "http://cdn-ak.f.st-hatena.com/images/fotolife/s/surume_Reflection/20170131/20170131020640.png?1485796241", "http://cdn-ak.f.st-hatena.com/images/fotolife/s/surume_Reflection/20170131/20170131020639.png?1485…
■再帰的なRiotJSのタグの書きかた 再帰的にタグを書いてしまうとスタックオーバーフローになる web上でriot.js 再帰とかで検索しても日本語の物が少ない <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/riot/2.0.15/riot+compiler.min.js"></script> </head> <body> <object></object> <script type="riot/tag"> <object> <p>{key}：{value}</p> </object></body>
■手始めに１０進数を２進数に変換する関数 (バイナリ時計 - Wikipedia) function get2(num){ var binary = []; while(true){ binary.unshift(num%2); num = parseInt(num/2); if(num<1) break; } return binary; } さっそくサイドバーに実装→ ■我ながらかな…
ログイン認証 var fireApp = firebase.initializeApp(config); var fireAuth = fireApp.auth(); fireAuth.signInWithEmailAndPassword(email, password).then(function(){ alert("ログイン認証成功"); }); fireAuth.onAuthStateChanged(function(user) {});/…
RiotJSのRouteサンプル <head> <title>RiotJSのRouteサンプル</title> <meta charset="utf-8"> <script src="https://cdnjs.cloudflare.com/ajax/libs/riot/2.0.15/riot+compiler.min.js"></script> </head> <body> <div> <div id='header'> <a href='#app/first'>first</a> <a href='#app/second'>second</a> <a href='#app/third'>t…</a></div></div></body>
■上の階層でtrueすると下層全てに許可される { "rules": { ".read": true, ".write": true, "users": { "$uid": { ".read": "auth != null && $uid === auth.uid", ".write": "auth != null && $uid === auth.uid" } } } } rulesに読み込み,書き込み許可して…
qiita.com paiza.hatenablog.com qiita.com 「firebase」のYahoo!検索（リアルタイム） - Twitter（ツイッター）、Facebookをリアルタイム検索 Googleの改修によるちょっとした盛り上がりかもしれないが... いずれにせよ最終的にはサーバーサイド消滅して欲…
riot.js+firebase.databaseのサンプル <head> <title>firebase-crud-riot</title> <meta charset="utf-8"> <script src="https://www.gstatic.com/firebasejs/3.5.3/firebase.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/riot/2.0.15/riot+compiler.min.js"></script> <script> var config = { apiKey: …</meta></head>
こんな事に半日使ったのかといまだにモヤモヤする。 大文字でタグを書いた場合ネストしたタグは動かない(異常系) <html> <body> <script src="https://cdnjs.cloudflare.com/ajax/libs/riot/2.0.15/riot+compiler.min.js"></script> <test></test> <script type="riot/tag"> <test> <h2>{ opts.title }</h2> <TEST2 arg={'子タグ(ネストするタグ)'}></test2></test></body></html>
<script src="http://fb.me/react-0.13.3.js"></script> <script src="http://fb.me/JSXTransformer-0.13.3.js"></script> <div id="app"></div> <script type="text/jsx"> var hello = "HelloWorld"; React.render( <h1>{hello}</h1>, document.body ); </script> <h1>{hello}</h1>渡すのは文字列じゃなくて良いのかJSXと言うらしい よくわからんので調べてみ…
クライアントからのデータは基本信用してはいけない 今回はこのゲームで確認してみる、このゲームでは大幅な部分をJSで書いている minmaxia.com 最初に選択したのはこの三人 * Fighter Tank character. Powerful melee attack. * Priest A healer and a kill…
■新規プロジェクトを追加 ※firebaseダッシュボードはfirebase consoleとしてまとめられたので 既にプロジェクトを作成している人はインポートの必要がある プロジェクト選択画面のメニューから旧ダッシュボードも使用可能 おそらく使えなくなるのでインポー…
function Point(x,y){ //座標(set/get, sum) this.x = x; this.y = y; this.setPoint=function(x,y){this.x = x;this.y = y;} this.getPoint=function(){return this;} this.sumPoint=function(point1){this.x+=point1.x; this.y+=point1.y;} } //2点の距離 …
移動処理 [Aキー][Dキー]で移動 #座標に描画するよう修正 var point = {x: 0, y: 0}; ctx.drawImage(image, point.x, point.y); #キーイベント追加 var key = []; //キーイベント window.addEventListener('keydown', key_down_e, true); //キーアップ funct…
画像を切り替えて描画する事で動いているように見せる事ができる。 通常はスプライト画像を使用するがわかりやすいよう分割 アニメーション <canvas id="canvas" width="256px" height="32px"></canvas> <script> var canvas = document.getElementById('canvas'); //canvasをidで取得 var ctx = canvas.getContext("2d"); //…
今回のためだけにこんな画像を用意 これだけで疲れた... チルノ戦隊！ わかりやすくするため画像は分割して拡大縁付けした 描画 <canvas id="canvas" width="256px" height="32px"></canvas> <script> var canvas = document.getElementById('canvas'); //canvasをidで取得 var ctx = canvas.getContext("2d"); //描画用contex…
$(function(){ var board_xcount = parseInt($(document.body).width()/100); var board_ycount = parseInt($(document.body).height()/100); var frame_block = $("<div>"). css("opacity", 0.5). css("width", 100). css("height", 100); var clearance_width =</div>…
//空アプリケーション配列 if(typeof(TestApplicationArray) == "undefined"){ var TestApplicationArray = {}; } var applicationName = 'app_name';//アプリケーション名 if(typeof(TestApplicationArray[applicationName]) == "undefined"){ //アプリケー…
ゲームみたいなのを綺麗だから置いてみた ・クリックすると要素が落ちる ※`document.elementFromPoint`で座標上の要素取得して再帰的に落下させてる とりあえず見にくくなったしすごくじゃま 面白い事にブログ上のヘッダなども落ちてくる そのうち埋め込んだ…
canvas置けない><; JSをモジュールパターン化しないと名前空間がまずい... bashalog.c-brains.jp canvasタグ置くだけじゃダメ？ｗ 翌日... 1.HTML 2.JS 上の順置かないといけないのか???...あとウアサハかわいい JSから生成する分には置ける..えぇ.. "Hey, g…
