You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
ソーシャルボタンのJavaScriptでfunctionの前に「!」がついている理由を調べてみました。 1.はじめに TwitterやPocketなどのソーシャルボタンのコードをみると、共通してscript要素の中にあるfunctionの前に「!(エクスクラメーション)」がついています。 Twitterの場合 <a href="https://twitter.com/share" class="twitter-share-button" data-via="yujiro" data-lang="ja" data-size="large">ツイート</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getE
1. 祝 io.js-v1.0.0/1.0.1 のリリース NodeやJSの情報にアンテナを張っている人なら知っているとは思いますが、昨日無事「io.js」がリリースされました。 リリース直前のバグ修正の追い込みやライブラリアップデートのごたごたは、かつてのNodeのリリースそのままでした。 今日のリリースを予言していたわけではないですが、実は昨年の8月初旬に、 ということを書いていました。 これがまさに現実になってしまったなぁ、と驚きと共に感慨深いものがあります。 Nodeの方は、今Julienが頑張ってチケットをクローズしており、近日中に Node-v0.11.15がリリースされる予定です。問題なければNode-v0.11.15のリリース2週間後にNode-v0.12 になるでしょう。 io.jsができた細かい経緯については、古川さんの「io.jsについて知っていること」が詳しいです。
JavaScriptで関数型プログラミングを強力に後押しするUnderscore.jsのおすすめメソッド12選(lodashもあるよ)JavaScriptNode.js関数型言語 はじめに この記事では、関数型プログラミングを強力に後押しするライブラリ、 Underscore.jsとlodashを紹介します。 両ライブラリとも_で使用できます。 ほかのライブラリにも依存せず、 現在フロントでもサーバでもかなり人気なライブラリです。 個人的にもこれなしでは。。 といった必須なライブラリとなっています。 また、Backbone.jsといった人気なフレームワークが、 Underscoreに依存していたりします。 Underscore.js GitHub: https://github.com/jashkenas/underscore Document: http://underscorejs.o
業務で携わっている案件なのですが、アクセス数の急増が見込まれるイベントがありまして。準備期間も少なく、バックエンド側でできることがほぼないという状況でサイトを落とさないようにがんばる!というお仕事でした。レガシーソースてんこ盛り。CSSプリプロセッサとか何それ状態。 そこで実施した対策のまとめです。サーバー・アプリケーション・サイトの構成によって、効果の大小はありますが、比較的効果があったと思われるものをつらつらと。 リクエストの削減とファイルサイズの最適化 まず一番最初に考えなければいけないのがリクエスト数です。すごいおおざっぱに言うと、WEBサーバー(ApacheとかNginxとか)への負荷は、PV数×リクエスト数です。PVがそんなに無くてもそのページのリクエストがめちゃくちゃ多いとそれだけでかなりの負荷になります。リクエストを半分にできれば2倍の人数がさばけるってことに、すげーおおざ
工学ナビの橋本さんがProcessingのJavascriptライブラリp5.jsとmbedJSの使い方を記事にしてくださいました。 mbedJS + p5.jsでWebブラウザからmbedを制御する - Imaginable Reality iPhoneやiPadの場合、mbedJSを搭載したmbedはAppleの開発した機器検出プロトコルBonjourを使ってアプリから直接探すこともできます。 IPアドレスの打ち込みを省略したいときはこちらの記事を参考にしてください。 ネットワークに接続しているmbedJSを探す方法 - nyatla@hatena blog mbed NXP LPC1768 出版社/メーカー: スイッチサイエンスメディア: エレクトロニクス クリック: 1回この商品を含むブログを見るmbed用イーサネット接続キット 出版社/メーカー: スイッチサイエンスメディア: エ
Promiseは非同期処理をベースにした並列処理の実装方法の一種です。Promiseでは並列処理の各タスクが必ず1回実行されることが保証され、タスクとタスクからの結果を取得する処理を分離することできます。また、タスクの並列処理/直列処理をユーザーが自由に制御することができます。 ECMAScript Language Specification 6th EditionにPromiseが追加されたことから、しばらくの間JavaScriptの非同期処理に関する話題の中心はPromiseになると思われます。 Node.jsでも既にPromise対応したモジュールも多く、Promiseでのみ非同期処理を提供しているモジュールも存在します。Promiseを使用する機会は今後必然的に増えていくでしょう。 今回のエントリーでは、Node.jsでPromiseを使用する方法を説明します。コード例を中心に理
こんにちは。Tokyo Otaku Mode エンジニアの重岡です。 本ブログを読んだことがある方々は既にご存知かもしれませんが、Tokyo Otaku Modeでは otakumode.com に Node.js と MongoDB を採用しています。フレームワークには Node.js 製の Express.js (3系) を使っています。Express.js は Ruby の Sinatra や Python の Flask と同じような MicroFramework なので、必要な機能は npm で module をインストールする、もしくは自分で Express.js の機能を拡張します。 今回は Express.js に機能拡張した一例として res.render を otakumode.com 向けに使いやすく改良した手順をご紹介します。 View 出力時の共通処理をまとめたい
昨夜、渋谷ヒカリエで行われた東京Node学園 14時限目で、トップバッターとして発表してきました。 発表内容は、「Synth」というWebアプリケーションフレームワークについてです。 Tokyo Otaku Modeでは、バックエンドとしてNode.jsとMongoDBを使っていてExpressで運用していますが、色んなフレームワークも触っていてSynthもそのうちの一つです。 SynthはInfoQの「APIファーストのWebフレームワークSynthを巡るコミュニティの困惑」という日本語版記事が出て初めて知った人が多いと思います。 記事にもあるとおり、JSONやテンプレートHTMLを返すAPIとそれを使ってクライアント側でアプリケーションを構築するという形に特化したAPIファーストのWebアプリケーションフレームワークです。 ちょうど上記の記事が出た頃、天下一クライアントサイドJS MV
2012 年 9 月 26 日 追記しました。 要約エントリー。 元記事 : iPhone 5 website teardown: How Apple compresses video using JPEG, JSON, and <canvas> アップルのサイトの iPhone5 のページにある「スライドしてアンロック」のアニメーションが、信じられない実装になっている、という話。簡単に要約してみた。(ミスなどの指摘は @lowply までお願いします) もともと h.264 と WebM の動画フォーマット戦争でブラウザ互換性の問題がまだ残っている上、iPhone などは「再生ボタン」を押さないと再生できなかったりするので、こうした短いアニメーションに video タグを使うことは最適解ではなかったらしい。 そこで発想の転換をして、Retina MBP のページでは、蓋が開くたった 2
Tokyo Otaku ModeでEngineerやってますpchwです。 通常、チームで技術ブログを書こうとすると、 他の人からフィードバックをもらいにくい フィードバックをもらっても、どの部分への指摘かわからない 下書きをキャプチャした画像に赤入れされたのが送られてきた そもそもリッチテキストで書くのがダルい など不幸な出来事が起こりがちです。 僕らは日々の開発と同じようなフローに則ってチームでブログを執筆する環境を整えたので、その方法を共有します。 Tokyo Otaku Modeでは、主にNode.jsを使って開発を進めています。 そのため、プラグインを書くのにもふだんの環境がそのまま使えるHexoというBlogging Frameworkを使って、ブログを執筆する環境を整えました。 HexoはNode.js製でOctopressの影響を受けて開発されています。 HexoもOcto
軽めの話題を 毎回割と「濃い目」の記事が多いこのTech-Sketchですが、今回は軽めの内容として、nodejsとそのモジュールであるPassportを利用した他サービスとの認証連携を説明しようと思います。 PassportはConnectやExpressベースのWebアプリケーションに認証の仕組みを組み込むことができるモジュールです。単純なローカルでのユーザ名・パスワードによる認証から、OpenIDやOAuthを利用した認証もカバーしています。それぞれの認証の方式はstrategyとして選択することが可能で、簡単に認証に関する実装を追加することができます。OpenID/OAuthで認証を行う場合のstrategyは、メジャーなサービスに対してのものはnpmでインストールできる形ですでに多数用意されています。 具体的にどのようなstrategyが用意されているかは、以下のリンク先を参照し
前置き Node.js で一番よく使われている Webフレームワークといえば、Express です。で、その Express が大きく依存しているのが Connect です。 Express を制するにはまずは Connect から、というわけで、Connect のソースコードを読み始めました。 対象とする Connect のバージョンは現時点(2011/11/23)での最新版である 1.8.1 (Express 2.5.1 が依存)です。 初回は、ソースを読む前の事前準備として、ソースコードの依存関係と各ソースの概要について説明します。 Connect ソースコードの場所 1.x ブランチ (master は 2.0.0alpha1 なので注意) senchalabs/connect at 1.x · GitHub 現時点でのメイン・コミッター(≒ 最もアクティブにコミットしている人の意
Mobile webapps made easy. Download Get Started App.js is a lightweight JavaScript UI library for creating mobile webapps that behave like native apps, sacrificing neither performance nor polish.
デモページ フッタはダイナミックに3Dで表示されます。 ScrollRevealの使い方 Step 1: 外部ファイル 当スクリプトとAni.jsを</body>の上、アニメーション用のスタイルシート「animate.css」をhead内に記述します。 <head> ... <link rel="stylesheet" href="http://cdn.jsdelivr.net/animatecss/3.1.0/animate.css"> </head> <body> ... <script src="anijs-min.js"></script> <script src="helpers/scrollreveal/anijs-helper-scrollreveal-min.js"></script> </body> Step 2: HTML 各要素のアニメーションの設定は、HTMLに記述
JavaScript (Node.js) で開発する上で避けては通れない 非同期処理、コールバックについて考えてみたい。 自分なりのお勧めの方式を書いてみた。 いろいろなものを試した結果である。 ※この記事でのお勧めの方法は ES2015 (ES6) で実装された generators (yield) の技術を使用しています。 実はまだ Babel(6to5) 等を利用するか Node.js v4~v8 でしか 実質的に使用できない技術だと思います。悪しからず。 (早く全てのブラウザに広く普及する事を祈っています) まだブラウザでは独自ライブラリか Promise (Deferred) 等を使っています。 ※2015/10/15: 記事の内容を npm aa (async-await) に対応させました。 ※2015/04/19: 記事の内容を npm co@4 に対応させました。 ※20
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く