JavaScript 入門 基礎編 | TM Life

2012/04/13 1098 users JavaScript 基礎編 スタンス プログラミング 入門

JavaScript の基礎的な部分についての入門記事を書きました. JavaScript はメモ帳とブラウザさえあれば開発できるのでPCさえあればすぐに始められます. 基本多くは語らないスタンスですが, すべて実際に作っていく流れをキャプチャリングした動画があるので, プログラミングって何？って人はぜひ見ながら触ってみてください. DEMO and DATA JavaScript 入門で制作した... 続きを読む

新入生・新入社員にオススメのプログラミング参考書 64 冊 | TM Life

2012/04/02 795 users 新入社員 新入生 ゲームプログラミング プログラミング 職業柄

今日は 4月2日 ということで入学式だったり, 初出勤て人もいるのではないでしょうか？ ってことで新入生・新入社員にオススメのプログラミング参考書を 64 冊ほど紹介したいと思います. 職業柄, 業務系よりゲームプログラミング寄りです. 私は参考書が読むのが趣味だったりするので, これからプログラミングを学ぶ学生さんや新社会人の方にオススメの 本を抜粋してみました. なので紹介する本は全て私が学生... 続きを読む

CSS3 の box-sizing が便利すぎる!! padding や border に依存しない width, height 指定 | TM Life

2012/09/25 638 users padding border box-sizing CSS3

今回は CSS3 から box-sizing について紹介します. width や height と同時に border や padding を指定しているときに, 少し値を変えただけで意図しない表示になったりレイアウトが崩れたという経験はありませんか？ これはボックスサイズの算出方法が複雑なのが原因です. そんな面倒な問題を解決してくれるのが box-sizing プロパティです!! box-s... 続きを読む

HTML5 マークアップ入門 | TM Life

2012/05/22 540 users HTML5 fullscreen fork イジ エントリー

昔書いた HTML5 に関するエントリー 『HTML5 でコーディングしてみよう!』 のサンプルを jsdo.it に移植したので改めて解説します. fullscreen 用に作ってあります. fork して色々イジって遊んでください. Step by Step で HTML5 や CSS3 を学びたい方は過去に書いた『HTML5 と CSS3 で Web 制作』をどうぞ. Demo Downlo... 続きを読む

enchant.js 怒涛の 100 tips | TM Life

2012/03/16 507 users Tips 怒涛 fork enchant.js スイマセン

enchant.js 怒涛の 100 tips!! ローカル整理してたら昔勉強がてら作った enchant.js のサンプルが大量に出てきたので, 整理がてらざっくり公開しようと思います. 最終的に整理してたら 100超えちゃったけどw 参考になれば幸いです. 全て jsdo.it に移植したので, fork なりダウンロードなりして遊んでくださいな♪ ※スイマセン, まだ下の方の 40個ぐらいは... 続きを読む

CoffeeScript 入門! 怒濤の 100 サンプル!! | TM Life

2012/04/25 388 users CoffeeScript 怒濤 ティーエム 入門 サンプル

TM Life!!(ティーエム ライフ) 「Time is money」をモットーとしたサイトです。主にプログラミングについて描いています。 HOME ABOUT TMLib 今まで CoffeeScript についてのエントリーを連投してきましたが とりあえずこのエントリーで一区切りつけようと思います. ちなみに今までに書いた CoffeeScript についてのエントリーはこんな感じです. n... 続きを読む

オシャレなスライドショーを簡単に作れちゃう reveal.js の使い方を reveal.js を使って解説してみた. | TM Life

2012/01/12 320 users reveal.js Downlo スライドショー プレゼン

昨日, コリスさんの記事で紹介されていた reveal.js に一目惚れしてしまったので使い方をまとめてみました. reveal.js の使い方を reveal.js を使って解説しています. 簡単にオシャレでシンプルなプレゼンを作れるのでぜひ遊んでみてください. Sample reveal.js を解説しているサンプルはこちらです. また, 最小サンプルも作ってみました.(こちら) Downlo... 続きを読む

HTML のタグを一度覚えたら一生忘れないようにするためのコツ | TM Life

2012/10/09 149 users HTML 一生 コツ タグ table

IT の世界は, よく省略名が使われます. そもそも IT ってのが Information Tecnorogy の略ですしねw HTML(HyperText Markup Language) も例外ではありません. HTML で使われるタグは, ほぼ省略形で記述します. 例えばテーブル. テーブル系の要素は table, tr, th, td ってのがありますね. これらの要素を単純にそのまま覚... 続きを読む

tmlib.js ゲームプログラミングチュートリアル – 今流行のフラットデザインを使ったタッチゲームを作ろう | TM Life

2013/06/14 118 users tmlib.js チュート enchant.js 知名度 流行

