今回は、Firebaseというサービスを使ってWebサイト上で動作するアプリケーションをいくつか作ってみたのでご紹介します。
![今Googleで最も熱いサービスFirebaseで、リアルタイムWebアプリをサクッと作ってみた | PLAID engineer blog](https://cdn-ak-scissors.b.st-hatena.com/image/square/8365288895414d2a99d689fece9a474b72c7a959/height=288;version=1;width=512/https%3A%2F%2Fik.imagekit.io%2Fnewt%2F61b151f921640c0018173598%2F3f3c5ea9-d4ac-4812-a2e9-ade31030c687%2Ffirebase-webapp-3.jpg%3Ftr%3Dw-1000%2Ch-1000%2Cc-at_max)
JavaScriptコードを圧縮・最適化・難読化する「Closure Compiler」のJavaScript版をGoogleが公開。Node.jsもしくはWebブラウザ上で実行可能 JavaScriptのコードを実際のアプリケーションとしてデプロイする場合には、コード内のコメントやタブ、スペース、改行などの余計な要素を削除し、変数名を短くしたりコードの冗長性を排除するといった最適化を行うことで、ロード時間を短縮しコードを高速に実行できるようになります。また、コードの中身を簡単に読めないよう、難読化を行うことも多いでしょう。 こうしたJavaScriptコードの圧縮や最適化、そして難読化を行ってくれる代表的なツールの1つが、Googleがオープンソースで公開しているClosure Compilerです。 Closure Compilerはコードの単純な圧縮や最適化だけでなく、JavaScr
どうも、まさとらん(@0310lan)です。 みなさんは、音声認識を活用していますか? 例えば、iOSの「Siri」と会話してみたり、Androidなら「OK Google」と喋って検索した経験があるのではないでしょうか? 今回は、このような音声認識を利用し、PCのChromeブラウザに喋りかけることで動作するサンプルデモのチュートリアルをご紹介しようと思います! ■音声認識に必要なAPIとは? まず最初に必要なのが、自分の「声」を音声として認識してくれるAPIなのですが、実はPCのChromeブラウザであれば今すぐJavaScriptから利用できるようになっています。 Web Speech API:ブラウザ対応状況 「Web Speech API」を使うことで、特別なツールをインストールしたり、余計なライブラリを読み込む必要は無いわけです。 ちなみに、このAPIには大きく分けて「音声認識
物理演算とは物体の運動を物理法則に基づき数値計算することです。Web業界ではゲームやビジュアル表現の分野で利用されています。アクションゲームを例にすると、キャラクターが地面に立つ、ジャンプする、重力落下する、壁とぶつかる、坂道を滑り落ちる、といったことが物理演算の実装範囲になります。 本記事ではGoogleが提供するJavaScriptライブラリ「LiquidFun」を題材にHTML5で利用可能な物理演算シミュレーションの表現を紹介します。 ▲「LiquidFun」の公式サイトではドキュメントやデモが掲載されている 物理演算ライブラリ「LiquidFun.js」とは LiquidFunは2次元の物理演算ライブラリの定番「Box2D」をベースとした拡張ライブラリです。Box2Dが提供する基本的な物理演算機能をはじめ、LiquidFunによるプラスアルファの機能が提供されています。 重力 (B
[レベル: 中級] CSSとJavaScriptのファイルへのアクセスをrobots.txtでブロックしているサイトに対して、Search Console経由で警告メッセージをGoogleは一斉に送信し始めました。 CSSおよびJSファイルにGooglebotがアクセスできません Google Search Console Teamから次のようなメッセージが届きます。 http://example.com/ の CSS および JS ファイルに Googlebot がアクセスできません http://example.com/ のウェブマスター様 Google のアルゴリズムによるコンテンツのレンダリングとインデックス登録に影響を及ぼす問題が貴サイトで発生していることが Google のシステムにより判明しました。具体的には、robots.txt ファイルでの制限のために Googlebot
Google JavaScript Style Guide 和訳 Google JavaScript Style Guide の本家の更新に和訳も追従した。 主な変更点 クリティカルな修正が多かった。そもそもの言語仕様の間違いが二点と、脆弱性につながるルールの修正。 NaN == NaN が true になるという 間違った記述 の修正 セミコロン省略時の自動挿入について。二項演算子の前には自動挿入されないが、されるという前提のルールになっていた。そのためルールの必然性がなくなってしまった。 その旨をコメントに記載しつつ、一貫性のため過去と同じルールでこれからも行くことになった。 eval() の利用を JSON のパースに利用することを禁止。普通に JSON.parse() を推奨するように。 JSON を eval() でパースすると、悪意のあるコードが実行される脆弱性になる。その旨も
こんにちは、中川です。 今回は「Google JavaScript Style Guide」を気軽にチェックできるClosure Linterをご紹介したいと思います。 http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml Google JavaScript Style Guideのいいところですが、 規約だけでなく、しっかりしたツールも揃っているところが素晴らしいと思います。 コーディング規約はあったとしても、それに従っているか定期的に簡単にチェックする方法がないと、 いつしか守られないまま開発されてしまうことになりますね。 ※今回の内容はMacにて動作確認を行なっています。
JsTemplateはGoogleが開発したJavaScript製のテンプレートエンジンです。 Webアプリケーションがさらに開発されていくために必要なのが高機能なJavaScriptテンプレートエンジンの存在です。幾つか出てきていますが今回紹介するのはかなり有力です。なぜならGoogleが開発したテンプレートエンジンだからです。それがJsTemplateです。 デモです。左上がテンプレート、右上がJSONの元データになります。 そして左下が実際に生成されたHTMLで、右下がレンダリング結果になります。 idを使ってテンプレート名を定義しています。 こういう風にデータがない場合のチェックもできます。 実際のコードです。jsdisplayのところに検証が入っているのが分かります。 データがある場合はもちろん繰り返し表示します。 実際のコードです。 JsTemplateは再帰処理ができたりev
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く