スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtml、css、javascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon
今年も早いもので、残すところ半分となりましたね！今回は2012年の上半期までで色々なプログラミング学習サービスを徹底的にまとめてみました。今回の記事で今リリースされているものはほとんど網羅されていると思います。 今回の記事は特にプログラミング初心者〜中級者に役立つサービスまとめ記事だと思います。去年の暮れに書いたプログラミング学習サービスまとめがおかげさまではてぶホットエントリーに入るなど、プログラミング学習への注目度の高さを実感しているところです。特にスタートアップの世界では、もう文系だからとかエンジニアじゃないからと言ってプログラミングの知識ゼロで許される時代でもなくなってきていますしね。色々なサービスがありますが、ご自身の学ぶ目的やレベルに合わせて活用してください！ プログラミング学習サービスまとめ 1.メールを使ってコーディング学習できるCodecademy 料金：無料 言語：Ja
話題沸騰の「Meteor」とは 4月に公開された新しいWebアプリケーションプラットフォーム「Meteor」が話題だ。 MeteorはJavaScript/HTML/CSSによるWebアプリケーションを開発するためのフレームワークとパッケージマネージャー、実行環境などがセットになったプラットフォームである。Node.jsが基盤として採用されているため、サーバ／クライアントともにJavaScriptで記述することが可能で、データベースシステムとしてはMongoDBを備えている。 Meteorの最大の特徴は、開発のリアルタイム性を極めて高いレベルで実現している点だ。クライアント側でコードに変更を加えたら、即座にそれがクラウド上に展開されたアプリケーションに反映される。そして書き換えられたページは即座にWebブラウザにPush配信されるため、ページを更新するためにリロードボタンを押す必要すらない
アドビがオープンソースとして公開している「Brackets」は、HTML5とJavaScriptで作られたHTMLエディタです。アドビ自身はBracketsについてブログやプレスリリースでのアナウンスは何もしておらず、Github上にAdobeのコードとしてひっそりと公開されています。 アドビには統合的なWeb開発環境として確固たる地位を持つDreamweaverがありますが、Bracketsの画面を見るかぎり、目指すものはDreamweaverを置き換えるようなものではなく、もっと直感的で軽くシンプルなHTML/CSS/JavaScriptエディタを実現しようとしているように見えます。 Bracketsはまだ開発が始まったばかりで、それほど多くの機能が実装されているわけではありません（実際に起動してみましたが、短時間では使い方もよく分かりませんでしたし……）。今後もう少し機能が追加されて
「Meteor」は、JavaScript/HTMLで開発するリアルタイムWebアプリケーション基盤。何が起きているのかすぐに分からないほどすごい 「Meteor」は、Webアプリケーションを開発するためのフレームワークと実行環境を提供しています。アプリケーションはすべてJavaScript、HTML、CSSで記述できるため、サーバ側でRubyやPerlやJavaなどのプログラミングをする必要はありません。 TechCrunchの記事では、JavaScript/HTML/CSSだけでWebアプリケーションが開発できる点にフォーカスが当たり話題になりましたが、公開されたデモンストレーションのスクリーンキャストを見たところ、Meteorにはそれ以上に新しい仕掛けが盛り込まれていました（スクリーンキャストはこの記事の末尾に埋め込んであります）。 それは「リアルタイムなWebアプリケーションを構築す
ビューワーにはHTMLとJavaScriptしか使わないというウェブブラウザから利用できる「ScreenLeap」という画面共有サービスを試してみました。 まず、自分が共有させる側になってみます。 トップページから「Share your screen now」をクリックします。 見る側（ビューワー）はHTMLとJavaScriptだけで良いみたいですが、共有させる側はJavaのインストールが必要です。 共有が開始するとこのような画面になります。共有したい相手にはURLを送るか「ScreenLeap」のサイトで入力する3桁 x 3つの数字を伝えます。 ポップアップウィンドウが開き、共有する範囲、共有の休止・終了、何人が閲覧しているか、ということが分かります。 例えば、あるアプリケーションソフトのウィンドウだけを共有する、ということが可能になりますね。 自分が見る側に回るとこんな感じです。 画
ライトマップのデモはこちらで試せます。 キューブを表示するだけならHTMLも含めて、これだけの記述でプログラム可能みたいです。 <!DOCTYPE html> <html><body> <script src="lightgl.js"></script> <script> var angle = 0; var gl = GL.create(); var mesh = GL.Mesh.cube(); var shader = new GL.Shader('\ void main() {\ gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex;\ }\ ', '\ void main() {\ gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);\ }\ '); gl.onupdate = function(s
「バロック」「キングオブワンズ」「ぷよぷよ」「トレジャーハンターG」「魔導物語」等のゲームを監督/脚本/企画した米光一成のSite 立命館大学のインタラクションデザイン企画実習で講義中に話題に出しいる「Processing」「openFrameworks」等についてさくっと解説。 （2008年8月14日：以後随時追記2015年2月12日追記） Processingである。以前から凄いという噂は聞いていて、次の画像を観て、わーすげぇと思っていた。 音と連動した映像を生成するのにProcessingを使っているもの。 Magnetic Ink, Process video from flight404 on Vimeo 立命館大学で「使ってみたけど凄いすよ」と興奮しながら教えてくれた学生がいて、90分授業で、学生が先生になり、先生が学生になって「Processing入門講座」をやってもらった。
芸術の秋にProcessingでスケッチプログラミングを始めてみよう：絵心がなくても簡単に絵が描けるProcessing（1）（1/3 ページ） アートやデザインのための“プログラミング” 読者の皆さんは「プログラミング」という用語や、それをすることに、どんなイメージを持っているでしょうか。仕事に使われるアプリケーションやWebサービスの開発の世界の「プログラミング」を考えてみると、多くの場合「実用性や効率が重んじられ、専門的な知識を持ったエンジニア／プログラマーが慎重に正確に行うもの」といったイメージではないかと思います。 しかし一方で、実用性ではなくスクリーンに表されるイメージや動きの美しさ、見るものを引き込むインタラクションのアイデアをプレゼンテーションする「プログラミング」の世界も存在します。エンジニアではなくアーティストやデザイナーが、驚きやインスピレーションを求めて大胆に「プロ
はじめに 今日、 jQuery の作者として有名な John Resig さんが Processing.js という JavaScript のライブラリを公開しました。 John Resig - Processing.js このライブラリを使うと、比較的簡単に以下のようなグラフィックスやアニメーションを書くことができるようになります。 というわけで、公開されたばかりのこのライブラリを簡単な使い方から詳しい使い方までとことん掘り下げてみたいと思います。 Processing.js 概要 まず、 Processing.js とは何かという話をします。 Processing.js とは、ブラウザで Processing というプログラミング言語を実行する JavaScript のライブラリです。 では、 Processing とはどのようなプログラミング言語なのでしょうか。 Processing
TENTOはオンライン授業を中心とした、子ども向けプログラミング教室です。TENTOでの学習は、プログラミング業務経験者や、ソフトウェアの研究や開発に携わる大学生・大学院生がサポート。開発現場を知り、開発技術を熟知しているからこそ、より現実に沿った、活きたプログラミングの知識を獲得できます。
World Wide Web Consortium（W3C）は、中央管理されたサーバを介する必要なく、ブラウザ間で直接PtoP通信できるようにするための規格を策定する予定である。 規格の策定を担当するW3C作業部会のメンバーらによると、このような規格が策定されれば、政府がウェブ通信に対して抑圧的な措置をとることが困難になる可能性があるという。W3Cは英国時間5月5日、同作業部会は、音声、ビデオ、および「補助的な」リアルタイム通信によってブラウザが通信できるようにするAPIの定義を目指すと述べた。 「W3Cは5日、ウェブブラウザ間のリアルタイム通信を可能とするために、クライアントサイドのAPIを定義することを目的としたWeb Real-Time Communications Working Groupを新たに設立した」とW3Cは述べた。 このAPIにより、他に何かをダウンロードしたりプラグイ
Skypeにとって要注意のニュースが飛び込んできた。音声およびビデオチャットのソフトウェアをオープンソースプロジェクト「WebRTC」として公開したばかりのGoogleが、この技術をブラウザの「Chrome」に組み込もうとしている。 Googleは2010年にインターネット電話やビデオカンファレンスを専門に取り扱うGlobal IP Solutions（GIPS）を買収し、リアルタイムチャットソフトウェアを入手した。 WebRTCプロジェクトで特に大きな恩恵を受けるのは「Gmail」だ。現在のGmailでは、音声およびビデオコミュニケーション機能を利用する際、プロプライエタリのプラグインが必要なためだ。Gmailのチャット機能は、GoogleのVoIP（Voice Over IP）への取り組みが成熟し、「Google Voice」と統合するにあたってより重要性を増すことになる。 しかしGo
Google Chrome runs web pages and applications with lightning speed. WebRTC実装のChromeへのマージが開始されたことが報告された。WebRTCはJavaScriptおよびHTML5技術でリアルタイムコミュニケーションアプリケーション(いわゆるインスタントメッセンジャー)の開発を可能にするためのオープンソースプロジェクト。テキストのみならず、音声や動画などを使ったリアルタイムコミュニケーションをJavaScript APIとHTML5のみで利用できるようにすることを目指している。 GoogleはChromeにWebRTCの機能を取り込むことを発表。まだマージは始まったばかりで、これから実際に利用できる状況まで仕上げていくことになる。Googleは自社のGmailにおいてインスタントメッセージング機能を提供している。W
Aug 09, 2010 ふと思い立ったので、最近盛り上がりつつあるnode.jsをMac OS Xに入れて遊んでみます。大学の卒論（最終的に論文とよべるようなものにはならなかったんですが、それはさておき）のために数カ月ほどJavaScriptをちみちみ書いていた時期があったんですが、それ以来、JavaScriptは結構お気に入りだったりします。node.jsを使えばJavaScriptでサーバーサイド側のプログラムも書けるので、これはもう試してみるしかないなと。 というわけで早速node.jsをインストールします。今回インストールする環境はMac OS X 10.6.4にXcodeをいれたもので、標準的な環境だと思います。MacPortsのnode.jsを使えば簡単にインストールもできるのですが、ちょっとバージョンが古かったので、現時点の最新版である v0.1.103 を自前でコンパイル
昨日に引き続き、いざ！part2なのだ。 前回では node.js と v8 の結びつきまでを書いたので、今日は Non-Blocking I/O の話を。 Non-Blocking I/O という言葉からブロックしない I/O をイメージするのはたやすい。でもこれを実現しようとなるといろいろとまあ面倒くさいんだよね。 それを解決する常套手段で言うとファイルディスクリプタ（ネットワークならソケットだね）を開いてそれをselectシステムコールの監視対象に加えておき、selectを呼び出すことで監視するっていう方法がある。こうすると何が嬉しいのかファイルディスクリプタが２つある場合で考えてみよう。 まずAとBというファイルディスクリプタを監視対象とする。 selectシステムコールを呼び出し、そのどちらかが読み出し準備完了となっていないかを確認する。 もしどっちも準備できていなかったらプロセ
期せずして久々の更新になってしまった。ブログを書く気がなくなったとかそういうのではなくてただ単に忙しかっただけ。その間、まぁ仕事が予期せぬ方向から炎上してみたり、事故をもらって愛車が全損したり（フロントガラスが全面熱線入りなんていう変なオプションなどを諸々付けていたからお気に入りだったのに）と決して良いことばかりで忙しかったわけではないけどね！ で、今回は node.js のお話。異様な盛り上がりを見せているものの、じゃぁそれっていったい何かというと「JavaScriptを用いたNon-blocking I/O環境」という非常にシンプルなものだ。 その根底には「うまくスケールできること」と「動作が速いこと」という理念が見受けられる。 まず「うまくスケールできること（多量のアクセスを捌けること）」を解決するにあたり、まずはスレッドモデルか、イベントループかという問題があった。そこで auth
ご挨拶 こんにちは、ロンドンのNew Bambooという会社でWebエンジニアとして働いている@makoto_inoueです。ここのところ、PusherというWebSocketのクラウドサービスの開発に関わっています。今回から3回に渡ってWebSocketに関する短期連載を担当させていただきます。 私を含めたNew Bambooの面々（我々は自分たちのことをBambinoと呼んでいます）がWebSocketになぜ興味を持ったかということからはじまり、実際にクラウドサービスを始めるまでにいたったストーリーをお話ししたいと思います。そのストーリーを通じて、WebSocketが切り開く「リアルタイムWeb」な世界への可能性や技術的課題を皆さんと共有できればと思っています。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
