JavaScriptを書かない2025年のモーダルの実装方法 – TAKLOG
2025年のモーダルの実装方法のメモ書き。 <dialog> 要素の利用を前提とします。 Web アプリケーションで UI ライブラリを利用する場合は話が変わってきます。 1年前にdialog要素を使用したモーダルウィンドウの実装例を投稿しましたが、大幅にアップデートされているため、忘れても構いません。 結論<dialog>要素の開閉は command 属性を使用する<dialog>要素の外側をクリックした際に閉じる Light dismiss 機能は closedby 属性を使用するcommand 属性と closedby 属性は Polyfill を使用する開閉時のアニメーション、背面のスクロール抑制、スクロールバーの有無によるガタツキの防止は CSS で行う方針としては極力JavaScriptを書かないことを目指します。 次のようにHTMLを書くことで<dialog>要素の開閉および
作って理解するWebフレームワーク - きしだのHatena
前回、簡単なDIコンテナを作ってみたので、次はこれを使ってWebフレームワークを作ってみたいと思います。 Webサーバーをつくる まず、WebフレームワークなのでHTTPサーバーが必要ですね。なので簡単なものを作ります。 とりあえずブラウザからリクエストを受け取ったら200 OKとHTMLを返すだけのサーバーです。 今回は、そこらのブラウザからアクセスできればいいや、ということで、RFCとかの仕様に準拠することは考えません。 public class Server { public static void main(String[] args) throws IOException { ServerSocket serverSoc = new ServerSocket(8989); for (;;) { Socket s = serverSoc.accept(); new Thread((
encodeURIComponentが世界基準だと誤解してた話
URLをいじくるプログラムをいじっていて、仕様がよくわからなくて悩んだのでまとめます。 2/23: 追試部分を追記 2018/7/14: JavaScriptのURLSearchParamsと、GoのPathEscapeについて追記 ことの経緯 HTTPとはなんぞやとか、GETとPOSTがどうの、それぞれでパラメータがどういう経緯でウェブアプリケーション(とかCGI)に渡って来るのかぐらいは知っていました。で、ウェブでXHRでGETリクエストを送る場合にはJavaScriptのencodeURIComponent()で各パラメータをエンコードして、&でくっつけて、URLの末尾に?で付与すればいいんだよね？と思っていました。こんな感じに。 これを受け取る側は、JavaScript(node.js)ならdecodeURIComponent()を使っているはずだ。ウェブの世界ではJavaScri
Webサーバを作る
レスポンスヘッダを取捨選択する 前回、 手作りのTCPクライアントでApacheを叩いてみたところ、 以下のレスポンスが得られました。 1: HTTP/1.1 200 OK 2: Date: Tue, 30 Jul 2013 17:47:09 GMT 3: Server: Apache/2.4.6 (Win32) 4: Last-Modified: Mon, 11 Jun 2007 11:53:14 GMT 5: ETag: "2e-432a0069dbe80" 6: Accept-Ranges: bytes 7: Content-Length: 46 8: Keep-Alive: timeout=5, max=100 9: Connection: Keep-Alive 10: Content-Type: text/html 11: 12: <html><body><h1>It works
TCPサーバ/クライアントを作る
開発環境について この記事では、開発言語としてJava7を使用します。 それなりにユーザ層が厚く、処理系が無料で提供されている、 ということでJavaを選んだだけですので、 他の言語が得意な方は各自読み替えていただいてもよいかと思います。 OSも何でもかまいませんが、私はWindows Vistaを使用しています (2007年に購入したLet's Noteです。いい加減買い換えろって?)。 Webサーバとブラウザは通常TCP/IPで通信を行いますので、 Webサーバを作る前に、まずはTCPのサーバとクライアントを作ってみます。 JavaでのTCPサーバ/クライアントのサンプルソースは Google検索でもすればいくらでも見つかりますが、 ひとまずここでは以下のようなプログラムを書いてみました。 まずはサーバです(Server01.java)。 import java.io.*; impor
本当の基礎からのWebアプリケーション入門――Webサーバを作ってみよう
このページの目的は、 Webアプリケーションの基礎の基礎を説明することです。 さて、ここから下のぐだぐだは読み飛ばして、 いきなり実装の説明に 行ってもらってもかまいませんが、一応趣旨を書いておきます。 現在、プロのプログラマーの方々には、日々の仕事でせっせと 「Webアプリケーション」を作っている人が多いと思います。 そして、いまどきWebアプリケーションを作るのに、 CGIとかあり得ないでしょうから、 それなりの高級言語で、 それなりのフレームワーク等を使用して作っているのだと思います。 私自身、現状、仕事では主にC#とASP.NETを使っています。 そうやって生産性を上げるのは大変よいことだと思うのですが、 ことWebアプリケーションにおいては、 そのような「一見簡単そう」なフレームワークを使っても、 ちょっとややこしいことをやろうとするとすぐにうまくいかなくなって、 職場の先輩に聞
「本当の基礎からのWebアプリケーション入門――Webサーバを作ってみよう」始めました - K.Maebashi's はてなブログ
以前から「誰か書いてくれませんかね」とか言っていた「本当の基礎からのWebアプリケーション入門――Webサーバを作ってみよう」ですが、誰も書いてくれないので自分で書きました。 本当の基礎からのWebアプリケーション入門――Webサーバを作ってみよう http://kmaebashi.com/programmer/webserver/index.html 現状、合計で140行くらいのJavaプログラムで、普通に画像やCSSを含むWebページが表示できています。こちらのページの下のほうにも画像を貼っていますが、こんな感じで、ローカルのファイルシステムに置いてある私のWebサイトのトップページが表示できていますし、もちろんリンクをクリックして遷移することもできます。 「えっ? Webサーバってこんなに簡単に書けるの?」と思う人も多いのではないでしょうか。 もちろんこんなのは「わかっている人」から
「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基本講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデー
Greenbear Diary - 5分でわかるRack , シュレーディンガーの猫たち
■ [ruby][rack] 5分でわかるRack RackはRubyのためのWebサーバインターフェイスだ。 RubyでWebっていうとRailsが有名だけど、実はRails以外にもいろんなRuby用のWebアプリ用フレームワークが存在する。 Ramaze Merb Camping Waves などなど…。 一方Webを実際に動かすにはWebサーバが必要だ。RubyのためのWebサーバも、これまたいろんなものがある。 Apache(CGI, FastCGI..) WEBrick Mongrel Ebb Thin などなど…。 ここで問題が一つ。それは「フレームワークが増えるたびに、いろんなサーバをサポートするためのコードが必要になる」ってとこだ。 各フレームワークの作者がみんなそれぞれにCGIやMongrelに対応するためのコードを書いてるなんて、無駄だと思わないか？ RackはWebア
「Webアプリの脆弱性対策は簡単です」
「Webアプリケーションの脆弱性対策は簡単です」。 セキュリティ関連の取材をするようになって10年以上になるが、セキュリティ対策が「簡単」だと聞いたのは恐らく初めてである。取材の相手は、TISの早矢仕善弘氏（技術本部 セキュアワン室 室長）。ソースコードを対象にした脆弱性チェックツールとして広く利用されている米Fortify Softwareに、同社ソフトの検証を依頼されたこともあるというセキュリティの専門家である。 早矢仕氏によるとWebアプリケーションの脆弱性は、たった四つの原則を守れば防げるという。SQLインジェクションやクロスサイトスクリプティング（XSS）など著名なものはもちろん、最近になって発見されている数多くの脆弱性が、いずれかの原則の対象になる。四つの原則を紹介しよう。 （1）ユーザー入力を精査する Webページのフォームなどに入力された文字列は、きちんとチェックしなければ
Wii用のサイトを作る際に超便利なJavaScriptライブラリ「wii.js」:phpspot開発日誌
Creating web sites for the Wii Opera browser Though it may be old news that Wiimote keycodes can be detected by JavaScript in the Wii Opera browser, I could not find a JavaScript library that facilitates handling these input events, so I created my own. Wii用のサイトを作る際に超便利なJavaScriptライブラリ「wii.js」 wii.jsをインクルードすると次のようなAPIを使うことが出来ます。 wii.isWiiOperaBrowser() - WIIで見ているかどうかを true/ false で返す wii.setupHand
HTML5 における HTML4 からの変更点
この文書は「HTML5 differences from HTML4 (W3C Working Draft 25 May 2011)」の日本語訳です。 原文の最新版 は、この日本語訳が参照した版から更新されている可能性があります。 この日本語訳は参考情報であり、正式な文書ではないことにご注意ください。また、翻訳において生じた誤りが含まれる可能性があります。他の仕様の訳については Web 標準仕様 日本語訳一覧 を参照してください。 更新日: 2011-09-15 公開日: 2011-05-26 翻訳者: 矢倉 眞隆 <yakura-masataka@mitsue.co.jp> HTML5 における HTML4 からの変更点 2011年5月25日付 W3C 草案 (Working Draft) この版: http://www.w3.org/TR/2011/WD-html5-diff-2011
ke-tai.org < Blog Archive > ケータイの端末ID・ユーザIDの取得についてまとめてみました
ケータイの端末ID・ユーザIDの取得についてまとめてみました Tweet 2008/9/8 月曜日 matsui Posted in au, DoCoMo, PHP, SoftBank | 12 Comments » ケータイサイトでは、端末ID・ユーザIDを取得する、という処理をよく行うことがあります。 ログインの度に、ユーザ名とパスワードを入力するというのは、ケータイの操作性の面からも現実的ではないためです。 今回はそんな各種IDの取得方法について、PHPを使った場合を例にとりまとめてみました。 ※ここでは端末IDを「ケータイに振られた個体識別情報（製造番号など）」、ユーザIDを「契約に紐付くID」として解説しています。 ドコモ端末での取得方法 1. utnを使う ドコモ端末ではutn属性を使うことによって、フォームやリンクから個体識別情報を取得することができます。 対応機種は、iモー
コメント: PHPは駄目な言語なのか? - スラッシュドット・ジャパン
趣味でやっている人のことは、まあ、いいとして（踏み台にされる可能性はあるけど）、仕事でPHPを使うときの注意を書いておこう。 コーディング規約を守る。組織にコーディング規約がないなら、Zend Framework PHP標準コーディング規約 [zend.com]を使う。オレ流コーディングスタイルは禁止。 内部コードにはEUC-JPかUTF-8を使う。入出力もできるだけShift JISを避ける。Shift JISを使う場合には2byte目に0x5Cを含む文字の動作を忘れずに確認する。 開発環境の警告レベルをE_STRICTにする。本番環境ではdisplay_errorsをオフにする。 register_globals、magic_quotesはオフにする。 type hintingを積極的に使う。 スコープの長い配列をクラスでラップする。 プレゼンテーションとロジックを分割すること。プレゼ
naoya_t:ポール・グレアムのエッセイと和訳一覧
ポール・グレアムのエッセイと和訳一覧 (originally maintained by naoya_t) Paul Grahamのエッセイ（原文）と、公開されている日本語訳のリストです。 見つけたら or 訳したら、自由に追加して下さい。複数の訳が存在する場合は全て追加してください。 Writes and Write-Nots 書く者と書かざる者 (spinute) Founder Mode 創業者モード (spinute) The Reddits Reddit の創業者たち (spinute) What You (Want to)* Want あなたが(望むことを)*望むこと (spinute) Alien Truth エイリアンの真実 (spinute) How to Start Google Googleのはじめ方 (yomoyomo) How to Get New Ideas 新
はてな伊藤直也氏MIJS講演「プログラマでいること」 : 小野和俊のブログ
昨日MIJSのコンソーシアム内での技術発表会があり、理事会の方から「参加ベンダーの技術者が集まるイベントなので、技術者に元気を与えられるような人に講演をお願いしたい」という話があったので、はてな伊藤さんに講演をお願いした。 伊藤さんにお願いしようと思ったのは、伊藤さんなら、エンタープライズの世界にウェブの世界の元気な風を吹き込んでくれるのではないかと思ったからだ。 以下、私なりに講演の内容をまとめてみた。 ■「建物の建て方」 つくる対象がどのようなものかで、作り方は当然変わってくる。これは建物もソフトウェアも同じ。1階建ての格好良い小さなロッジを建てるのと、60階建ての安全で高品質な巨大ビルを建てるのとは方法も道具も異なる。ロッジを建てる時にはノコギリを使うが、巨大ビルを建てるにはクレーンを使う。 よくブログの世界でソフトウェアの開発について、ぜんぜん違うことをやっている人が同じ土俵で議論
404 Blog Not Found:怠翻 - JavaScriptでありがちな9つのシマッタ
2007年08月17日01:15 カテゴリ翻訳/紹介Lightweight Languages 怠翻 - JavaScriptでありがちな9つのシマッタ 私自身結構シマッタしちゃうので。 Nine Javascript Gotchas 尻カンマ注意 以下のコードはFireFoxでは動きますが、Internet Explorer (以下IE)では問題になります。 var theObj = { city : "Boston", state : "MA", } 最後にカンマが入らないよう注意しましょう。 浮気なthisは何を見てるやら 以下のコードで、thisは何を指しているでしょうか。 <input type="button" value="Gotcha!" id="MyButton" > <script> var MyObject = function () { this.alertMess
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - livedoor/cicindela2: a highly customizable recommendation engine written in perl + MySQL
Discover gists
http://ja.doukaku.org/