先日, @omatoro さんが『私がenchant.jsではなくtmlib.jsでゲームを作る5つの理由』というエントリーを 公開されました. これがすごい反響だったらしく, 私の方にも様々な意見や質問がきました. おかげで tmlib.js の知名度が一気に上がり実際に触ってくれてる人も増えました. 本当にありがとうございます. ただ, ここで一つ問題が… tmlib.js には公式のチュート... 続きを読む

JavaScript の比較演算子 == と === の違い | TM Life

2012/08/19 118 users 比較演算子 JavaScript fork 蛇足 Java

JavaScript における比較演算子 == と === の使い分けって, C や Java といった他の言語にはない仕組みなので意外と戸惑う人もいるみたいですね. 今回はその違いについてまとめました. jsdo.it で作ったサンプルもあります. 良かったら fork して遊んでくださいな♪ Table of contents 等価演算子と厳密等価演算子 どっちを使うべき？ 蛇足: Coffe... 続きを読む

本日, JavaScript ライブラリ 『tmlib.js』と 10 個のサンプルを公開しました. | TM Life

2012/06/06 88 users tmlib.js jsx tmlib 一石 ライブラリ

最近, JSX やら enchant.js やら arctic.js やらで JavaScript 界隈はすごく盛り上がっています. そんな中, 私自身も一石を投じようと本日 JavaScript ライブラリ 『tmlib.js』を公開しました!! リニューアルって言った方が良いのかな？ 実際には, ２年前に作っていたライブラリ 『tmlib』 を大幅に改良したものになります. 私一人でコツコツと... 続きを読む

Webアプリとネイティブアプリの違いについてまとめてみた | TM Life

2012/07/27 87 users ネイティブアプリ Webアプリ

以前, 『新入生・新入社員にオススメのプログラミング参考書 64 冊』という記事で「これから iPhone アプリを作るなら Objective-C より JavaScript の方が良いよ♪」的なこと書いたら 結構色々言ってくる人がいたのでざっくりと両者の違いをまとめてみた. 両方の環境での開発経験による私自身の主観が十二分に混じってるので半信半疑で読んで頂けると助かります. 主な違いはこんな感... 続きを読む

「CSS3を使って美しく装飾されたテーブルの作り方｜Webpark」のサンプルを LESS で作ってみた | TM Life

2012/08/25 83 users less Webpark エントリー テーブル サンプル

昨日 に引き続き LESS 関連エントリーです. 「CSS3を使って美しく装飾されたテーブルの作り方｜Webpark」で紹介されていた, テーブルを CSS3 で装飾するサンプル. 非常に良く出来ていて見た目もコードもとてもキレイです. 今回は, このエントリーに触発されて, サンプルをパクってオマージュしてみました. ただパクったオマージュしたわけではなく LESS で作っていたり, 色々と私の... 続きを読む

JavaScript で IE アクセス時のみブルースクリーンで警告を表示する tm.destroyie6.js を作ってみた | TM Life

2012/09/29 70 users 警告 ブルースクリーン JavaScript Mic IE6

JavaScript で IE アクセス時のみブルースクリーンで警告を表示する tm.destroyie6.js を作ってみました. IE6 を一緒に撲滅しませんか？ このスクリプトを使えば簡単に IE6 でアクセスした時のみ下の画像のような警告を出し, 他のブラウザのインストールを促します. ちなみに, デザインは開発者用に配布された Windows 8 のブルースクリーンを真似てます. Mic... 続きを読む

3D ゲームも簡単に作れる! tmlib.js x three.js(WebGL) で 3D プログラミング出来るようにしてみた!! | TM Life

2013/01/21 67 users WebGL tmlib.js three.js 自前 ゲーム

私の方でずっと作っている JavaScript ライブラリ『tmlib.js(ティーエムリブ ジェイエス)』ですが, この度, 晴れて『three.js』と結ばれることとなりました. っとはいっても一方的にですけどねw tmlib.js は, 2Dゲームだったりツールを作る機能は揃っていましたが 3D に関する機能は今までありませんでした. WebGL をラップして自前で作ったりもしていたのですが... 続きを読む

JavaScript テストフレームワーク『Mocha』の使い方メモ | TM Life

2012/05/14 61 users mocha テストフレームワーク 筆頭 node.js 構築

Node.js６連投. 第５弾! Node.js もしくはブラウザ上で動く JavaScript テストフレームワーク『Mocha』の使い方について書きます. 最近, JavaScript による大規模開発も増えてきました. それに比例して重視されてくるのが, テスト環境の構築です. そこで, node.js のテストフレームワークの筆頭『Mocha』の使い方を 簡単にまとめましたのでよかったら参... 続きを読む

reveal.jsベースのプレゼンをWeb上で作れちゃうオンラインエディタ『rvl.io』の使い方をrvl.ioを使って解説してみた | TM Life

2013/01/14 56 users プレゼン rvl.io オンラインエディタ オンライ WEB上

