開発中の SPA ベースのアプリにおいて「API 呼び出し時、サーバでセッション切れを起こしていた場合は、フロント側でエラーメッセージを表示した後ログイン画面へ遷移させる」という処理が正常に動いていないという、以下のような指摘を受けた。

• セッション切れの際は認証プロキシがレスポンステータス 302 を返している
• フロント側で 302 をキャッチした時の分岐が書かれていないため処理が止まっているのでは？

Code Splitting と非同期コンポーネントを案件（と趣味プロで少々）で使用したのでメモっておく(webpack + TS + Vue3 / React で使用)

• Enum の代わりに union 型を使おうという風潮があるらしい
• TypeScript v3.4 から使えるconst assertionを用いると、使い勝手を損なわず Enum の代わりに union 型が使えるらしい

Redux Toolkit の AsyncThunk をさわってみる のつづき。

EntityAdapter とは

• createEntityAdapter | Redux Toolkit
• NgRx メンテナによって作成された@ngrx/entity ライブラリから、Redux Toolkit に移植された API
• Redux Toolkit v1.3.0 で追加された
• https://github.com/reduxjs/redux-toolkit/pull/374
• エンティティ操作用のアダプターを生成してくれ、CRUD(create, read, update, delete)操作の機能を提供してくれる

Redux Toolkit をさわってみる のつづき。createAsyncThunk とは

• Redux Toolkit の機能の 1 つで、Redux Toolkit v1.3.0 から使える
• 非同期処理に対応した ActionCreator を生成する関数

Redux Toolkit とは

• Redux を使いやすく簡素なものにするために作られた公式のヘルパーライブラリ
• Redux Style Guideでも利用を推奨している
• TypeScript 製のためコード補完が効き TypeScript との相性がよい
• reducer と state をまとめて書けて action creator を書く必要がない
• immer が組み込まれてるため、状態変更ロジックを簡素にできる（immutable な状態を維持してくれる）
• Redux Thunk が標準 middleware として組み込まれている（非同期処理を書きたい時に使用する）
• Redux DevTools Extension 用の設定が不要

Node.js ベースで HTTP サーバを常時起動する方法を調べた。

PixiJS 管理下の Canvas を、Retina ディスプレイに配慮して画像として切り出す方法について調べた。

TypeScript v3.8 の新機能をざっと試しながら確認したのでメモ。

「bash やめて fish とかでターミナル環境いい感じにしたいけど、ググるとあれ入れるためにはこれ入れろとか言っててなんか面倒そうだなぁ...」とか感じた方にとっては有用な記事かもしれません。記事の手順どおり進めればとりあえずいい感じのターミナル環境が整うかと思います。

今らなら immutable で軽くて i18n にも対応してるってことで date-fns 使うのが良いのだろうけど、moment.js の i18n 対応でいろいろあったので、一応メモっておく。

• NodeでもTypeScript で書きたい
• DI欲しくなる
  • シングルトンなサービスを使いたい
  • new したくない
  • テストしやすい

リポジトリ: https://github.com/cyokodog/inversifyjs_study

AngularFireとは

• FIrebase と Angular の公式ライブラリ
• AngularJS 向け
  • https://github.com/firebase/angularfire
  • firebase 管轄
• Angular 向け
  • https://github.com/angular/angularfire2
  • angular 管轄
• 最新バージョン: 5.0.0-rc.3

Chrome DevTools 開発チームによる puppeteer なる Headless Chrome を操作するライブラリがでたので、もろもろ試したことをメモっておく。

試したやつのリポジトリ：cyokodog/puppeteer_study

マイクロソフトの画像認識APIの Computer Vision API を試してみた。API そのものより

• 「getUserMedia で動画を得る」->「スナップショットを取る」->「APIへアップロード」

って部分が勉強になったのでメモっておく。

typicode/json-server: Get a full fake REST API with zero coding in less than 30 seconds (seriously)

JSON Serverの特徴

• コードの記述なしにモックサーバをたてれる
• JSONファイルを1つ準備すればOK
• CRUD対応
• クエリでいろんなフィルターやソートなどを指定ができる

