サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
Electron（旧Atom-Shell）とは、Web開発者がHTML5とNode.jsでMac、Windows、Linuxのデスクトップアプリを作れるクロスプラットフォーム実行環境です。Electronはオープンソースで無料で使える上に、MITライセンスであるため、商用利用も可能です。開発元はGitHub社です。 最近はJavaScript、HTML5の進化によって、多機能なWebアプリケーションが増えてきました。それに伴い、モバイルでは、WebViewやApache Cordovaなどを使ったハイブリッドアプリも注目されています。Electronはその流れの中から生まれた新しい実行環境です。 ElectronはChromiumブラウザを内蔵しているのが一番の特徴です。Chromiumブラウザは、Google製のChromeブラウザのオープンソース版にあたります。ウェブ開発者がChrom
curl を使って WebAPI をテストする(1) 2014/6/30 2015/1/29Linux, UNIX一般, Web 例えばスマートフォンアプリを開発していて、データをサーバに保存しないといけない時など、WebAPIを使った開発をする機会だけでなく、WebAPIそのものを開発する機会が増えて来ていると思います。 WebAPIのサーバサイドプログラムを開発する時、WebAPIを単体テスト出来るツールを持っていると便利です。クライアント側の開発を待たなくてもサーバ側の開発が進められますし、トラブルが起こった時にサーバ側とクライアント側で問題を切り分けるのにも役立ちます。 今回は WebAPIのテストに使えるツールとして、curlの解説をします。Mac OS X やLinux であれば標準でインストールされてされていますし、公式サイトではWindows用のバイナリも
不特定のユーザーが入力したMarkdownをブラウザ上でJavaScriptを使ってHTMLに変換するという場面においては、JavaScriptで変換してHTMLを生成するという処理の都合上どうしてもDOM-based XSSの発生を考えないわけにはいかない。かといって、MarkdownをパースしHTMLを生成するという処理すべてをXSSが存在しないように注意しながら自分で書くのも大変だし、markedやmarkdown-jsなどの既存の変換用のJSを持ってきてもそれらがXSSしないかを確認するのは結構大変だったりする。 そういった場合には、Markdownから生成されたHTMLをRickDOMを通すことで、万が一HTML内にJavaScriptが含まれていたとしてもそれらを除外し、許可された要素、許可された属性だけで構築された安全なHTMLに再構築することができる。さらに、そうやって生成
Base64 大好きです。 どんなデータでもHTMLに埋め込んでしまえるBase64愛してます。 画像をBase64にしたいな。 色々と方法はあるけれど、今回はCanvasでやろうと思いました。 base64にするには Image を作成 img srcに Image突っ込んでロードさせる img がロード完了されるイベント待ち canvas要素作成 canvasを2dで扱うcontext取り出し img の中身をCanvasに転送（コピー）textarea を作成 canvasの中身をBase64にするtextareaの中にbase64を書き込み こんなかんじで、Base64を作ることが出来ます。 <!DOCTYPEhtml> <html> <head> <title></title> <style> body{ } </style> <script type="text/java
Written by defghi1977@xboxLIVE.この文書は全てテキストエディタで作成しています．えーと，そりゃもうゴリゴリと．本文書はsvg要素の基本的な使い方まとめの姉妹版として作成を開始した．canvas要素の仕様は現在進行中で色々と変化しているため，一筋縄で行かないが大方のapiについて書き上がったので公開する．なお，まだ使えない機能等満載だったり，内容に間違いがあっても中々検証することができないので，その部分を了承した上でご利用下さい… 更新履歴 2012/07/18 初版 1・canvas要素の概観 canvas要素とは canvas要素はhtml5で採用されたwebブラウザ上でグラフィックを描画するための機構であり，webページの機能性・視認性が重要視される昨今では，svg要素と並び重要な役割を果たしている．もともとapple社が自社製osの機能向上策として，同
Webアプリのデバッグやチューニングに役立つ、Chrome Developer Toolsの主要機能を、スクリーンキャプチャ中心で簡潔に紹介。2014年10月に最新情報に改訂。 モダンブラウザーの中でGoogleChromeは最後発ながら、その機能の潤沢さ、便利さ、高速さからシェアを大きく伸ばしている。そして、今やほとんどのブラウザーではWindowsの場合F12キーを押すことで（Macの場合はCommand＋Option＋Iキーで）手軽に各ブラウザー搭載のデベロッパーツールを利用できるが、特にChromeのデベロッパーツールは、非常に機能が豊富なため、利用している人もかなり多い。本稿では筆者がよく使う機能や、使うと便利な機能を中心に、Chromeのデベロッパーツールについて紹介していく。なお、本書は執筆時点で、最新のChrome 38を使用している。 機能ふかん 残念ながら、Chro
あまりにも世情にうといので作った。NHKのRSSを定期的にチェックして、新着ニュースの動画を連続自動再生する。 とてもテレビっぽい。おかげで4日後にオリンピックが開催されるという事を知れた。 ソースコード https://github.com/shokai/nhk-news-appzipでダウンロード https://github.com/shokai/nhk-news-app/releases node-webkitはネイティブアプリ作成のためにwebkitが改造されたwebブラウザで、HTML/JavaScript/CSSが実行できるだけでなくnode.jsのAPIもそのまま呼び出せる。 つまりjQueryでDOM操作すると同時にnodeのライブラリを使うような処理が、同じプログラムファイルにまとめて書ける。変にブリッジを書く事なくいつものnodeのように require(‘モジュ
node = Nokogiri::XML::Node.new('name', document) # initialize a new node node = document.create_element('name') # shortcut node.document node.name # alias of node.node_name node.name= # alias of node.node_name= node.read_only? node.blank? # Type of Node node.type # alias of node.node_type node.cdata? # type == CDATA_SECTION_NODE node.comment? # type == COMMENT_NODE node.element? # type == ELEMENT_
Flash なしでも HTML5 でここまで出来る［SublimeVideo –HTML5 Video Player］ John Gruber が HTML5 ビデオプレーヤについてたいへん興味深いコメントをしている。Flash がなくてもここまで出来るというのだ。 Daring Fireball: “SublimeVideo ―HTML5 Video Player” by John Gruber: 01 February 2010 ＊ ＊ ＊ まちがいなくホンモノだ これはスゴい！Jilion が製作したHTML5 ビデオプレーヤは、再生コントロールがすばらしい。プレイボタンを押すと自動的にバッファリングが始まる。ウインドウいっぱいのアニメーションの動きはすばらしい、などなど。Safari、MobileSafari、Chrome でスムーズに動く。Firefox については目下作業中。それに WebKit Nig
1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