なんか昨日, koba04さんの『「プログラミング未経験のタワレコ店員がエンジニアになって思ったこと」というスライドを書いてみた』というエントリーがキッカケで １年前に公開したエントリー『オシャレなスライドショーを簡単に作れちゃう reveal.js の使い方を reveal.js を使って解説してみた.』へのアクセス数が急上昇しました. これに便乗して, 今回は reveal.js の オンライ... 続きを読む

HTML5 と CSS3 で Web 制作 | TM Life

2012/05/22 54 users web CSS3 制作 HTML5 集大成

前々回は HTML5, 前回は CSS3 と来てまして, 今回はその集大成として Web 制作の流れをまとめてみました. こんな感じのができます. SAMPLE And DETA 実際に完成したサンプルはこちら. データはこちらからダウンロードできます. 指摘されそうな点…を自分で指摘 CSS3 を無理くり使いまくってる(面白いのでw) 画像を使っていない(のは個人的なこだわりです.) IE 対応... 続きを読む

車輪の再発明×jsdo.itのススメ. 色々なコードを tmlib.js で作りなおしてみた | TM Life

2013/01/15 52 users tmlib.js 車輪 jsdo.it プログラミング ススメ

jsdo.it にある色々なコードを勉強がてら tmlib.js で作りなおしてみました. せっかくなので作ったコードを紹介したいと思います. っとその前にプログラミングを学んでいる方向けに, 車輪の再発明×jsdo.it の良さについて軽く書きたいと思います. Table of contents 車輪の再発明って？ 車輪の再発明×jsdo.it サンプル Hexagon Phase 2 – tm... 続きを読む

gl.enchant.js 入門 – ざっくりと作る流れをまとめてみました!! | TM Life

2012/01/22 52 users 入門

ついに enchant.js の拡張プラグイン gl.enchant.js の β版が公開されました. これは内部的に WebGL を使っているので高速で豊かな 3D 表現が可能です. OpenGL や 3D プログラミングは仕事柄, 専門というか得意分野なので, ついにキターって感じです♪ さっそく使ってみて, ついでに簡単なプログラムを作る流れをまとめてみました. 以前書いてたくさんの方に見て... 続きを読む

CSS でテキストの縦揃えを上揃え, 中央揃え, 下揃えにする方法 | TM Life

2012/07/30 50 users CSS 中央揃え テキスト fork 備忘録

久々の備忘録!! CSS でテキストの縦揃えを変えるときによく使う方法を紹介します. Table of contents サンプル 上揃えにする方法 中央揃えにする方法 下揃えにする方法 ついでに横揃えも!! サンプル まずは実際に実行してみて下さい. 上, 中央, 下揃えそれぞれ適応させたサンプルです. jsdo.it で実装しています. fork して遊んでみて下さい. Demo Downlo... 続きを読む

npm と Node.js 上で require を使ったモジュール読み込みの仕組みについてメモ | TM Life

2012/05/08 50 users Hoge npm require モジュール node.js

Node.js で require でモジュールを読み込む際に引っかかった箇所があったのでメモしておきます. インストール済の hoge(仮)というモジュールを下記のようなコードで var hoge = require('hoge'); 読み込もうとしても Cannot find module 'hoge' というエラーが出てしまい読み込むことができないことがありました. そこで, モジュールをロ... 続きを読む

tmlib.js 怒濤の 100 サンプル!! – Graphics(HTML5 Canvas) 編 | TM Life

2012/11/22 49 users tmlib.js Graphics 怒濤 ハッカソンイベント

tmlib.js のハッカソンイベントをやることになりました!! っということでそれまでにバンバン tmlib.js のエントリーを投稿していこうと思います. 今回はその第一弾! Graphics(HTML5 Canvas) 編です. このサイトでお馴染みの怒濤シリーズ. tmlib.js の Graphics 周りの機能についてのサンプルを作りまくってみました. 怒濤って何？って方はこちらをどう... 続きを読む

CoffeeScript 入門 基礎編 – CoffeeScript と JavaScript を 10個のサンプルで比較してみた | TM Life

2012/04/13 48 users CoffeeScript jsdo.it 入門 エントリー

またまた前回に引き続き CoffeeScript についてのエントリーです. 今回は以前書いた『JavaScript 入門 基礎編』で作ったサンプル 10 個を CoffeeScript で作り直してみました. CoffeeScript 版も JavaScript 版も, 全て jsdo.it にアップしているので コードを見比べてみると面白いかもしれません. { } } }{ { { }{ } ... 続きを読む

TM Life

2011/05/07 48 users ティーエム JavaScrip Safari 9leap 開催

TM Life!!(ティーエム ライフ) 「Time is money」をモットーとしたサイトです。主にプログラミングについて描いています。 ※ このサイトはChrome, Safari もしくはFirefoxを推奨しています。 HTML5とCSS3を使用しているためInternet Explorerでは正しく表示されない可能性があります。 9leap の開催と共に流行っている JavaScrip... 続きを読む