Headless Chromeのリリースをうけて、PhantomJS のメンテナーが開発の終了を宣言したりとか、ちょっと話題になった Headless Chrome について試してたことをメモっておく。

試したやつのリポジトリ：https://github.com/cyokodog/headless-chrome

zone.js と async / await を併用すると面倒な非同期処理を楽して書けそう... ということで、ここ最近これらについて試してたことをメモっておく。

リポジトリ：https://github.com/cyokodog/zone_study

• 案件のモック環境の一部で使った
• 静的サイトジェネレータのデータ管理に使ってみてる

最近使ってるエディタ（特にこだわりはない）

• VSCode ... コード書く時（70%）
• Sublime Text ... 文章書く時、重い時（25%）
• vi ... ちょっといじる時（5%）

Google Cloud Speech API とは

• Googleの音声認識エンジン
• Speech Recognition API の Cloud サービスみたいなやつ

入社面接の LT で使った Media Capture and Streams と Web Audio API を連動させたデモが動かなくなってたので調整してみた。その時に必要になった GitHub を複数アカウントで利用する方法をメモっとく。

任意のスクリプトを定期実行して、標準出力結果を Mac OS Xのメニューバーに表示してくれるアプリ「BitBar」を試してみました。

ちょっと前の社内勉強会で紹介されてた Angular CLI を試してみた。

手抜きタイトルのはじめてシリーズ３つ目。近頃、耳にすることの多いRiot.jsをさわってみました。

前回書いたReact.jsのコードをfacebook/fluxで書きなおしてみます。前回同様、ほぼ殴り書きです。

過去にブクマしてたFlux関連の記事を一気読みする機会があったので、その流れで今までノータッチ状態だったReact.jsもさわってみました。 りぃさんのCodeGridの記事（これから始めるReact.js 全６回 | CodeGrid）が一段落ついたので、これを見つつアレンジしつつやってみます。

このブログを運用してたクラウドサービスが吸収合併？かなんかした影響ですべての記事がクラウド上のMySQLに永眠することになってしまい、 あちらこちらでキャッシュをひろっては、作りかけだった静的サイトジェネレータでホスト先を移行したりとせわしなくしていた今日このごろです。 そんなわけで「Angular2やるぞ！」と１ヶ月ほど前に書いたAngular2のコードも確実に忘れそうだったのと明日の勉強会に備え、備忘録も兼ねて記事にしとこうと思います。

Electronとは

• GitHub.inc が開発
• HTML5 で OSX, Windows, Linux のデスクトップアプリを開発できる実行環境
  • IEのHTA、Adobe AIR、NW.js(node-webkit)的な位置づけ
• Atom の実行環境としても使われいて Atom Shell と呼ばれていた
• JS の実行エンジンとして Node.js、HTML5 の実行環境として Chromium を使用
• ビルドしたアプリには Chromium が内蔵されるので特別なインストールは不要。スタンドアローンアプリとして配布可。

なにを作る？

• HTML5 のグラフィック・サウンド系技術を使用したなにか
• こどもがネットでタイピングゲームやるのでそれを題材にする

Wunderlineとは

• Wunderlistを操作するコマンドラインツール

前回のエントリではマイク経由の音声認識を行う Speech Recognition API を試しましたが、今回はカメラ・マイクからの動画・音声キャプチャを行う Media Capture and Streams を試してみます。 また、キャプチャした音声の録音については MediaStream Recording を使用することで可能ですが、現時点（2015年4月）では Firefox にしか実装されていません。 そこで Web Audio API を使用することで他のブラウザでも音声録音を可能にし、それらの音声データを wav 形式で保存する方法についても試してみました。

HTML5 の Web Speech API をご存知でしょうか？ ブラウザベースで音声認識とテキストの読み上げを実現する API です。 今回はこの Web Speech API について試したことをまとめてみました。 ちなみに少し前の Chrome では Speech Input API という INPUT 要素に x-webkit-speech という属性を記述するのみで、手軽に音声認識を実現できるという機能がありましたが現バージョンでは廃止されてるようです・・・
Web Speech API の対応ブラウザは Can I Use よりご確認ください。

