はてなブックマークアプリ

サクサク読めて、
アプリ限定の機能も多数!

アプリで開く

はてなブックマーク

  • はてなブックマークって?
  • アプリ・拡張の紹介
  • ユーザー登録
  • ログイン
  • Hatena

はてなブックマーク

トップへ戻る

  • 総合
    • 人気
    • 新着
    • IT
    • 最新ガジェット
    • 自然科学
    • 経済・金融
    • おもしろ
    • マンガ
    • ゲーム
    • はてなブログ(総合)
  • 一般
    • 人気
    • 新着
    • 社会ニュース
    • 地域
    • 国際
    • 天気
    • グルメ
    • 映画・音楽
    • スポーツ
    • はてな匿名ダイアリー
    • はてなブログ(一般)
  • 世の中
    • 人気
    • 新着
    • 新型コロナウイルス
    • 働き方
    • 生き方
    • 地域
    • 医療・ヘルス
    • 教育
    • はてな匿名ダイアリー
    • はてなブログ(世の中)
  • 政治と経済
    • 人気
    • 新着
    • 政治
    • 経済・金融
    • 企業
    • 仕事・就職
    • マーケット
    • 国際
    • はてなブログ(政治と経済)
  • 暮らし
    • 人気
    • 新着
    • カルチャー・ライフスタイル
    • ファッション
    • 運動・エクササイズ
    • 結婚・子育て
    • 住まい
    • グルメ
    • 相続
    • はてなブログ(暮らし)
    • 掃除・整理整頓
    • 雑貨
    • 買ってよかったもの
    • 旅行
    • アウトドア
    • 趣味
  • 学び
    • 人気
    • 新着
    • 人文科学
    • 社会科学
    • 自然科学
    • 語学
    • ビジネス・経営学
    • デザイン
    • 法律
    • 本・書評
    • 将棋・囲碁
    • はてなブログ(学び)
  • テクノロジー
    • 人気
    • 新着
    • IT
    • セキュリティ技術
    • はてなブログ(テクノロジー)
    • AI・機械学習
    • プログラミング
    • エンジニア
  • おもしろ
    • 人気
    • 新着
    • まとめ
    • ネタ
    • おもしろ
    • これはすごい
    • かわいい
    • 雑学
    • 癒やし
    • はてなブログ(おもしろ)
  • エンタメ
    • 人気
    • 新着
    • スポーツ
    • 映画
    • 音楽
    • アイドル
    • 芸能
    • お笑い
    • サッカー
    • 話題の動画
    • はてなブログ(エンタメ)
  • アニメとゲーム
    • 人気
    • 新着
    • マンガ
    • Webマンガ
    • ゲーム
    • 任天堂
    • PlayStation
    • アニメ
    • バーチャルYouTuber
    • オタクカルチャー
    • はてなブログ(アニメとゲーム)
    • はてなブログ(ゲーム)
  • おすすめ

    WWDC25

