こんにちは。アプリケーションエンジニアのid:yashigani_wです。 はてなは、短期間にWebアプリケーション開発の基礎を身につけるための教材である「はてな教科書」をgithubで公開しています。 これは新入社員研修やはてなサマーインターンでの講義に利用されており、毎年のはてなサマーインターンの一環として加筆・修正し更新しています。 今年は「はてな教科書JavaScript編」「SwiftでのiOSアプリ開発」「Web開発におけるコンピュータサイエンス - 機械学習編」を変更・追加しました。 Webアプリケーション開発の学習や研修のために自由にご利用いただけます。 はてな教科書JavaScript編 今年のはてな教科書では、JavaScript教科書を一新しました。 JavaSctiptの講義は内容が長大になってしまったため、他の教科書とは別レポジトリに移動しました。 また、教科書は
（これまでのあらすじ）前回、パソコン工房から「統計処理用のPCのPR企画をやりたい」と依頼を受けて、はてなエンジニアと一緒にword2vecで遊んでみた編集部。読者の皆さまにも好評だったので、調子に乗って第2弾を実施することにしました。今回は「"word2vec"で艦これ加賀さんから乳を引いてみる」で一世を風靡した、あの統計屋さんが全面協力です！ 記事の最後にはプレゼントのお知らせも。 （※この記事は株式会社ユニットコムによるPR記事です） 皆さまは前回の記事を、覚えておりますでしょうか？ ▽ Python - Perl + Java = ？ はてなブログのデータとパソコン工房のPCを使って「word2vec」で遊んでみた - はてなニュース パソコン工房の統計処理用PC × はてなブログのデータ × word2vec という記事でした。ブックマークコメントから感想をいくつかピックアップし
Chromeの拡張機能としてリリースしましたよ！ はてなNG - Chrome ウェブストア https://chrome.google.com/webstore/detail/%E3%81%AF%E3%81%A6%E3%81%AAng/mbgdnfmdelffjdhkdggilmphfdihnmcj 機能NGアドレスのエントリーをブロックします。NGワードを含むエントリーをブロックします。NGアカウントのコメント、はてなスター、ブログをブロックします。同一アカウントの連打による複数のスターをひとつのスターにして表示します。[対象サイト] はてな（http://www.hatena.ne.jp/） はてなブックマーク内ページ（http://b.hatena.ne.jp/） 結果はてなの閲覧がめちゃくちゃ快適になりました！ 目障りなサイトやアカウントは見なくて済むし、ブコメページのノイジーな
Intro 今日は、フロントのプログラミングスタイルに、にまた一つ大きな変化をもたらすであろう Stream という API についてです。 この仕様は現時点でまだ策定中であるため、 API は変更される恐れがある点にご注意ください。 Stream API 以前 「Node.js の Stream API で「データの流れ」を扱う方法」 という記事を書きましたが、簡単に言うとあれがブラウザにもやってくるという話です。 非同期処理おさらい もう何度も書いた話なので駆け足で。 JS はシングルスレッドでイベント駆動な世界なので、何をするにも非同期であり、コールバックを登録することで完了した結果を受け取る API が基本です。 これは、ブラウザの DOM の API でも、 Node.js でも共通しています。 概念を疑似コードで書くと以下のような感じです。 console.log('1');
これ @mizchi がIncrementsにJoinしました - Qiita Blog 特に転職したとは一言も報告してなかったけど、先月末でQuipperを退職し、二週間ほどのモンハン廃人を経て、先週からQiitaを運用しているIncrementsで働いている。 自分が使ってるサービスのドッグフーディングが出来て、将来性があって、大きすぎずに自分の手が届く範囲にやり甲斐があり、JavaScriptエンジニアとして自分にとっての技術的課題がたくさんありそうなIncrementsに行くことにした。 一週間ぐらい働いて、やっと慣れてきて、デプロイももう何度かやったし、Githubのstatsみると一週間で25000行ぐらい書き換えてユーザーの手元に届いてるっぽいんだけど、これは最初に取り組んだのが外部アセットを連結して圧縮したりこねくり回したりしたりするという作業で、作業量以上に行数に出ている
/*! jQuery v1.9.1 | (c) 2005, 2012 jQuery Foundation, Inc. | jquery.org/license //@ sourceMappingURL=jquery.min.map */(function(e,t){var n,r,i=typeof t,o=e.document,a=e.location,s=e.jQuery,u=e.$,l={},c=[],p="1.9.1",f=c.concat,d=c.push,h=c.slice,g=c.indexOf,m=l.toString,y=l.hasOwnProperty,v=p.trim,b=function(e,t){return new b.fn.init(e,t,r)},x=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,w=/\S+/g,T
11 August 2014: はてなのサポートから連絡がきた。 いつもはてなをご利用いただきありがとうございます。 ご指摘いただきました件につきまして、ただいま対応を検討しております。 第三者に悪用される可能性もございますので、 もし、脆弱性を確認された場合には、先に弊社にご連絡いただき、 脆弱性が修正されるまで、ブログなどで詳細を公開されないようご協力いただけますと幸いです。 もしなにかご不明な点などございましたらご連絡ください。 どうぞよろしくお願いいたします。 しかしサポートにはこの記事のURLしか送っていないし、既に（一部ユーザによるDDoSも含めて）89656のスターがつくほど閲覧されているので、この記事を消してもしょうがない。よって、このまま放置する。読者は修正されるまで、決して悪用しないでほしい。 テスト RSSで見てる人は直接開いてください はてブで指摘があったが、このペ
昨日，ページャNightという勉強会で，はてなブログのJSの見どころを紹介するLTをした．(昨日の日記)． 資料公開しようかと思ったのだけど，発表資料そのまま公開しても意味不明なので，エントリに書き直すことにした． たとえば，このLGTM画像は発表資料の1枚目で，もし発表資料をそのまま公開したら，こういう謎の画像を解説もないまま見ることになっていたはず． JSのページャいっぱいある はてなブログの編集画面には編集サイドバーというのがあって，写真とかAmazon検索とかTwitterとかinstagramとかあれこれ貼れるようになってる． Amazon検索しても画面遷移するわけじゃなくて，ウェブ2.0という感じで，XHRでJSONを取ってきて，HTMLを組み立てて表示，クリックすると選択，貼り付けを押すとエディタに挿入される，という仕組み． 編集サイドバーから貼れるサービスは10種類くらいあ
こんにちは、id:hakobe932です。はてなブログではユーザ体験の改善のために、ページ表示速度を向上させるための様々な取り組みを行っています。このエントリーでは、はてなブログで行っている、ブラウザキャッシュの活用、JavaScriptのページ最下部での読み込み、JavaScriptの圧縮、という3つの取り組みについて解説します。 ブラウザキャッシュの活用 同じ内容のJavaScriptやCSSを、ページを表示するたびにダウンロードすると、余分なHTTPリクエストが発生しますし、読み込み時間がかかります。 ブラウザのキャッシュを利用できれば、余分なリクエストを減らすことができます。はてなブログでは、なるべく長い間ブラウザにキャッシュを保存するために、JavaScriptなどの一部の種類のファイルのレスポンスに、以下のようなヘッダを指定しています。 $ curl -I http://hat
2014年03月13日16:30 カテゴリArtCode 些末なゴミは出所を問わず拾うのが客商売 USJのジェットコースターは なぜ後ろ向きに走ったのか? 森岡毅 たとえ話を一つ。 些末なコードレビュー - naoyaのはてなダイアリー あるサービスの JavaScript が重いとか、そのコードが難読化されてないとか、担当者とおぼしき人間が書いたコメントがそのまま残ってるから消しましょうよとか、そんなことが書かれていた。JavaScript が重い、という話は結局そのサービスの JavaScript が重かったのではなく、ユーザーが自分で導入した広告が重いというだけの話だった。駐車場に停めてあったクルマがぐしゃぐしゃになっている。向かい側に停めていた人が、アクセルとブレーキを踏み間違えて、いきおいよくぶつけちゃったらしい。クルマの持ち主はもちろん、クルマのメーカーも何も悪くない。だけどつ
これ http://emija.hatenablog.com/entry/2014/03/11/231940 の話です。 Web のパフォーマンスは我々の共通の懸案ですから、真面目に考えていきましょう。 当該 URL で調査 広告オン時 Adblock した時 いずれもキャッシュ無効です。 結論 広告ベタベタ増やしてる + WiMAX のルーター置いてる場所がなんかダメなのが悪いんじゃないの？ 参考資料 読み込みに使ってるページはこれ http://blog.livedoor.jp/dqnplus/archives/1790719.html 痛いニュース広告オン 痛いニュース Adblock なんとなくブログ界隈全体が表示遅いんじゃないかという気がしますね。 ちなみに以下はうちのサイト さらにいろいろ調べた結果 ブログだいたい Adblock して 4 秒ぐらいで表示されてしてないと 8
この頃このダイアリーを時折更新していますが、改めて見てみるとデザインが野暮ったかったので、変更しました。Readability を通して読んだときのスタイルが非常に読みやすいので、そのスタイルをパ･･･参考にしました。 ちょっとまだ一部スタイルが当たってないところもありますが、基本はこの路線で。Chrome、Firefox、Safari では確認済み。Windows と Opera では見ていないのでどうなるかわかりません。 どうやって変更したか ダイアリーの管理画面にスタイルを入力してプレビューで･･･とちまちま変更していくのは流石に大変なので、やり方を少し工夫しました。先日触った Meteor.js を使って先に簡単なアプリを作って、そのアプリ上で変更してできあがった CSS を管理画面に貼り付ける、というもの。 以下、そのソース。 https://github.com/naoya/m
竹迫良範（ id:TAKESAKO）さんが翻訳および編集をされた『ECMA-262 Edition 5.1を読む』が、9月25日に発売になりました。多くのWebエンジニアが利用するプログラミング言語「JavaScript」の最新仕様書である「ECMA-262 Edition 5.1」を完全翻訳し、解説を加えた一冊です。 ECMA-262 Edition 5.1を読む 作者: 竹迫良範出版社/メーカー: 秀和システム発売日: 2013/09/25メディア: 単行本この商品を含むブログを見る 本書には弊社エンジニアの id:nanto_vi がレビューで協力させていただいたこともあり、はてな開発者ブログでは発売を記念したキャンペーンを実施します。秀和システム様からご提供いただいた『ECMA-262 Edition 5.1を読む』に、はてなブックマークのオリジナルステッカーをセットにして、当ブロ
Hatena-Textbook はてな教科書は、はてなのエンジニアとして最低限必要とされる技術を身につけるための教科書です。 Web開発における重要なトピックを順番に学びながら、課題をといていくことで、Webアプリケーションをひととおり構築できるようになります。 実装言語としてPerlとScalaのどちらを選ぶことができます。 トピックごとに学びたい言語の方の教科書を読み進めてください。 目次 プログラミングの基礎 Perlによるプログラミングの基礎 Scalaによるプログラミングの基礎 データベースの基礎 Perlによるデータベースプログラミング Scalaによるデータベースプログラミング Web開発の基礎 PerlによるWebアプリケーション開発 ScalaによるWebアプリケーション開発 Webフロントエンド開発 はてな教科書JavaScript編 hatena/Hatena-Tex
Webサイトを運営していると、自分のサイトや記事の評判が気になることと思います。そんなとき、ネット上の評価を知るひとつの手段となるのが「はてなブックマーク」です。今回は、自分のWebページに、はてなブックマークのブックマーク数やコメントなどを表示する方法を紹介します。 JSONPでデータを取得できるAPI はてなブックマークは、外部からブックマークするなどの機能を実装するために、API（Application Programming Interface）を公開しています。それらAPIの1つに、「はてなブックマークエントリー情報取得API」があります。 これを使うと、個々のWebページに付けられたブックマークの情報を得られます。具体的には、以下のようなアドレスにアクセスすると、個々のWebページのブックマークの情報が、「JSON」（JavaScript Object Notation）形式の
はてなブックマーク（以下「はてブ」）がリニューアルされ、ブラウザからブックマークレットでブックマーク登録（以下「ブクマ登録」）しようとすると、図1の画面が現れるようになった。「こちらから再設定をお願いします」と指示されているが、この指示に従ってはいけない。ここで提供されている新型ブックマークレットは使ってはいけない。（この指示には従わなくてもブクマ登録はできる。） 新型ブックマークレットを使用すると図2の画面となる。ブクマ登録しようとしているWebサイト（通常、はてな以外のサイト）上に、はてブの画面のウィンドウが現れている。これは、Ajaxと共に近年よく使われるようになった「ページ内JavaScriptウィンドウ」である。（ポップアップウィンドウとは違い、ウィンドウをドラッグしてもブラウザの外に出すことはできず、あくまでも表示中のページ上のコンテンツであることがわかる。）
ぼくはライフワークとして画面をチカチカさせる活動をしてるのだけど，周りの人にあまり理解してもらえなくて，まぶしいとか，そんな低俗なことをやって，みたいな反応をされる． けど，画面をチカチカさせるだけでも，いろいろと工夫できることとかある．今日はこれまでの活動の振り返りと，それで得たノウハウを共有しようと思います． 過去の活動 これまでに，いろいろ画面をチカチカさせるやつ作っているので，順に紹介します． コード残ってるのは2010年からだけど，一番古いのは中学生のときにRPGツクールで作った画面がチカチカするゲームで，途中まではRPGとして遊べるけどストーリーが進むと画面が高速で点滅し始めてそれ以降何もできなくなるというゲームでした． 古くはポケモンショックというイベントもあったけど，ぼくは関西に住んでて見れなかった． ウェブページをチカチカさせる このbookmarkletを起動するとウェ
こんにちは。id:nagayamaです。 現在僕は、はてなブックマークのディレクターという仕事をしています。Webサービスを提供するディレクターたるもの、新しいデバイスやプラットフォームがどういった仕組みになっているのかを体系的に理解しておくのは大事な事です。 今回ははてなブックマークからWindows ストア アプリがリリースされたのをきっかけに、そのアプリの開発に携わったid:nobuokaの力をかりつつ、簡単なはてなブックマークのアプリを実際に作りながら、その仕組みを学びました。 その一連の流れをチュートリアルのような形でまとめたものを公開します。実際のソースコードはGitHubでも公開しています。ぜひ最後までお読みいただき、興味がでた方は手許にcloneして遊んでみてください。 Windows ストア アプリについて Windows ストア アプリの概要は UWP アプリの概要 -
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