みなさん、日々の勉強で得たナレッジはどこに記録されてますか？
自分の場合、少しでも気になって調べた事はとりあえずマークダウンで記述してテキストファイルに保存してます（閲覧は HTML 形式に変換したドキュメントをロカール web サーバや Bitbucket 越しに参照してます）。 そんな調子で気軽にメモしてくと情報量がすぐに増えてしまうので、見出し要素ごとにカテゴライズされたコンテンツに素早く移動するための TOC（目次メニュー）は欠かせない機能です。
今回はこの目次メニューの実装方法について考えてみました。

HTML5 の Web Audio API の存在をご存知でしょうか？ 購読してる専門誌でも紹介されてるのを見かけた記憶がなかったのでよく知らなかったのですが、検索してみると興味深い記事が結構目につきます。 CANVAS や WebGL など見た目系機能が注目されがちな HTML5 ですが、音声方面も面白いかなという事で、今回調べたことをまとめがてら紹介してみたいと思います。

Node.js といえば発表された当初、イベント駆動、ノンブロッキングI/O、スケーラブルネットワークブログラミング、といった部分が注目され非常に話題になりました。 フロントエンド技術の興隆目覚しい昨今においては、Sass や CoffeeScript のコンパイルを自動化する Grunt や Gulp といったタスクランナーを動かすための開発環境インフラとして大きな役割をはたしています。
今回はそんな node.js の基本的な利用方法についてまとめてみました。

AngularJS は、クライアントサイド MVC フレームワークの１つですが、自身のことを MVW フレームワークと呼んでます。 これは Model-View-Whatever の略で 「MV＊について議論するなんて時間の無駄、そんな暇あるならコード書きなよ。MV＊の＊の部分なんて”Whatever”でいいんだよ。」 という思いが込められてるそうです・・・いかしてますね！
という訳でコードを書きながら AngularJS を紹介したいと思います ^^;

MVC と言えば Apache Struts をはじめとするサーバサイド・フレームワークを想像しますが、 今回は JavaScript による大規模開発の際に採用されるクライアントサイド MVC フレームワーク「Backbone.js」の使い方についてまとめてみました。 (厳密にはクライアントサイドの場合、MVC とは呼ばず MVVM とか MV* とか呼ばれてるようです。)

こんにちわ、就活の面接がいつの間にか雑談ぽくなりがちな cyokodog です。 普段できないプログラムの話とか、異業種の現場の話とか聞いたりできるのってすごい楽しいものですね！(お時間とらせてしまってすいません^^;)
今回はそんなコミニケーションを取りながら、皆でわいわい開発するのが当たり前の時代がきたらいいなぁ… そんな思いを込めて、ソーシャルコーディングを可能にする WEB サービス GitHub の利用方法についてまとめてみました。

こんにちわ、2015年3月をもって所属会社が解散することになってしまった CYOKODOG です（悲） ただいま絶賛就活中、当方にご興味ございましたらお声かけのほどよろしくお願い致します ^^;
そんな背景もあり過去の資料を整理することも多々ありまして、今回は昔懐かしい JavaScript の prototype 周りについて自分なりにまとめてみました。

Easy Code Prettify は、Ex Code Prettify(その場で編集／実行できるシンタックスハイライター jQuery プラグイン)を簡易的に実行することができる jQuery プラグインです。 クラス名等の HTML 属性値によるパラメータ指定を必要としないため、マークダウン形式でブログを書いてる場合等に利用すると便利です。

その場で編集／実行できるシンタックスハイライター jQuery プラグイン Ex Code Prettify をバージョンアップしました。

うちの小３男子はスケボーが趣味なのですが、この度念願の「ダウンレールでのバックサイドボードスライド」という技を習得することができました！ 開発者ブログをうたっときながら、相変わらず興味のない人にはなんのことやらという内容ですが、ついにきた！という思いがあまりに強かったので記念に動画を載せさせて頂きます。 親バカと思って許してください（笑）

Twitter カードってご存知でしょうか？ツイート内に URL が含まれている場合、そのページのタイトル、概要、アイコン写真なども一緒に表示してくれる機能です。 これは前回のエントリ「WordPress 製のブログを OGP(Open Graph Protocol) に対応させてみた」で紹介した OGP の Twitter 版の機能にあたります。OGP の対応が済んでいれば簡単な手順で対応させることができます。