『qiita.com』

  • 人気
  • 新着
  • すべて
  • イマドキのJSテスト - テスト環境をモダンフロントエンドツール群で整備する編 〜 JSおくのほそ道 #032 - Qiita

    8 users

    qiita.com/setzz

    こんにちは、ほそ道です。 今回はビルドツール・モジュールローダ・altJS(JSコンパイラ)を組み合わせてさらにテストコードのおくのほそ道に入り込んでいきます。 今回Gulp + Webpack + Karma + Jasmine + ES6を使用しますが、 GruntだったりBrowserifyだったりMochaだったりCoffeescriptだったりに置き換えても基本的な考え方は近しい感じになるかと思います。 あとはここにSPAフレームワークとかを組み合わせればいよいよモダンなテストコードになっていきますね。 目次はこちら 今回解決すること・設計方針 Webpackとテストコードを組み合わせる。なんかバンドルしたりごにょごにょやってるどこにテストを挟むのか?を解決する。 ソースコードもテストコードもES6で書く。babelないしはaltJSのコンパイルごにょごにょやってるどこにテストを

    • テクノロジー
    • 2015/06/01 10:43
    • モジュール管理、だけじゃない-Webpack入門 〜 JSおくのほそ道 #029 - Qiita

      38 users

      qiita.com/setzz

      Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

      • テクノロジー
      • 2015/05/22 12:57
      • webpack
      • javascript
      • JS
      • dev
      • あとで読む
      • [Node.js] イベントループの仕組みを探る 〜 JSおくのほそ道 #002 - Qiita

        5 users

        qiita.com/setzz

        こんにちはほそ道です。 今回はイベントもといイベントループを取り上げてみます。 目次はこちら イベント駆動処理の作成 とりあえず作ってみよう 設計と実装 ほそ道は毎週ボウリングに行くのですが、 自宅やオフィスにボウリングレーンがあったら夢のようだ。。 という夢をかなえる為に ボウリングレーンを実装 してみました。 ストライクやガターの発生をイベントとして検知したら ディスプレイになんやかんや表示するという感じのシロモノです。 雰囲気を出す為にconsole.log関数をレーンのディスプレイに見立ててみました。 ちなみに見やすさ重視のためメモリ効率等はいっさい考慮してません。 var EventEmitter = require('events').EventEmitter; // define Lane function Lane01() { this.display = console.

        • テクノロジー
        • 2015/02/01 01:23
        • node.js
        • javascript
        • https://qiita.com/setzz/items/3b16b3646ef231c3aeb9

          6 users

          qiita.com

          • 学び
          • 2015/01/09 14:38
          • JavaScript
          • [Node.js] モジュール&npmのキホン 〜 JSおくのほそ道 #003 - Qiita

            6 users

            qiita.com/setzz

            Node.jsではrequire('モジュール')という文法を使って機能拡張を行います。 ブラウザのJSでは<script>タグを使って外部JSを読み込んで利用する事ができますが、 こちらは外部ファイルを読み込んで使用するにはrequireを使用します。 組み込みでいくつかの コアモジュール と呼ばれるモジュール群が提供されています。 コアモジュールはインストール後はビルド済みのバイナリになっており、 いままでの記事で登場したfsやeventsはコアモジュールです。 ソースや一覧を確認する場合はgithubの./libを参照しましょう。 その1:簡単なサンプルモジュールのロード 早速、自作のモジュールを作り、ロードしてみようと思います。 下記のような構成です。main.jsがnode_modules/my_math.jsをロードします。

            • テクノロジー
            • 2015/01/07 20:16
            • Node.js
            • javascript
            • 体で覚えるVue.js - ディレクティブ編 〜 JSおくのほそ道 #023 - Qiita

              7 users

              qiita.com/setzz

              こんにちは、ほそ道です。 今回も引き続きVue.jsのディレクティブを体で覚えます。 前回のビューモデル生成編同様、シンプルなサンプルに沢山触れる事でどんな道具があるのかをバンバン体験していくスタイルでやってまいります。 ViewModel生成編 ディレクティブ編 [インスタンスメンバ編] (http://qiita.com/setzz/items/ebbfcc3565bcd27f344c) [グローバルメソッド編] (http://qiita.com/setzz/items/8f06f2fe6049173b17f9) [フィルター編] (http://qiita.com/setzz/items/e37c47d3f22e5738eb84) [v-repeatネスト編] (http://qiita.com/setzz/items/6f22ebd15bcc0afe1ab0) 全体の目次はこちら

              • テクノロジー
              • 2014/11/02 12:25
              • Vue.js
              • JS
              • 後で読む
              • プログラミング
              • JavaScript
              • 体で覚えるVue.js - v-repeatネスト編 〜 JSおくのほそ道 #027 - Qiita

                5 users

                qiita.com/setzz

                Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                • テクノロジー
                • 2014/10/16 02:55
                • Vue.js
                • javascript
                • 体で覚えるVue.js - ViewModel生成編 〜 JSおくのほそ道 #022 - Qiita

                  48 users

                  qiita.com/setzz

                  こんにちは、ほそ道です。 今回はMV**なフレームワークのひとつであるVue.jsを取り上げてみます。 さて、どこから手をつけたら良いものかと思案にくれた結果、序論や諸注意点をアレコレ展開する前にまずはビシバシと弄って、ヒジョーにシンプルなサンプルをいっぱい作って体にしみ込ませてみるのがイイんじゃないかと思いました。 ボリュームがあるので何回かに分け、今回はビューモデルを生成するパターンをまとめます。 「考えるな、感じろ」の精神でやった後にどう考え学習すべきかや、どう設計すべきかなどの私見は述べられたら良いなと思っております。 ViewModel生成編 ディレクティブ編 [インスタンスメンバ編] (http://qiita.com/setzz/items/ebbfcc3565bcd27f344c) [グローバルメソッド編] (http://qiita.com/setzz/items/8f0

                  • テクノロジー
                  • 2014/09/23 08:23
                  • vue.js
                  • javascript
                  • library
                  • 後で読む
                  • development
                  • *あとで
                  • 体で覚えるVue.js - グローバルメソッド編 〜 JSおくのほそ道 #025 - Qiita

                    6 users

                    qiita.com/setzz

                    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                    • テクノロジー
                    • 2014/09/22 12:14
                    • 体で覚えるVue.js - インスタンスメンバ編 〜 JSおくのほそ道 #024 - Qiita

                      4 users

                      qiita.com/setzz

                      Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                      • テクノロジー
                      • 2014/09/22 00:05
                      • Vue.js
                      • CoffeeScript実行環境を整える 〜 JSおくのほそ道 #020 - Qiita

                        3 users

                        qiita.com/setzz

                        こんにちは、ほそ道です。 今回からよりアジャイリーな開発を目指して、とりあえずCofeeScriptを取り上げます。 今後Yeoman/anguler.js/Synthまたはsails.jsなども取り上げながらリッチなアプリケーションをよりカジュアルに作りたいなという狙いがあり、その第一歩となります。 今回は文法的な所はスルーします。実行方法とコンパイル、その為の環境構築を取り上げます 目次はこちら Coffeeを飲んでみた理由 TypeScript/Scala.js/PureScriptも少し触ってみましたが下記の3点を評価基準にしたときに一番良いかなーと思いました。 短く書けそう 小回りが効き、他ツールと連携の選択肢もある コンパイルされたJSが見易く、ファットにならない 変換後のJSコードのグッドパーツな感じを見たい TypeScriptはJS拡張的な位置づけの為、元のJSがイケてな

                        • テクノロジー
                        • 2014/09/17 12:18
                        • あとで読む
                        • [Node.js] Socket.ioで双方向通信チャットアプリを構築 〜 JSおくのほそ道 #005 - Qiita

                          10 users

                          qiita.com/setzz

                          // 1.モジュールオブジェクトの初期化 var fs = require("fs"); var server = require("http").createServer(function(req, res) { res.writeHead(200, {"Content-Type":"text/html"}); var output = fs.readFileSync("./index.html", "utf-8"); res.end(output); }).listen(8080); var io = require("socket.io").listen(server); // ユーザ管理ハッシュ var userHash = {}; // 2.イベントの定義 io.sockets.on("connection", function (socket) { // 接続開始カスタムイベン

                          • テクノロジー
                          • 2014/09/08 19:24
                          • socket.io
                          • node.js
                          • JavaScriptのプロパティディスクリプタ 〜 JSおくのほそ道 #019 - Qiita

                            3 users

                            qiita.com/setzz

                            Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                            • テクノロジー
                            • 2014/08/07 17:40
                            • JavaScriptのGetter/Setter 〜 JSおくのほそ道 #018 - Qiita

                              9 users

                              qiita.com/setzz

                              Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                              • テクノロジー
                              • 2014/08/05 12:28
                              • javascript
                              • あとで読む
                              • DOMイベントのキャプチャ/バブリングを整理する 〜 JSおくのほそ道 #017 - Qiita

                                5 users

                                qiita.com/setzz

                                こんにちは、ほそ道です。 今回はDOMネタです。 イベントのキャプチャとバブリングについて覚書をまとめて参ります。 また今回はv8での検証であり、レガシーなIEは対象外です。 レガシーなIEはイベント設定メソッド自体が違いますのでご注意くださいませ。 目次はこちら 入れ子なDOMのイベント発生順序制御 DOMが入れ子構造になっていてそれぞれにイベント(例えばClickイベント)が設定されていた場合 「このように動いてほしい」という期待はケースバイケースであると思います。 期待通りの処理になるようカッチリ制御しちゃいましょう。 addEventListenerの第三引数「useCapture」 例えば下記の様なHTMLがあったとします。 body内にdivが入れ子になっておりそれぞれにClickイベントが登録されています。 <html> <head lang="en"> <meta char

                                • テクノロジー
                                • 2014/07/26 18:50
                                • JavaScript
                                • [Node.js] Webサーバ+アプリ構築が速すぎる件 〜 JSおくのほそ道 #004 - Qiita

                                  3 users

                                  qiita.com/setzz

                                  Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                                  • テクノロジー
                                  • 2014/07/23 20:33
                                  • *programming
                                  • javascript
                                  • Javascriptのbind関数と部分適用 〜 JSおくのほそ道 #015 - Qiita

                                    3 users

                                    qiita.com/setzz

                                    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                                    • テクノロジー
                                    • 2014/07/15 11:04
                                    • あとで試す
                                    • プログラミング
                                    • javascript
                                    • Javascriptのcall/apply関数のプロっぽい使い方 〜 JSおくのほそ道 #014 - Qiita

                                      120 users

                                      qiita.com/setzz

                                      Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                                      • テクノロジー
                                      • 2014/07/10 11:43
                                      • javascript
                                      • apply
                                      • call
                                      • 014
                                      • function
                                      • プログラミング
                                      • tips
                                      • pocket2twitter
                                      • this
                                      • jQueryセレクタの仕組み 〜 JSおくのほそ道 #011 - Qiita

                                        3 users

                                        qiita.com/setzz

                                        こんにちは、ほそ道です。 今回からjQueryを操る際には書かせない「jQueryもとい$変数」にディープに迫ります。 対象バージョン:jQuery-2.1.1 目次はこちら 前提の共有 下記の内容はここから先に進む上での前提とします。 当ブログ内での便宜的な呼び方 jQueryでアクセス出来る変数の事を「jQuery関数」と呼びます jQuery関数の戻り値を「jQueryインスタンス」と呼びます jQueryインスタンス[number]でアクセス出来る要素群を「コレクション」と呼びます。 予備知識 $とjQueryは同じものです jQueryインスタンスはArrayに見えますが独自のObjectです。 jQuery関数の実行パターン jQuery関数は第一引数の内容によって、その挙動が大きく変わります。 第一引数ベースで挙動を簡単にまとめました。 第二引数はほぼ省略可能で、ここでは端折

                                        • テクノロジー
                                        • 2014/06/27 23:20
                                        • jQuery
                                        • jQuery拡張の仕組み 〜 JSおくのほそ道 #013 - Qiita

                                          14 users

                                          qiita.com/setzz

                                          Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                                          • テクノロジー
                                          • 2014/06/27 23:08
                                          • jQuery
                                          • Javascript
                                          • あとで読む
                                          • JSおくのほそ道 #000 [IndexPage] - Qiita

                                            24 users

                                            qiita.com/setzz

                                            ご挨拶 じぇいえすや 嗚呼じぇいえすや じぇいえすや 初めまして! JavaScript街道600里を歩きながら、その中で生まれた発見や探求を詠み上げます。 テーマはとしては 「JavaScript基礎のその奥へ!」 を掲げてやって参ります。 単なる概要紹介と手順ではなく、一歩掘り下げた検証や考察を入れつつ 裏側(ソース)はなるべく見て周り、 「どのようなアーキテクチャによりそのモノが動いているのか」 もチェックしながら進めていきたいと思います。 Index 1つのトピックで1~10位の投稿を予定しています 順不同に書き進めます もはや常識!?NodeJSの基本 非同期型イベント駆動とは イベントループの仕組みを探る モジュール&npmのキホン Webサーバ+アプリ構築が速すぎる件 Socket.ioで双方向通信チャットアプリを構築 ビルドツールの骨身に迫る Gruntとの上手な付き合い方

                                            • テクノロジー
                                            • 2014/06/25 06:17
                                            • JavaScript
                                            • grunt
                                            • js
                                            • node.js
                                            • qiita
                                            • jquery
                                            • [Node.js] 非同期型イベント駆動とは 〜 JSおくのほそ道 #001 - Qiita

                                              4 users

                                              qiita.com/setzz

                                              目次はこちら こんにちはほそ道です。まずはNode.jsからやって参ります。 とりあえずNode.jsから手を付ける理由 最近、Webページ向けJSライブラリをダウンロードしたり、ちょっと使ってみよっかなみたいな時でも 「npm」でインストールせい 「Grunt」や「gulp」によってビルドやコンパイルせい と言われる事が多くなってきたように感じます。 しかし、公式手順に沿っても実行環境やバージョン違いによりエラーになる事も少なくなく 手順に書かれているコマンド内容をある程度理解していないと 対応も手順にそったウッスい感じになり、ハマってしまう事も多いです。。 よってサーバサイドJSのなかでも特にNode.jsはもはや常識としてとらえ、 「Node.jsってどういう仕組みで動くの?」の 基本は押さえておこうと思った次第です。 Node.jsのアプローチ Node.js(v0.10.26)イ

                                              • テクノロジー
                                              • 2014/06/13 09:48
                                              • node.js
                                              • gulpとの上手な付き合い方 〜 JSおくのほそ道 #007 - Qiita

                                                4 users

                                                qiita.com/setzz

                                                こんにちはほそ道です。 前回はGruntを掘り下げてみましたが今回は別のビルドツール gulp を取り上げてみます。 複数扱う事で理解や幅が広がりますしね。 最終的には2つを対比したいと思いますので、前回同様に概要を探り、サンプルを作り、アーキテクチャを掘り下げてみたいと思います。 バージョンは下記です gulp version 3.6.2 CLI version 3.6.2 目次はこちら gulp概要 gulpはどういう特徴があるんですかね? 読みは「ガルプ」のようです。「グイグイ飲む」という意味らしいです。 gulpのgithubを見てみるとgulpは 「The streaming build system」 らしいです。streamingの部分がちょっと何言ってるかわかりません。 gulpサイトを見ると下記のような売り文句ですね。 「速い、高品質、習得が楽」 のような事が書いてありま

                                                • テクノロジー
                                                • 2014/06/07 18:54
                                                • Gruntとgulpを比較 〜 JSおくのほそ道 #008 - Qiita

                                                  3 users

                                                  qiita.com/setzz

                                                  こんにちはほそ道です。 前々回のGruntと前回のgulpにてそれぞれの基本構造を掘り下げてみたので 2つを対比した感想を述べてみたいと思います。 なお、ほそ道の独断と偏見により書き連ねて参りますので いずれかのツールのファンの方はお気を悪くされないでくださいませ。 目次はこちら 概念図から比較する Grunt gulp 結論、短時間での概念習得に関してはgulpの方が理解し易く、その気になればカスタマイズなども重くなく出来そうです。 gulpは手続型っぽくgulpコマンドのgulp.js内で何となくのシーケンスが把握できます。 図の単純な作成時間は「どうやってまとめよっかなー」的な検討時間も含め Gruntは4時間ほどかかり、gulpは2時間ほどでした。 Gruntの方がオブジェクト指向的な抽象化が多く細かな責務を分担しており、読み解きに手こずったのが原因かと思います。 ただ、更に理解を

                                                  • テクノロジー
                                                  • 2014/06/07 18:54
                                                  • jQueryを使うべきところ 〜 JSおくのほそ道 #009 - Qiita

                                                    5 users

                                                    qiita.com/setzz

                                                    「jQueryいつ使うの!?」 「今でしょ・・・?」 こんにちはほそ道です。 というわけで今回からjQueryに取り組みます。 ですが、いきなり飛びつかない! まずはライブラリを疑うところからはじめていきたいと思います。 昨今、とりあえずサイトにjQuery入れとけ的なアプローチだったり ネイティブJSで書ける処理をわざわざjQueryで書いているような開発者を目にする事があります。 あえて始めに言わせていただきたい! JSライブラリを使う事のメリット/デメリットを強く意識しましょう! ライブラリ使う前にネイティブJS書けるようになりましょう! 目次はこちら jQueryとは? いつものごとく公式ページから拝借・意訳します。 高速・軽量・リッチなJavaScriptライブラリ。 様々なブラウザ環境で簡単なAPIからイベントハンドリングやアニメーションやAjaxがうまいこと実現できる。 多彩

                                                    • テクノロジー
                                                    • 2014/06/07 18:54
                                                    • jQuery
                                                    • js
                                                    • javascript

                                                    このページはまだ
                                                    ブックマークされていません

                                                    このページを最初にブックマークしてみませんか?

                                                    『qiita.com』の新着エントリーを見る

                                                    キーボードショートカット一覧

                                                    j次のブックマーク

                                                    k前のブックマーク

                                                    lあとで読む

                                                    eコメント一覧を開く

                                                    oページを開く

                                                    はてなブックマーク

                                                    • 総合
                                                    • 一般
                                                    • 世の中
                                                    • 政治と経済
                                                    • 暮らし
                                                    • 学び
                                                    • テクノロジー
                                                    • エンタメ
                                                    • アニメとゲーム
                                                    • おもしろ
                                                    • アプリ・拡張機能
                                                    • 開発ブログ
                                                    • ヘルプ
                                                    • お問い合わせ
                                                    • ガイドライン
                                                    • 利用規約
                                                    • プライバシーポリシー
                                                    • 利用者情報の外部送信について
                                                    • ガイドライン
                                                    • 利用規約
                                                    • プライバシーポリシー
                                                    • 利用者情報の外部送信について

                                                    公式Twitter

                                                    • 公式アカウント
                                                    • ホットエントリー

                                                    はてなのサービス

                                                    • はてなブログ
                                                    • はてなブログPro
                                                    • 人力検索はてな
                                                    • はてなブログ タグ
                                                    • はてなニュース
                                                    • ソレドコ
                                                    • App Storeからダウンロード
                                                    • Google Playで手に入れよう
                                                    Copyright © 2005-2025 Hatena. All Rights Reserved.
                                                    設定を変更しましたx