大づかみなお話です 結論: 課題を知ったらなんでもいいから手を出してみよう！ （細かいところは犠牲にしてます。React でもステートフルコンポーネントつくれるよねとか）
JSフレームワーク選定の勘所
大づかみなお話です 結論: 課題を知ったらなんでもいいから手を出してみよう！ （細かいところは犠牲にしてます。React でもステートフルコンポーネントつくれるよねとか）
出来る限り短く説明するReactJS入門 - Qiita
VTeacher 所属の Masaki Suzuki です。 ※各項目をできるだけ3行以内にまとめています デザイナーさんやフロントのエンジニアさん向けのReact.js（リアクトジェーエス）入門です。 「最近、『リアクト』と聞くけど、つまり何？」ってひとが対象です。 React.jsとは React.jsはUIのパーツ（構成部品）を作るためのライブラリです。 FacebookがOSSとして公開しています。 初回投稿日：2015年06月21日 この投稿はReactが話題になり始めた頃（6年前のv0.1の頃）、整理した記事です。 最新情報はこちら React Server Components 2021年からReactを始めるなら React Server Components 一択ではないか？ https://zenn.dev/rgbkids/articles/e58ef9b947b199
phiary
phi I'm a Game Programmer and Frontend Engineer passionate about programming education. Math / C / C++ / C# / JavaScript / HTML5 / CSS3 / Python phina.js とは？ phina.js(フィナ ドット ジェイ・エス) は, JavaScript で作られた国産のゲームライブラリです. プログラミング初心者でも始めやすく, それでいて上級者のハイレベルな要求にも 応えられる, 柔軟な設計と豊富な機能を備えています. 使い方はカンタン! あなたの HTML ファイルに <script> タグで phina.js を読み込むだけ でで導入でき, あとは公式サイトで提示しているサンプルコードをベースに, あなたがやりたいことを追加していくだけです. p
Toho like shooting with JavaScript
How to play Cursor key: move / character select Z: shot / ok X: bomb / cancel Shift: slow Space: character change(for debug) Y: viewpoint change Turn your hardware acceleration on to fully enjoy this game. See "chrome://gpu" and "chrome://flags" on your chrome to check if your hardware acceleration is enabled. Thanks for all the images and musics. SE, etc http://www.danmakufu.net/?%E5%88%B6%E4%BD%
超簡単に3DCGできるJavaScriptライブラリ作った - aike’s blog
ブラウザでWebGLが使えるようになって3DCGプログラミングはずいぶん身近なものになりました。と書いてるそばから違和感を感じるくらい生のWebGLをJavaScriptで書くのは敷居が高かったりします。できなくはないけど前提となる知識がかなり必要な感じ。 three.jsが登場したときは、これで普通に3DCGができるということで一気にひろまりました。とはいえ、それでもまだやることは多く、画面に四角い箱を表示する場合以下のようなプログラムを書くことになります。 ・シーンを作成 ・ライトを作成、位置と向きを設定、シーンに追加 ・カメラを作成、位置と向きを設定、シーンに追加 ・マテリアルを作成、色を指定 ・BoxGeometryを作成、サイズを指定 ・メッシュを作成、位置と向きを設定、シーンに追加 ・レンダラーを作成 ・レンダリングループ処理 これらのひとつでも間違えたりパラメーターが適切でな
簡単アニメーション！Pixi.jsを触ってみる！（1）テキストを動かしてみる - Qiita
簡単アニメーション！Pixi.jsを触ってみる！ 〜（1）テキストを動かしてみる〜 突然ですが、 Pixi.js を触ってみることにしました。 （前フリ無しw） Pixi.jsとは? Pixi.jsは、Goodboy Digital社が配布している2D描画用のjavascriptライブラリです。 下記サイトで配布されています。 MITライセンスに基づくオープンソースソフトウエアとして開発が進められています。 このライブラリを使って作ったアニメーションは、WebGLを自動的に使ってくれるようです。 （非対応のデバイスではCanvasを使う）。 難しそうなWebGLを覚えなくて使えるのはうれしいです。 pixi.jsのexampleページでデモが紹介されていますので、いくつか見てみましょう。(スクリーンショット画像クリックで本家pixijs.comサイトのexampleページに飛びます) Ex
Three.js で作る 3D 年賀状 - コードレシピ
準備するもの 今回必要なものは以下のようになります。 three.js r69 立体ドット絵 つくっていくもの 今回のレシピで作っていくファイルは以下のようになります。 index.html index.js index.html を作る index.html を以下のように記述してください。 <!DOCTYPE html> <meta charset="utf-8"> <title>Happy New Year 2015</title> <!-- three.min.js --> <script src="http://threejs.org/build/three.min.js"></script> <script src="index.js"></script> index.js を書いていく 雛形コピーした後、dataSet ～ の箇所に、ドット絵を描いていきます。 "×" は色無
人気上昇中のJavaScriptライブラリを調べてみた【2015年版】
altJSの人気が混戦で面白い！ 2014年中に人気が急上昇してきており、「2015年では必須の知識」となりそうなJavaScriptライブラリをランキング形式で発表。 ← 前回 連載 INDEX 次回 → こちらのページで【2016年版】も発表！ ■ 2015年が始まり、心機一転で「今年こそはWeb開発を頑張ろう」と思っている人も少なくないだろう。そんな方々に向けて本稿では、2014年中に人気が急上昇してきており、「2015年では必須の知識」となりそうなJavaScriptライブラリをランキング形式で発表する（※昨年の2014年版はこちら）。 なお、本稿のランキング決定では、検索キーワードの流行を調査可能な「Googleトレンド」（「すべての国」「過去 12 か月間」「すべてのカテゴリ」「ウェブ検索」という条件で絞り込み）を使って、ライブラリの人気をジャンルごとに比較した（※ライブラリ名
10年間JavaScriptをコピペしていた僕がJavaScript本格入門して知った驚愕のJavaScript言語仕様覚書 | niwatako$
JavaScriptをなめていた私が勉強しなおした結果、色々驚愕の事実が発覚したお話。JavaScriptをご存じの方には当然の内容かもしれません。 むかしむかし 私にとってJavaScriptといえば、高校生時代(10 […]
最近の行儀のよい JavaScript の書き方 - Qiita
JavaScriptは移り変わりの早い言語です。 もう1年以上経っていますし、記事のメンテもちゃんとできていないので、消し線を入れることにしました。 参考程度のために記事は一応残しますが、より新しい情報を読まれることをお勧めいたします。 はじめに --- 最近では JavaScript の実行環境はブラウザに限りません。（node.js, Web Workers） また、旧来のような <script> 経由でのロードもとうに古くなっています。今は CommonJS スタイルで、require を用いたモジュールのロードを行なうことがより良いとされています。 ですから、次のようなことは改める必要があります。 - var YourModule = {}; などとして、外部から YourModule.hoge(); などと呼び出す書き方 - this === window だと思うこと 今回は、
tmlib.jsでゲームをつくってみよう！ - Qiita
はじめに 最近、tmlibを使う機会が多いため 簡単なゲームでtmlibのチュートリアル的なものを書いてみようかと思います。 技術ブログ的なことは初めて書くので、見づらいかもです… とりあえず、プログラミングでサンプルが多いブロック崩しを作成！ ちなみに、画像は一切使用せず、図形だけでつくります。 1.どこに書こう プログラムソースとかサーバーに置くの面倒なので、 とりあえず、runStantで書いていきます! runStant tmlib.js の公式エディタツール！ 書いたコードがすぐに実行されるので、 tmlibやhtml5、javascript等をさくっと実行するのに便利。 さらに、書いた内容はＵＲＬで保存できるので、ブックマーク等を使用して いつでも続きから書ける。 runStantはこちら 2.tmlibの準備 最初にrunStantのページへアクセスすると、 下の画像のように
[tmlib.js] tmlib.js でゲームプログラミング始めませんか？ - Qiita
個人的にずっと作ってるゲームライブラリ tmlib.js の紹介です! tmlib.js Advent Calendar 2014 初日の予定だったのにこのタイミングになってしまいすみませんmm ※『国民全員プログラマ化』計画進行中 tmlib.js ってなに？ まずはトップページを見てください. なんとなく分かりますかね？w てかそもそもなんて読むの？って話ですよね. 『てぃーえむ りぶ ドット じぇいえす』と読みます. ざっくり言うと tmlib.js は phiのphiによるphiのためのオレオレライブラリ アイディアを即座に形にできるライブラリ です!! tmlib.js ってどんなことできんの？ グラフィックス描いたり ゲーム作ったり ツール作ったり 具体的にはどんなよ？ 具体的な機能としては コア機能の拡張 (最近 high.js に分離しました) クラス定義, ネームスペース
![[tmlib.js] tmlib.js でゲームプログラミング始めませんか？ - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/bc6e1888c2246c85a7afff25459e644e43b532bd/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Fadvent-calendar-ogp-background-7940cd1c8db80a7ec40711d90f43539e.jpg%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCdG1saWIuanMlNUQlMjB0bWxpYi5qcyUyMCVFMyU4MSVBNyVFMyU4MiVCMiVFMyU4MyVCQyVFMyU4MyVBMCVFMyU4MyU5NyVFMyU4MyVBRCVFMyU4MiVCMCVFMyU4MyVBOSVFMyU4MyU5RiVFMyU4MyVCMyVFMyU4MiVCMCVFNSVBNyU4QiVFMyU4MiU4MSVFMyU4MSVCRSVFMyU4MSU5QiVFMyU4MiU5MyVFMyU4MSU4QiVFRiVCQyU5RiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzM0EzQzNDJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9YzhmYjNlMWQ3MmFjNTc1NWE1NTI5MTFiOGJjYzNkNWU%26mark-x%3D120%26mark-y%3D96%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9OTcyJnR4dD0lNDBwaGkmdHh0LWNvbG9yPSUyMzNBM0MzQyZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPWU5MjJlZTNlZmFhNWFhMzg5OWQ0YmI0OTRjNmY0Mzc1%26blend-x%3D120%26blend-y%3D500%26blend-mode%3Dnormal%26s%3D7e6ceaf428471c6d050907c09f1faba8)
Home | tmlib.js
tmlib.js って何？ ゲームやツールを簡単に作る事ができる JavaScript ライブラリだよ♪ PC とスマートフォンどちらでも動くんだ 『プログラミングって気軽にできるもんなんだ』 『ゲームってこんなに簡単に作れるんだ』 って感じてもらえると嬉しいな かんたんに使えるよ♪ tmlib.js は初心者から上級者まで 幅広く使えるライブラリだよ Usage を見ればすぐに tmlib.js を 使ってプログラミングを始められるよ
50行で作る、HTML5+JavaScriptな簡単ライフゲーム【プログラミング】 - あのねノート。
2013-09-14 50行で作る、HTML5+JavaScriptな簡単ライフゲーム【プログラミング】 やり方 はじめに。 ライフゲームを知っていますか？ライフゲームは世界でとっても有名なシュミレーションゲームです。Wikipediaによると、 1970年にイギリスの数学者ジョン・ホートン・コンウェイ (John Horton Conway) が考案した生命の誕生、進化、淘汰などのプロセスを簡易的なモデルで再現したシミュレーションゲームである。 らしいです。 眺めているだけでもさまざまなパターンを観測することができてとても興味深く、魅力的なゲームです。 見つけだすのに賞金も賭けられたという「グライダー銃」というパターンは特に有名ですね。 もっとライフゲームについて詳しく復習したい方は秀逸なWikipediaのページを見ることを薦めます。 ライフゲーム - Wikipedia また、ライフ
弾幕シューティングが簡単に作れちゃう!! tmlib.js x BulletML を使ってみよう | TM Life
.@daishi さんが tmlib.js でサクっと BulletML を使えるようにしてくれていたので, 使ってみました!! ん～超良い感じ～♪ 用意したサンプルは jsdo.it で作ってあるので, fork して パラメータをイジってもらえれば色々と遊べると思います. Sample Demo Table of contents tmlib.js とは？ BulletML とは？ tmlib.js x BulletML を使ったサンプル tmlib.js x BulletML で作られたゲーム tmilb.js とは？ そもそも tmlib.js って何って方のために軽く紹介. 簡単に言うとゲームやツールを簡単に作るための JavaScript ライブラリです. 詳しくは下記のリンクにて tmlib.js とは 以前, 勉強会で発表させていただいたスライドです. GitHub tml
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
React
PixiJS v4
three.js - JavaScript 3D library
TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function
Playermove.js - Pastebin.com