OGP ってご存知でしょうか？Open Graph Protocol の略で、「このウェブページは、こんな内容です」ということをプログラムに対し正しく伝達するための仕様だそうです。どんな時に活用されるかというと、Facebook や Google+ 等で OGP が記述されたページがシェアされた際、この OGP の情報をもとにフィードに表示する画像やコンテンツの概要を載せてくれるようになります。

Fage Page はフェード効果を使ってふわっとページ切替を行えるようにする jQuery プラグインです。各ページに CSS と JS ファイルを読み込むのみで適用されます。
jQuery Sitekit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

ネットで見つけたプログラムの TIPS などはなるべく実践を心がけてるんですが、やはりブログ等に残しておかないとすぐに忘れてしまうなぁ と感じてる今日この頃です。そんな訳でなるべく細いネタでもちょくちょく投稿してこうかと思います。
で、今回はページからページへ遷移する際、フェードイン／フェードアウトを使って「ふわっ」とページを切り替える方法について考えてみました。

久しぶりのプログラム関連のエントリーです。
表題の「サイドメニューを一定範囲で固定表示」って意味通じますでしょうか？ 画面スクロール時、サイドメニューが上部に流れきって消えてしまわないように途中から position:fixed で位置固定して、フッターにかぶる位置にきたら位置固定を解除するＵＩのことです。あの有名な LIG さんや痛いニュースでも採用されてるデザインです。
このちょくちょく見かけるＵＩのかゆいとこを解消した jQuery プラグインを紹介します。

皆様、今年の夏はいかがお過ごしでしたでしょうか？
うちでは夏といえば子供と一緒にプールに海にスケボーにと、プログラマーらしからぬ肌の色になるまで外で遊びつくすのが恒例ですが、今年は小３がママさんの怒りを買いまくりーので外出禁止でインナープレイに終始しました。
そんなわけで、夏休み前から始めたチョッパー・フィギュアの製作活動にも精を出す結果となり、この度、無事完成させることができましたのでお披露目いたします。

昨年の暮れ、ウォーズマン・フィギュアを作り始めた頃、子供にせがまれて「７人の悪魔超人編」の絵も同時並行で書き始めました。その後、フィギュア製作もお絵かきの方も途中であきてずーと放置状態だったわけですが、 二ヶ月程前に奮起してフィギュアを無事完成されることができました。絵の方も中途半端は子供の教育上良くないなーという事で、こちらの方も今回完成させてしまいました。

フィギュア製作は作業場所が石膏粘土で汚れるので、きれい好きなママさんに見つかると激怒される恐れがあるので夜な夜なこっそり作っています。
なので現物をお披露目できる相手はオーバーリアクションで褒めてくれる心優しい職場の方々だけな訳ですが、先日、珍しく飲み会を催すという話があり、そこでぜひ完成したラーメンマンをお披露目したく、急遽１～２時間程度で塗装まで仕上げましたので、こちらでもお披露目したいと思います。

前作のウォーズマンに引き続き二作品目となる自作フィギュアは、ラーメンマンです！
当時の小学生のトラウマになった？という、脳みそグッサリやられて植物人間になってしまうウォーズマン戦のラーメンマンを意識して作ってみました。

管理者向け画面などで、画面下部にコマンドボタンを配置した際、画面に表示するデータ量が多いとコマンドボタンが画面の表示枠内に収まらず不便に・・・かと言って position:fixed で固定表示すると、データ量が少ない場合に不格好に見えてしまう・・・そんな経験は無いでしょうか？
Fitbar は、ツールバーやナビゲーションメニューを画面のスクロール位置に応じ上部又は下部に固定表示させることができる jQuery プラグインです。 jQuery Sitekit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

皆さん、Google の写真共有サービス「Picasa」をご利用でしょうか？ 2048×2048ピクセル以下の画像であれば容量が実質無制限であることもあり、自分の場合、ブログの掲載写真等に使用してます。
Picasa Zoom は Picasa で管理された写真の拡大／縮小を簡単に行うことできる jQuery プラグインです。 jQuery Sitekit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

ソーシャルボタンを表示する jQuery プラグイン Easy Social Buttons と ソーシャル系サービスの共通 API を提供する Social Info で Google+ の共有数を表示、取得できるようにしました。
サーバサイドのプログラムは不要です。

前回、約半年かけて（そのほとんど放置期間でしたが）作り上げたウォーズマンの造形をお披露目しましたが、重い腰を上げやっと塗装に取り掛かりました。実質三日程度の作業でしたが、とりあえずそれなりに満足のいく出来栄えになったのでお披露目します。

社内ＳＥなどという仕事をしていると「システムでいちいち条件指定してデータとるのメンドイから、エクセルにまとめてメールで送ってよ！」などと言われる事がちょくちょくあります（自分だけ？）。そんな時は dqy ファイルを使用し SQL の実行結果をエクセルに出力させてます。テキストファイルにＤＢ接続情報と SQL を書くだけで良いとってもお手軽＋おすすめ Tips をご紹介いたします。

mailto:～ と記述されたリンク要素をクリックするとメールクライアントの作成フォームが起動されるのはご存知でしょうか？Web メールが主流な昨今あまり見かけなくなりましたが、宛先や本文を指定することでメールテンプレートとしも利用できるので、企業内システムなどで活用すると結構便利かと思います。
Mailto は、そんな mailto リンク機能を利用しやすくする jQuery プラグインです。 jQuery Sitekit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

携帯のメールアドレスで Google グループ（メーリングリスト）に参加したら、「なりすまし」と判定されメールが届いてこないといった経験はないでしょうか？
携帯キャリアのセキュリティレベルの設定を変更することで大抵は解決できますが、メンバーが大勢いたり、ＩＴに詳しい人が少ない場合、この作業が結構面倒だったりします。
今回、Gmail と Google Apps Script（GAS） を使用し、この問題を回避させる事ができたので手順をご紹介します。

昨年の暮れぐらいから何故かキン肉マンにはまりだした我が家の小３男子、「フィギュア探しの旅」でも目当てはキン肉マン関連ですが、旬でない作品を探すのは一苦労です。 実際、どれだけ種類があるのかとネットで検索してみると、なんと自作でしかもかなりのクオリティの「ザ・ニンジャ」のフィギュアを作ってる人を発見！
しかも、材料は百円ショップで揃えられるものばかり・・・とくれば自分も試さないわけにはいきません！（笑）

塗装はまだしてませんが、今回なんとかそれなりの形にすることができたウォーズマンをお披露目したいと思います！

ゴールデンウィーク、当初はディズニー行こうとか、登山行こうとかいろいろ言ってましたが、結局またまたアキバでのフィギュア探しになりました。 ママさんと小３男子のフィギュア熱はまだ冷めてないようです。 今回は二度目となる浅草で遊んで、徒歩で浅草→上野→秋葉原と移動しました。

Easy Social Buttons は、はてブ、Twitter、Facebook、Google+ のソーシャルボタンをシンプルなデザインで表示することのできる jQuery プラグインです。各サービスが提供しているソーシャルボタンより動作が軽いので投稿記事一覧画面などで大量にボタンを表示したいような場合に向いています。jQuery Sitekit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

このブログは PaaS の AppFog のフリープランで動かしてるのですが、先日、フリープランのサービス縮小の通知がありました。念のため WordPress が動く目ぼしいところが他にないか探したところ、OpenShift が 「無料、広告なし、独自ドメイン対応、Git でアップロード」といった感じで良さげでした。
そんな訳で OpenShift で WordPress を使用する手順をまとめてみました。

前回のエントリで作成した Struts2 のサンプルプログラムのデモを Openshift、AppFog、Heroku といった Java の動く PaaS で公開できないかなぁとちょっと調べてみたのですが、Eclipse で開発したらその場でポンっとデプロイできる Google App Engine が一番手軽でいいんじゃないか・・・と言うことで約４年ぶりに Google App Engine をさわってみました。
そんな訳で Google App Engine for Java の導入手順と合わせ、Struts2 のデプロイ手順もまとめてみました。

オラクル管理下になって以降めっきり話題が減った感のある Java ですが、最近、隣の席の新人 SE さんが研修で Struts2 ベースの Web アプリを構築をしてるようで、時々質問を受けたりします。Java と言えば Struts に次ぐ定番フレームワークが長らく待望されてましたが、結局どうなったのでしょう？
Struts の冠のある Struts2 がネーミング的には有利な気もするので便乗して勉強してみることにしました。

Social Info は、はてなブックマーク数や Twitter のつぶやき数などを取得するソーシャル系サービスの API を簡単に利用できるようにする jQuery プラグインです。独自デザインのソーシャルボタンなどを自作する際に利用すると便利かと思います。 jQuery Sitekit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

Easy Feed は、外部ドメインの RSS フィードの読み込みを可能にする Google Feed API を手軽に利用できるようにする jQuery プラグインです。 jQuery Sitekit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

年末に行ったばかりなのに、正月連休にも行ってしまった第二回アキバ・フィギュア探しの旅。
やはり今回もママさんの鶴の一声で行くことになりました。前回、目をつけてたがっちゃんフィギュアを目の前でもってかれたのが悔しかったのと、やること無くて暇だったのが主たる動機のようです。

うちには小２の男子が１名いるのですが「誕生日プレゼントなに欲しい？」って聞いたら「キン肉マンの絵」と返ってきました(笑)
家での遊びは、けん玉、コマ、お絵かき、読む漫画は、北斗の拳、Ｄｒスランプ、キン肉マン・・というある意味「昔ながら」な彼らしい回答です。

そんなわけで、会社の休憩時間と睡眠時間を削って全力でキン肉マンの絵を書いてみました。

Hash Contents は タブ、アコーディオン、ツリービュー、TOC 形式等で location.hash の変化に応じ表示コンテンツを切り替えることのできる jQuery プラグインです。

Keep Position は、ページのスクロール位置を維持したまま、フォーム送信処理やページ切替処理をできるようにする jQuery プラグインです。Ajax なんかでかっつり作り込んでらんないなぁって時に使うと便利です。

ちょっと前のママさんの誕生日、「なにが欲しー？」と聞くと即答で

「ガっちゃんのフィギュア！」

と返ってきました・・・

さっそくネット通販で調べたけどどこも品薄、いろいろ調べて楽天で見つけてなんとか注文。送料やら手数料やらで 500 円ちょいのおもちゃが 2000 円以上もかかってしまいました・・・

Keyinfo は、入力キーの種類を調べることができる jQuery プラグインです。 jQuery Utility Kit の一機能として、もしくは単独の jQuery プラグインとして使用することができます。

Ex Scroll は、スクロールイベントの開始／終了のタイミング、スクロール方向を判別することのできる jQuery プラグインです。2009 年頃に書いたプログラムですが、ちょくちょく需要があるようなのでソースの見直しも兼ね GitHub で管理するようにしました。リポジトリは jquery.utility-kit とし軽量の utility 系のプラグインはこちらで管理し追加してく予定です。

Ex Code Prettify は、Google Code Prettify をベースとしたシンタックスハイライトを行う jQuery プラグインです。ソースコードの編集／実行をその場で行う機能や、外部 CSS / JS ファイルの動的インポート機能等を使用して、jsdo.it や jsFiddle のようなライブデモ機能を自サイトに実装することができます。

皆さん、今年の夏はいかがおすごしでしたでしょうか。
うちは子供を中心にプール、クワガタ探し、スケボーと例年通りの変わり映えない夏でした。ただ唯一いつもと違ったのは、前回のエントリーでも書いたガラクタ（というか日常ゴミ）によるおもちゃ作りに家族全員が精を出してたという事です。 という訳でその後、置き場所も考えず、調子にのってさらに作りこんでしまった作品郡も載せときますのでよろしかったら見てやってください。

ガラクティストこと ゴトー孟(もう) さんをご存じでしょうか？
ペットボトルや空き箱などの日常生活で出るがらくたを使って、ハイクオリティなおもちゃを作ってしまうすごい方なのですが、先日、子供の自由研究のネタ探しに訪れた横浜こども宇宙科学館でその作品を初めて見ました。とてもガラクタでできてるとは思えない重厚感、完成度に衝撃を受けました。
そんな訳で夏休みの時間を利用し、我が家でも作ってみました。

Bootstrap が普及して以降、Bootstrap のデザインを基調とした jQuery プラグインをちらほら見かけるようになりました。 日付／時刻ピッカーの「Bootstrap Datetime Picker」もそんなプラグインの１つですが、今、仕事で開発してる Web アプリに使ってみたところ、いろいろとかゆいところがあったので、使いやすくなるようカスタマイズしてみました。

location.hash の値に応じ表示コンテンツを切り替える jQuery プラグインを作ってみました。大した処理じゃありませんが、jQuery プラグインのデモページとか作る際、複数パターンのデモがある時など毎回記述するのが面倒なのでプラグイン化してみました。ついでに location.hash のリンクリストも生成するようにしてます。

Web アプリケーションにおいて、入力項目が一画面に収まらないような入力フォームの場合、入力値の一時保存ボタンが必須になるかと思いますが、通常の作りだと保存処理後、ページスクロール位置が先頭に戻ってしまうのが悩みどころです。Ajax で実装すれば解決もできますが、もっと手軽に解決できる方法がないか考えてみました。

なにか近頃なにもやる気が起きずブログも更新してませんでしたが、ぼちぼちはじめようかなと思います。だいぶ前に作った jQuery プラグインの紹介です。大したものじゃありませんが、よかったら使ってみてください。

ソースコードをかっこよく表示してくれる JavaScript ライブラリ「Google Code Prettify」。巷では高機能な「SyntaxHighlighter」におされ気味ではありますが、シンプル仕様で見た目もかっこよくて好みです。今回はちょっと手を加えて使い勝手の方を少し改善してみました。

みなさん WordPress の投稿記事はどういう形式で入力されてますか？自分の場合、快適に Markdown 記法を使いたくてブログを転々としてることもあり、「Markdown on Save Improved」というプラグインを使い Markdown で入力してます。今回、さらなる快適編集環境を求め「Behave.js」という JavaScript ライブラリを導入してみました。

IT リテラシーがまるっきり無かった 10 年以上前、うかつにも会社のメールアドレスをまぐまぐに登録して以来、スパムメールがよく飛んでくるようになりましたｗ そんな場合、強力なスパムフィルターのある Gmail をメールクライアントとして使用することで、問題を解決することができます。
備忘録も兼ねて手順をまとめときますので、スパムメールに苦しむ同僚がいたら教えてあげてください。

前回のエントリで公開した 「WordPress のこまごました設定をまとめてできるプラグイン」に、ソーシャルボタン設置機能、他を追加しました。ソーシャルボタンは結構簡単にできるかなと思ってたんですが、個々のボタンを等間隔に揃えたりとか見た目を調整するのって面倒なんですね・・・疲れました。

ブログを WordPress にしたので折角なのでテーマもオリジナルなものを作ってみました。CSS3 も角丸ぐらいしか使ってないシンプルなものですが、少しづつ拡張してこうかなと思ってます。また変えるかもしれないので一応魚拓しておきます。（ソースはリファクタリングしてないんで見ないでほしいですｗ）

汎用性を重視したテーブルフィルタリング系の jQuery プラグインです。
実装の基本思想は以前書いた「jQuery によるシンプルなテーブルフィルタリング処理の実装を考えてみる」に基づいてます。

jQuery 1.9 になってとうとう $.browser が使えなくなってしまいましたね。 もともと非推奨ということもあり、個人的にはプラグインを実装する時などは極力使用しないようにしてましたが、実際使えなくなってしまうと、動かなくなってしまうプラグインって結構多いんじゃないかなぁって気がします。

ちょっと業務で必要になったので、jQuery によるテーブルフィルタリング処理の実装を考えてみます。
まずはなるべくシンプルで、フィルタ条件の入力フィールドとかもプラグインが勝手に生成するんじゃなくて、利用者側が準備する仕様にしたいと思います。

こんにちは cyokodog（ちょこドッグ）です。

ちょこドッグなら chokodog だろとよく言われますが、cyokodog 派（少数派）ですのでよろしくお願いします。 （サイコドッグと思われてたこともありますｗ）