KLam04

脱・積読！もっと電子書籍を活用したい。

noreply@blogger.com (ブログ) — Wed, 18 Sep 2013 03:09:00 +0000

　少し前にAmazonがKindle Fidre HDを安くしちゃうよー。的なキャンペーンがありましたがそのサービスの延長に伴い自分も買いました！タブレット端末。

　買ったひとつの理由として本は読む方なので電子書籍にしておけばかさばらないし、何かと便利じゃないかという理由。更に紙媒体の本とかもAmazonで買っていたので(もしくはBOOKOFF)アカウントもあるし、ストア直結で便利そう！と思い購入しました。

実際、どうよ。。。

　さて実際に端末が届いてアカウント設定とかやってましたが、実際本を購入してみてどうだったか。。。

　自分は積読（買っても読まず本が積み重なっている状態のこと）をやってしまうことがしばしば・・・最初パラパラ読んでみて次に行ってしまったり、仕事が・・・とか、用事が・・・・とか、明日に・・・・とかとか、何かと理由を付けて読まない時期があります。

　そんな時、Kindleならきっとサクサク行けるんだ！とか思ってた自分。甘かったです。

　結果、更なる積読が・・・

なぜ積読が発生してしまうのか！

　これはいろいろなブログやニュースにも書かれていると思いますが、まずは本が電子書籍へコンパクトへ収納されていることから視覚的に認識が甘くなることにありました。

　机とか見える位置に本があるとたまについつい読んでしまうときとかあるのですがそれがない！

　視覚的にタブレットしか見えていないのでその中にどれだけ本があるのか、更にタブレット自体をどこかに収納しているとさらに悪化します。。。。

電子書籍に慣れていないことも・・・

　次に電子書籍で本を読むことに慣れていないことも原因に挙げられます。

　当然、電子書籍を最近使うようになり使い勝手程度なら問題ないにしても今まで何十年と紙で読んできた感覚を単純に電子書籍の感覚に移せれるわけはありません。

　もうこれはなれしかないかなと。。。

電子書籍で読む習慣を付ける！

　上で少々記載していますが、もう慣れです！うんちくなどなんたら書いてもそれほど意味はなく・・・慣れです！！

　ちなみに漫画はすんなり電子書籍に慣れました。。。好きということもあるでしょうが、慣れてしまえばこちらのもの。

　あと本を読むときに電子書籍の機能を活用することも大事だと思います。

　中でも自分がよく利用する機能はページ繰りとブックマーク、目次です。

　紙の本を読むときも意識するんですが目次って結構大事です。電子書籍ならそこからそのページへ飛ぶこともできます。更にブックマークで重要ワードのページにしおりを挟んでおけばあとで読むとき便利です。

　そしてページ繰り。よくページの下に今のページが全体のどこに位置するかスクロールみたいなもので○○％とか表示してくれるものがあると思いますが、そこで一気に終わりの方へ飛んでみたり、最初から読むときに一気に戻したりと結構使ったりしてます。

　ただ最初は意識して電子書籍を読むぞ！と取り組みます。それが数日たって自分の習慣の一部にしてしまえばあとは電子書籍を有効活用できるのではないかと。

　自分も早く慣れのとこにまでいかんとかな。。。

今更な感じだけどPC用メガネ買ってみて。

noreply@blogger.com (ブログ) — Mon, 19 Aug 2013 17:44:00 +0000

　ずっと機会を伺っていたのですがとうとうPCメガネを買いました。今までは普通のメガネでフレームのデザインが気に入ったものをかけていたのですが、徐々に利用者が増えていったこと（主に私の回りに）そしてお店の前を通ったときに「あ、買ってみよう」という衝動買いをしてしまった分けです。

　ちなみ買った商品はJINS PCの一番ポピュラーなデザインで色は黒。

　http://www.jins-jp.com/jins-pc/lineup/?cat=All

　ここにあるスクエアって名前の商品です。てか櫻井翔さん着用モデルだったんだ。何やっても格好良く見える人は羨ましい。

肝心のかけ心地はどうでしょう！

　かけ心地は悪くないです！むしろいいかも。
　比較的新しい商品とあって値段の割には軽く感じ、しかも耳とか痛くなりにくい！前着用していた奴はデザインは気に入っていたんですが時々耳が痛くなるのが難点でした。。。（最終的には慣れてしまったけど）
　度入りのものを買ったんですが見え方に付いては変わらず。

　そして一番重要なパソコンを見つづけて疲れないか。というとこなんですが全然大丈夫！
　以前、知り合いの方があまり意味がない的なことを言ってました。よくよく確認するとその人は営業職なんでPCやスマホを見る機会が少ないんだと。1日トータルで1、2時間くらいだと確かに恩恵を受けるのは難しいかも。

　逆に自分のように1日中PCと対峙している人間にはかなり恩恵があるように思えます。一番は前のメガネだと朝から作業をしているとき、夜中になると片方の目に必ずと言っていいほど涙がでてくるのです。
　まぁこれは自分がドライアイがひどいってこともあるかもしれませんが。

ともかく！長時間のPCにはおすすめです。

　店頭にもWebにもうたわれていますが長時間作業をする人、毎日使う人にはおすすめですよ！自分はレンズの色を透明にしてもらっているのでブルーライト除去率は落ちていますがそれでも前のメガネに比べて快適です。
　買ったばかりのころは作業する時にメガネを交換して作業をしていたのですが、最近前のメガネが壊れたこともあり今は四六時中PCレンズです。

　ブルーライトを一番感じたときはPCやスマホではなく、夜中の街を照らしてくれる街灯でした。PCメガネと普通のメガネでこんなにも違うのかと本来とは違う場所で素の違いを体感しましたw

スタバから発売されたエナジードリンク。気になって飲んでみた。

noreply@blogger.com (ブログ) — Mon, 05 Aug 2013 03:35:00 +0000

　発売されて結構日が経ってることもあり、今更感ハンパないですがスタバから出たエナジードリンク飲んでみました。
　味は「ベリーベリーハイビスカス」です。エナジードリンクは私はモンスターエナジーを愛飲していますが、他のエナジードリンクももちろん飲みます。味の違いだったり飲んだあとのテンションだったりいろいろあって面白いですｗ
　中でもモンスターエナジーは作業が効率的にできるということで自分と相性がよさげ。
　ただ国内向けのものしか飲んでいないのでいつか本家の味を体験してみたいです！（ぶっ倒れるかな。。。
　
　あ、国内のものでもビーストアイは結構クワっときました！自分にとっては効きすぎてるかも。。。
　さて本題のスタバのエナジードリンク「スターバックスリフレッシャーズベリーベリーハイビスカス」ですが、自分の感想は「初めてエナジードリンクを飲む人には優しい味だなぁ」です。
　
※こちらからamazonで購入できます（ステマ）価格は2,880から！

　

スターバックスならではのこだわり

　コーヒーを専門にあつかってりうスタバならではというか。エナジードリンクに必須なカフェインはグリーンコーヒー（生豆）エキス由来の「コーヒー生豆抽出物」として入っています。さすがこだわりが違う！
　あと高麗人参エキスが入ってます。自分的にこの高麗人参が入ってるもの(モンスターエナジーも！)は相性がいいみたいで作業効率を上げてくれます。味に関してはもうひとつのクールライムを飲んでいないのでベリーベリーハイビスカスの感想になってしまいますが悪くはないです。
　周りに飲んだことがある人がいるので聞いてみるとエナジードリンクの独特な風味を感じる。という意見がちらほら。。。
　
　まぁ確かに高麗人参とか入ってるんでそのへんはどうしようもないのかなと思いつつ、フレーバーに使われているハイビスカスのおかげで飲みやすい印象にはなっているように思えます。

まずは試しに飲んでみてよ！

　まぁこれですね(笑)まずは飲んでみましょう！
　ちなみに自分は味も飲んだあとの効果もいい感じなのでメインをモンスターエナジーにして、ないときにこちらにしようかなという位置です。
　(職場の近くのコンビニ、モンスターエナジー置いてる率低いんですよ。。。)

　まぁ一番はこういうのに頼らず効率的に作業をすすめてたっぷりと休息をとり生活リズムを整えて。。。。でしょうけど。。。
　でも疲れたときや、どうしてもやらなければならない作業とか、乗り越えたい時間帯があるときにこういうエナジードリンクがあると助かります。
　

Webページ作成で使っているジェネレータ

noreply@blogger.com (ブログ) — Wed, 22 May 2013 04:56:00 +0000

　自分自身何が得意かとWebプログラムと答えます。それもWebデザインです。
　プログラマーという職業について最初は目に見えない。とくにDB周りの開発をやっていたのですがここ最近はもっぱらWeb開発です。
　まぁデザインといっても自分でデザインしたものはなく、エンドユーザの意見をベースに作り上げてるものなのでまだWebプログラムですね。
　ただ、Webプログラムもデザインはやるということで当然、HTMLやCSSといった開発をやっています。
　
　そんな中、自分が今使っているジェネレータをいくつか紹介したいと思います。

統一されたHTMLタグを作る。

　HTMLタグはSEOなどの視点を考慮すると結構大事な要素です。まぁ当然のことですね。
　それぞれ開発者にはテンプレートがあると思いますが、自分は専用のテンプレートは用意していません。
　最初こそ、テンプレートを持っていたのですが、コロコロ変えてしまったりしてテンプレートらしいテンプレートの使い方ができなかったのが主な理由です。
　それをジェネレータで解決させました。
　http://mizzz.jp/tg/

　ここのサイトです。ここは過去にも紹介した記事になるので詳しくはhttp://knowledge-am04labo.blogspot.jp/2012/08/csshtml.htmlから。
　このジェネレータを利用することで汎用的なタグを作ることができます。また用途に分けて、且つベースを崩さずに利用できることも利点の一つです。
　おかげでHTMLを作成する際はここから作業が進むのでテンプレートを探す手間が省けます。（まぁテンプレートの場所も統一させればもんだいないでしょうが。。。）
　
　

ボタンのジェネレータは自分と相性がいいものを

　次にボタンのジェネレータです。
　http://css-button-generator.com/

　ここを利用しているのですが、こういうジェネレータはGoogle先生に聞くとたくさん答えてくれます。
　その中で自分と相性がよさそうなものを選んで利用することが作業の効率化の一番じゃないかと思います。
　ちなみにここを利用する理由はジェネレータで作成したボタンのコードをHTML、CSS含め開発コードへ簡単にコピペできるとこです。
　他のサイトも同じような機能があると思うのですが、このジェネレータに慣れてしまったので今は他を使う気になっていません。
　用意されている色も自分好みでもありますし。

グラデーションを出したいとき

　ボタンやバーといった、ページを装飾するパーツの背景などにグラデーションのかかった色を設定したい場合は
　http://www.colorzilla.com/gradient-editor/

　ここを利用しています。
　ここはいくつかの色を使いグラデーションを作る中で光沢のあるグラデーションを作ることができます。
　またこの光沢の方向を変えたりできるので便利です。
　ちなみにここはカラーの指定をRGBだったり16進数だったりに変えることができるのでコード規約とかにも対応できそうです。
　これにも言えることですが、自分がこのジェネレータと相性がいいので重宝しています。

用意された色がない場合

　上二つで上げたジェネレータにはいくつかの色が用意されています。
　用意されている色を使っても全然見栄えよくできるのですが、中には「これじゃない」という衝動を抑えきれないときがあると思います。
　「もっといい色があるだろう」と。
　そんなときに使うのが
　http://colorschemedesigner.com/

　です。こちらも過去に紹介した記事があるのでhttp://knowledge-am04labo.blogspot.jp/2012/11/web.htmlから。
　こちらは類似色も出してくれるのでグラデーションのイメージもつかめます。
　またベースカラーを16進数で入力することも可能なので、ある程度色が固まっている場合でもすぐに使えます。

　ここまで4つ。今自分が使っているジェネレータを紹介しました。
　記事の中にもありますが、これらは相性が良かったのでいまだに使っています。
　他にも便利なジェネレータは多くありますので相性がいいものを選択できればと思います。
　これが結構作業効率上げてくれるんです。
　

仕事にメモは絶対必要！ということでNoteAnywhereが便利すぎる。

noreply@blogger.com (ブログ) — Wed, 10 Apr 2013 06:51:00 +0000

　Evernote、Googleドキュメント、Any.DO、サクラエディタ、QuickNote、、、いずれもブラウザやアプリケーション、もしくはスマートフォンアプリとして何かをメモする際に利用するアプリたちです。これらはクラウド上で同期が取れるため、扱う端末が違っても一貫性を持った情報を保持できます。

　私はこれにプラスして手書きのメモ帳としてモレスキンを愛用しています。これはらは私が仕事をする上で効率的に作業を進めてくれるデバイスになっています。

　ただ手書きのデバイスを除き、複数のアプリケーションを使っているのには一つに絞る決め手を欠いているからです。

　利用シーンには納得いってるけどデザインがいまいちだったり、デザインは惹かれるけどモバイルでは使い勝手が悪かったりと。モバイルは手書きメモがほとんどなのでほぼ利用していませんが、それでも一つに絞り切れていない現状があります。

　特にWebアプリケーションの開発をしている自分にとって、開発途中に思いついたことや注意しなければいけないことをとっさにメモしたいときには先に挙げたデバイスたちではどうしても使い勝手が落ちます。

　付箋みたいなのが欲しい！要はそういうことです。注意したい機能の画面とメモが結び付きにくい現状があったのです。

　そんな現状を打破してくれたのがChrome拡張にある「Note Anywhere」でした。

まずはインストール使い勝手を体験！

　https://chrome.google.com/webstore/detail/note-anywhere/bohahkiiknkelflnjjlipnaeapefmjbh?utm_source=chrome-ntp-icon

　ここで拡張機能はインストールできます。

　まずは一度触ってみることをお勧めします。

　機能は至ってシンプルで付箋を張り付けたい画面上で拡張機能を起動させ、メモを書いて終了です。

　一度そこへ付箋を貼っておくと後々その画面を参照した際に付箋も見ることができるので開発中の画面で忘れたくないことなどを記録することができます。

　そして機能だけでなく、カラーも自由に変更できるので自分好みの付箋が作れます。(サイズは調整できませんが。)

レビューのときに真価を発揮！

　これを一番効果的に利用できる場面は開発したWebアプリケーションのレビュー時だと確信しています。

　直接かネットを介してかは別として、アプリケーションのレビューをしてもしバグが発見された場合、新しく機能を追加してほしい要望が出た場合、仕様の認識が違ってた場合、などなどすぐにメモして残しておきたいという利用シーンにピッタリです。

手段はどうあれメモして残すことは大事。

　仕事をしていく中でメモする暇もない。とか無駄とかで記憶するだけで作業をしてしまう人はまだまだいると思います。

　「そんなん書かなくても覚えてるよ！おれかっけー」とか思ってる人は思い直したほうがいいかと思います。

　人の記憶なんて曖昧なもの。いくら簡単な言葉でも別の何かに集中してしまうとすぐに記憶の外に飛んで行っちゃいます。

　どうあってもメモというのはとても重要な作業です。そのときはいいかもしれませんが、長い目で見ると記録することはとても重要なのです。

　ですのでメモする習慣をつけて、習慣化したら次はいかに早く、また事象とリンクさせれるかを見てメモのやり方を模索してくことが作業の効率化へつながるかと思います。

GogleAppsスクリプトでガジェットをあっさり作っちゃう。

noreply@blogger.com (ブログ) — Tue, 19 Feb 2013 15:45:00 +0000

　ここ数年はphpを中心にスクリプト関係の言語を仕事で使っていたことから自分のメイン言語になってきました。当然Webアプリケーションを扱うので併せてHTMLやCSS、Javascriptも使うようになりました。（まだまだ使いこなせるとこではないですが。。。）
　そんな中、最近GoogleSitesを使ってあるページを作成するということを仕事で担当することに。GoogleSitesはHTMLを得に意識することなく、Webページが作成されるサービスで、ページ自体はあっさりとできちゃいました。
　ただ、それだけで終わるのも何か味気ない。

　仕様の中にGoogleDriveのスプレッドシートで管理している資料をWebページでも同じような一覧で確認したいという要望が。

　単純にスプレッドシートを挿入させるだけでもいいかな～なんて考えてたんですが、いざ挿入して見た目を確認してみるとあまりにも見た目が。。。。縦にも横にもスクロール。幅が大きかったり、ヘッダに当たる部分が分け合って4行目からだったり。

　。＠ω＠。。スクリプトでどうにかできないものか。。。。そうだ！Javascriptで読み込めんじゃね！！？

　かくしてGoogleガジェット作りが始まったのです！

まずGoogleSitesはJavascriptが実行できない！

　驚きました。。。マジかと（汗

　最初にスプレッドシートの情報をhtmlファイルの中でJavascriptを使って取り出すようコーディングしていたので、そのコードが使えないことにファっとなりました。

　ちなみにその時のJavascriptコードがこちらです。

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1");
var dataSource = 'スプレッドシートのURL';
var queryLanguage = 'select order by A';
google.setOnLoadCallback(function() {
var query = new google.visualization.Query(dataSource);
query.setQuery(queryLanguage);
query.send(handleResponse);
});
function handleResponse(response)
{
var el = document.getElementById('result');
if(response.isError()) {
el.innerHTML = escapeHtml(response.getDetailedMessage());
return;
}
var data = response.getDataTable();
var html = [];
for (var row = 0; row < data.getNumberOfRows(); row++)
{
var line = [];
for (var col = 0; col < data.getNumberOfColumns(); col++)
line.push(escapeHtml(data.getFormattedValue(row, col)));
html.push('<tr><td>' + line.join("</td><td>"));
}
el.innerHTML = '<table border="1"> + html.join('') + '</table>';
}
function escapeHtml(text) {
return (text || '').replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/\u0022/g, '"');
}
</script>
<div id="result">読み込み中...</div>

　このコードをbodyタグ内に記載してテーブルを作成するようにしていましたが、そのままGoogleSitesにコピペしてもエラー判定されスクリプト部分は削除！
　ずっと「読み込み中...」のページしかできません。

ではXml化して読み込めばいいじゃん！

　GoogleSitesにてJavascriptを実行したいとき、スクリプトをXmlにて作成し、公開できる場所においてからそこを読み込めばいいらしい。
　さっそく、上のスクリプトをXml化。Xmlのフォーマットは

<?xml version="1.0" encoding="UTF-8" ?> <Module><ModulePrefs title="タイトル"> <Locale lang="ja" country="jp" /> <Require feature="dynamic-height" /></ModulePrefs><Content type="html"><![CDATA[　※ここにJavascriptコードを記載します。]]></Content></Module>

　です。
　できたファイルを早速アップロードするんですが、公開できるようなサーバがなく、GoogleSitesにて公開しようと思い、サイト管理からファイルをアップロードしました。

ファイルのアップロードは、まずメニューボタンから「サイトを管理」を開きます。

そこで「添付ファイル」を選択し、そこにXmlをアップロードします。

　これでXmlを公開し、GoogleSitesから呼び出せばいいじゃないか！
　と思っていたのですが。。。
　
　GoogleSitesで「挿入」から「その他のガジェット」へ

登録したXmlを読み込めばそれで万事OKのはずだった。

「追加したガジェットは無効です」

（　　ω　）　　　...　。　。

どこかヤバかったか。ファイルはちゃんとルートに置いたつもり。個人アカウントでやったときはうまくいったのに。なんで会社アカウントでやるとエラー。。。混乱しました。

　しばらくぐだぐだやっていたのですがどうにもうまくいかず。Xmlによるガジェットは諦めたほうがいいなぁと次の手を考えます。

ここまできたらGASだろう！

そう。GAS（Google Apps Script）だろうと。

　正直、始めて触るんでちょっと乗り気になれませんでした。でも可能性があるとすればこれだけだったんで、思い腰を上げ挑戦。

　まずはgsファイルを作成。
　チュートリアルや逆引きを見てみるとなんかJavascriptとそんなに大差ない。スプレッドシートを取り出すくらいなんでそこまで難しくもない。

　お、なんかできてきた！！

　あ、ちなみにコードは
　http://www.bmoo.net/archives/2012/06/314057.html
　を参考に適宜変更しました。（コードを載せれなくて申し訳ないです。。。）

　スプレッドシートから情報を抜き出した後はhtml系の関数でhtml＋cssで整形するようにして見た目を整え、GoogleSitesに表示する用にしています。

　当初、想定している時間よりかなり早くやりたいことができてしまった。というかホントJavascriptライクにコードかけるんだね。ごめん食わず嫌いしてたよGAS。

　こうして仕事のおかげでGoogle Apps Scriptの勉強になり、カンタンなガジェットなら時間を見てまた作っていこうかなと。やっぱり作るのは楽しいです！

スマートフォンに注目！2013年はOSでスマートフォンを変える。

noreply@blogger.com (ブログ) — Wed, 09 Jan 2013 09:19:00 +0000

既にニュースなどでしている方もいると思いますがUbuntuを搭載したスマートフォンが2013年中にでるのかどうか。と注目を集めています。
そもそもスマートフォンは今までAndroidとiOSがOSのシェアを分けており他のOSはダブルスコア以上に話されていたのが現状です。しかし、そんなスマートフォン向けのOSの状況も変わりつつあります。
その要因はWindows8からFirefoxOSとUbuntuのオープンソースOSにあると思います。

Windowsは以前から販売されていますが、中々AndroidやiOSにとって代わる存在になれず浸透はしませんでした。（個人的には端末のデザインは好きなんですが。。。）
そうした中、二強に君臨し続けたAndroidとiOS。実際に周りを見渡してみてもスマートフォンを持っている人たちはiPhone(iOS)かAndroidばかりだと思います。自分もスマートフォン(フォンではありませんが。。。)はiPod touch(iOS)を利用しています。

しかし、そんな二強のOSに待ったをかける存在が出てきたのです。
少なくとも技術をかじったことのある人たちやプログラマーと呼ばれる人たちにとっては好奇心を刺激されるニュースなのではないでしょうか。
自分はわくわくしています。

WebOSとしてFirefoxOSが出てきた。

まずちょっと先に記事に出てきたのが「FirefoxOS」だと思います。
こちらはいわゆるWebOSに分類されるOSでブラウザベースの端末になります。ピンとこない人がいるとは思いますが、ブラウザがずっと立ち上がりっぱなしな状態だということです。
このWebOSはクラウド技術を利用すれば新しい使い道が出てくると思いますし、Android、iOSなどの特定のプラットフォームに縛られることなくアプリを楽しみやすいのが特徴として挙げられています。
要はWebアプリケーションになりますのでどの端末からでも遊べるよね！ということです。

このFirefoxOS。実際のAndroid端末にOSを突っ込んだ方もいるくらいでどんどん現実味が出てきているのではないのでしょうか。
http://www.adamrocker.com/blog/333/build-and-install-firefox-os.html
HTML5をベースにするのは限界があるという意見もありますが、私はまだ練ればいいんじゃね。と無責任ながら期待しています。

Linux系OSがスマートフォンにもきた！

続いてUbuntuのスマートフォン。
http://japan.cnet.com/news/service/35026465/
こちらはオープンソースOSのモバイル版だけでなくデスクトップPCなどと連携できるような仕組みがあるらしい。
ただこちらのOSについてはIT技術にそこまで詳しくない、いわゆる利用者側からするとAndroidと大差ないように見えるかもしれない。
だがこちらは開発者視点で考えると結構違いがあるように見える。

まずアプリなどを開発するときにモバイル端末独自の技術にならず、デスクトップ時代に身に着けた開発手法が利用できるということ。
最近の技術であるHTML5なんかも推奨されていて、Androidよりは手軽に開発ができるのではないだろうか。

個人的にはUbuntuのスマートフォンには興味があります。
WebOSもFirefoxOSだけでなくChromeOS（だらだらと言い続けてます）などもすでにオワコンなんてフレーズも聞いたりしますが、まだまだこれからじゃないのかなと考えています。
特にオープンソースはいろいろな人が触れるので今後に期待したいです
※他人任せです！

facebookにあるチャットウィンドウのサイズを動かす拡張！

noreply@blogger.com (ブログ) — Sun, 06 Jan 2013 13:23:00 +0000

LINEをはじめ、パソコンやモバイルに関わらずネット上でのコミュニケーションはますます便利になっています。ビジネスで利用する場合もSkypeやGoogleのHangoutsやMSNのMessengerなどなど。。。その使い勝手もさることながら様々な種類のメッセンジャーアプリが出ています。その中でビジネスでもプライベートでも利用しやすいメッセンジャーでfacebookのメッセンジャーがあります。

使い勝手や利用シーンは人それぞれなので必ずしもビジネス、プライベートなんでもいけるというわけではないですが私はどちらにも利用しているツールなので何気に重宝しています。

しかし、このfacebookメッセンジャーですがデフォルトのままで利用するにはちょっと使い勝手がわるいと思っていました。

それは。。。ウィンドウサイズが小さい！！

そう！ウィンドウサイズが小さい上に画面の下部に固定されているとあってMacにあるアイコンランチャー(画面の下にあるアイコンがにょきっとでてくるやつ。)っぽいランチャーを利用しているとメッセージを入力しようとしたのにアイコンが出てきたりと。。。なかなか使い勝手がいいとはいえませんでした。

Chrome拡張で自由自在！

そこで何かないかと探してみるとすぐに見つかりました。Chromeの拡張にあるんですね～

http://f.daccot.com/2012/01/24/10802/

ここを参考に拡張ツールをインストールして早速使ってみたんですが思ってるより簡単にウィンドウサイズが変更できます。またこのツールはウィンドウサイズだけでなく文字の表示サイズも変更出きるので自分の見やすいサイズに調整が可能です。さらにメッセンジャーのウィンドウをマウスドラッグで移動できるのもいいですね。

他に探せばメッセンジャー用のツールもありそうですがそこまでがっつりしたものでなくfacebookページ上でいい。だけどもあサイズはないだろう。。。と思っている人には便利な機能なんじゃないでしょうか。

インストールの手順については上のURLを参照していただければ画面付きで詳しく載ってます！

（ぶん投げですね。申し訳ないです。。。）

Chrome Web Storeで検索する場合は「Pretty Facebook Chat」という機能でURLが

https://chrome.google.com/webstore/detail/pretty-facebook-chat/ihamlfilbdodiokndlfmmlpjlnopaobi

になります。

ここからインストールするとURLの部分にアイコンが追加されるのでそこから設定を扱うことができます。

facebookページ上でのチャットをもっといい感じにしたい人にはオススメですよ～

「日本のジレンマ」を見て。自分なりの新しい働き方を考えてみた。

noreply@blogger.com (ブログ) — Wed, 02 Jan 2013 15:13:00 +0000

元日の夜に「日本のジレンマ」が放送されると知って、ついついテレビを予約。だってこういう番組好きなんだもん。

今回は「格差を越えて僕らの新たな働き方」というテーマで討論が進められていたんですが、最初はお互い探り合いというか、建前が先立っていたというか。それこそオーディエンスの人に突っ込まれるまで優等生回答が続いていたように思えます。

しかし、後半になってどんどんはっちゃけていきワクワクする話もあればまだまだつまらない話に戻ったり。

ただ正直この番組は見ていて思うのが、オーディエンスの人や私や番組を視聴している人にそこまで差が内容に感じられ、タイミングが合えばそれこそ誰でもあの論客の位置に立てるように思えます。

あそこにいる人は成功しているからあそこの場に立っているのではなく、自分をうまく発信したからこそ立てているように思いました。

まぁそれを成功というのかもしれませんが、そんなたいそれたことではないというか。今までの討論番組に出ている人たちよりかは年代が近いこともあってか、自分たちと大差ない人たちが出ていると感じることが出きるような気がします。

そんな中で格差もそうですが、私が一番ワクワクしたテーマが「新しい働き方」です。

番組の中でも自身の体験からサラリーマンとして働くことや独立すること。中には学生から就職せずに独立したと言う話もあり、参考になる話もありました。

そしてその中でも「セカンドジョブ」の討論に一番興味を惹かれました。というのも私自身、新しい働き方を模索していてその中でセカンドジョブという働き方に落ち着きどのような結果になるか実践している途中だからです。

ただこの「セカンドジョブ」という働き方は別に新しい働き方ではなく、海外を初め日本でも実践している人は案外多いようにも思えます。

改めて仕事を複数持つってどうなの？

自分は本業も副業もIT関係です。プログラムを書いてます。IT関係は特にセカンドジョブが他に比べてとりやすい業界でもあるので、仕事が無い期間はそれほどありません。

また本業についても自分は転職を繰り返してはいますが、すんなり次が決まっています。

複数の仕事を持つって時間が足りないんじゃないかと思われがちですが、そこは自分の時間を把握してさえいれば相互にメリットが大きく表れると感じています。

よく、副業禁止といっている企業に聞くのが

「自分の会社の仕事を疎かにされる」

「情報を漏洩されたり、技術を盗まれたりなどセキュリティの観点から禁止する」

という2点が多いように思えます。

が！自分的な感覚で申し訳ありませんが、この2点はまったくもって感じられませんでした。

仕事を複数持つことによって生まれるものとは

まず自分の会社の仕事を疎かにするかどうかといえば答えはNO。まったくそんなことはありません。

むしろ複数仕事を持つことにより、時間の有効活用に意識が向いて、会社の仕事を以下に定時で終わらせるかの効率化を計り、そこで身につけた技術というのは副業にそのまま生かせるものでもあるので仮に本業の仕事を1時間短縮することができた場合、単純に副業の仕事も1時間短縮することが可能になり、実質2時間の短縮となります。

中には会社と交渉して週××日の仕事に～とかありますが、今のところ私は本業の仕事を定時時間以上に削って副業をするということはありません。これは自分の仕事がプログラマーということもあるのかなと。

他の業種の人は確かに本業の時間を削って副業をやった方がいいのかもしれません。

まぁこれはその人それぞれだと思います。というか私に会社へ交渉する勇気がないだけとも言えますが。。。

時間の効率！時間の効率！と息巻いているように見えますが

私は特別何かをやっているということはありません。

時間を効率的に使えるように1日に使っている時間を意識しているだけです。

例えばある作業をここまで進めるのにどれくらい時間がかかったか。程度です。これを毎日意識すると時間に流されるだけでなくなり、自分の時間を自分で使えるようになります。

最初は意識するのが面倒くさかったりするとは思いますが、どんぶり勘定でもいいのでなれるまで続けることをオススメします。

途中で作業をした時間を確認する時間すら惜しいくらい忙しい！と思うときもあるかと思いますが、10分程度でもいいので割いてほしいです。

10分程度ならどんなに忙しくても割けることができると思います。

元旦の「日本のジレンマ」ではけっこうな討論が繰り広げられているのですべてを考察して書いていくのにかなり時間が要することではあるのでまた別の機会に記事にするとは思います。

今日は新しい働き方に焦点を当て、今の自分の働き方が日本の中では新しい部類に入るのではないか？と思い振り返って見ました。

もっとモデルケースになるくらいになれたらいいなぁ。。。。

Any.DOをもっと使いこなす！Gmail連携で効率的にタスク管理

noreply@blogger.com (ブログ) — Sat, 29 Dec 2012 08:58:00 +0000

　仕事でも個人的な作業でも最近はタスク管理は「Any.DO」でやってます。アカウント一つでChromeの拡張ツールのおかげで異なるパソコンでもタスクが一元管理できますし、何よりAndoridやiOS端末とも同期がとれるので本当にどこからアクセスしてもタスクを簡単に管理できるツールだからです。

　さらにタスク管理でかゆいところはメールが絡むとき。とくに自分はメールのやりとりが多いのでそこから作業が発生するといちいちメールを確認しながら別画面で開いているタスクツールへ作業を書き写す作業をやっていました。

　これは一見無駄に見えそうですが、タスクをまとめるという点では私にとっては必要不可欠な作業であり、多少の面倒くささは感じつつも最終的に作業の効率につながるものとしてやってきました。

　しかし！Any.DOはこのかゆいところすら手が届くようになっているのです。

　とくに自分の場合ですがGmailとの連携により、効率的にタスクを入力することができます。

まずGmailと連携する！

　ChromeでAny.DOを使っている人は既にわかっているとは思いますが、Any.DOをChrome拡張ツールにインストールしたとき、設定画面でGmailとの連携を確認する項目があると思います。

　デフォルトで連携するようなっていますので得に意識することなく、インストールした時点でGmailとは連携されるようになっています。

Gmailからタスクを追加する

　それではGmailからタスクを登録します。

　Gmailのメールを開くとわかりますが、メールのヘッダー部分とフッター部分にAny.DOの項目が追加されているのが分かると思います。

[ヘッダー部分]

[フッター部分]

ここからメールから出てきたタスクを追加します。

メールとタスクがごちゃ混ぜにならず作業が明確化される

　自分はよくあるのですが、メールで作業を依頼されついつい

「メールが残っているし、作業をやるときにそこから探せばいいや！」

　と、ついつい考えてしまいがちです。

　すぐに作業に取りかかればそこまで問題になりませんが、あとでやろうと思っている作業をメールのままにするとあとでやろうとしたときに大変です。

　メールはどんどんやってきます。そしてそのあとでやろうとしている作業のメールを埋めてしますのです。

　そうなるとそこからメールを探し出すという作業が待っており、とても効率的に作業をしてると思えません。

　そうならないためにもタスク管理を少しでも効率的に行うと言うことは今の作業だけでなく、これからの作業を管理することにもなるので自分としてはAny.DOはかゆいところに手が届くツールとして重宝してます。

Any.DOを使ってタスクをすっきり解決！シンプルにまとめて作業を効率的に

noreply@blogger.com (ブログ) — Thu, 27 Dec 2012 04:31:00 +0000

　　このブログでは何度か効率よく作業を進めるためには！をテーマに記事を書いてます。そのほとんどが自分がインプットした情報を試して自分なりに解釈してからアウトプットとして記事を書いてます。今回はAny.DOというアプリを使ってみて自分のタスクがどのように効率的にこなせているかを紹介します。

　といってもAny.DOはすでに有名なアプリなので使い倒している人は幾人にも及ぶと思われます。そんな中、まだ手に取ったことのない人への「これって便利なんだぞ！」的な記事で書いてます。

　ちなみにAny.DOはスマホはもちろん、GoogleChromeの拡張機能でも提供していてまた情報の同期が取れることから端末に依存することなく自分のタスクが見れちゃうすごいアプリなんです。

1日に何をすべきか一目でわかる

　私はスマホで利用するより、GoogleChromeで利用することが多いです。

　プログラマを生業にしている以上、1日のほぼすべてをパソコンと向き合っている生活をしているので必然的にタスクもパソコンにまとめるようになります。

　そんな中、いくつもの案件を抱えているときなんかは何から手を付ければいいのかごちゃごちゃして結局1日終わっちゃうじゃん！というドツボにはまってしまうことがあります。

　。。。私も油断しているとまるで受験勉強の前に部屋を掃除する男子高校生みたいな感じになっちゃいます。

　Any.DOは1日だけでなく先々のタスクも入力することができるのですが、特にその日のタスクを確認することにおいては非常にわかりやすい見た目になっていると思います。

タブを見ただけで一目でわかる「今日のタスクはあといくつ？」

　先ほど話した通り、私はスマホでというよりGoogleChromeの拡張機能としてAny.DOを利用しています。

　そこで私は一日の始り、もしくは前日にその日にやるタスクをすべてAny.DOのTODAYに入力します。するとタブに表示しているアイコンに赤く数字が表示されるのがわかるかと思います。

　実はこれTODAY≒今日やるタスクがあと何件ありますよと通知しているのです。

　タスクの内容なんかは詳細を開いて確認。となると思いますが、全体の作業量があとどれくらいかという確認は特に操作を必要とせず、タブに表示される件数を確認すればいいだけなのです。

終わっても終わらなくてもタスクは消す！

　作業が終わっていないのに！なんていうのは野暮です。(すみません。。。)タスクが終わったら消すのは当然ですが、終わらないタスクも消すのはどういうことか。

　これはその人の使い方によって好き好きになりますのであくまで参考程度で。

　実はAny.DOのタスクを削除する機能は2段階あります。

　1．タスクを非表示にする⇒左にあるチェックアイコンを押下する。

　2．タスクを削除する⇒右にある×アイコンを押下する。

　ここで終わったタスクについてはもちろん2まで行いますが、終わっていないタスクについては1まで行っていったん非表示にさせます。

　そうして次のタスクと一緒に考えながら優先度を下げたほうが良ければ非表示のままにしておき、納期などの関係でタスクとして作業をしたほうが良ければ再度タスクに表示させます

　(表示させる際にはもう一度左のチェックアイコンを押下します)

　こうすることでその日その日のタスクを確認し、消化していくのです。

　デザインもシンプルなので作業がごっちゃになりにくいことと、自分なりの使い方でタスクがたまらず1日1日で更新されるので私としては効率よく進められていると思っています。

　https://chrome.google.com/webstore/detail/anydo/kdadialhpiikehpdeejjeiikopddkjem?utm_source=chrome-ntp-icon

　からぜひどうぞ

PHPer初心者向けの備忘録！画像ファイルをバイナリとしてMySQLで管理する。

noreply@blogger.com (ブログ) — Wed, 26 Dec 2012 04:14:00 +0000

　大きく初級向けと書いていますが、自分の備忘録も含めてです。。。。

　初心者全員とは違うと思いますが、PHPを触り始めた当初、画像ファイルなどを扱うとき画像ファイルはサーバにあるディレクトリに保存しその保存したディレクトリパスをMySQLなどのDBで管理をするコードを書いてました。今思えばダサいコードでした。。。

　当時はこのやり方に一つの疑問を持たず、またこれ以外のやり方を知らなかったということもあります。（PHPより先にhtmlやCSSなどを扱ってたこともあり、サーバのディレクトリに画像ファイルを置くことになんの抵抗もなかったことも起因します）

　しかし、いくつか案件に参画し、このやり方よりもっと効率がいい管理の仕方があるのでは？と感じ始めました。

　特に登録、参照だけでなく更新や削除が入ってきてディレクトリの権限などを考慮しなくてはならなくなったときに煩わしさを感じたことでさらに違和感が増してきました。

　そこで画像などのファイルをバイナリで扱えば登録できないかと検索をするとビンゴ！いとも簡単に情報を探すことができました。。。。(セキュリティのことやOSやブラウザを横断的に対応。などを考えるとこっちのほうが断然いいと思ってます。。。現状は。)

　そこで己の備忘録を踏まえロジックを書いていきたいと思います。

ファイルのアップロードは$_FILES[]！！

　画面からファイルをアップロードする処理は単純です。

　HTMLにファイルアップロード用のタグを用意してPHP側へsubmitを行い、PHPで取得する。それだけ！

　コードは簡単にこのような感じです。

　※最低限な箇所しか記載していません。***の部分など整合性が取れるように補足する必要があります。

　[HTML側]

　</form>

　[PHP側]

　$_var = $_FILES["***"];

　これでまずは画面からアップロードされたファイルの情報を取ることができます。

　$_FILESは二次元配列となっており、各箱にそれぞれ下記のような情報が入っています。

　$_FILES["***"]["name"]

　⇒アップロードされたファイルのファイル名

　$_FILES["***"]["tmp_name"]

　⇒アップロードしたファイルがサーバ上で一時的に保存されるテンポラリファイルの名前

　$_FILES["***"]["type"]

　⇒MIME型(PHP側ではチェックされていないため信用ないらしい)

　$_FILES["***"]["size"]

　⇒バイト単位でのファイルサイズ

　$_FILES["***"]["error"]

　⇒アップロードに関するエラーコード

MySQLではどういった型で取り扱うのか。

　アップロードしたファイルをバイナリ型に押し込む際に、押し込み先のMySQLではどのようなカラムを用意すればよいのかということで、型以外は他の絡むと一緒で大丈夫ですが型についてはBLOB型を使います。中でも私はMEDIUMBLOB型を使っています。違いは取り扱うデータ容量で利用シーンによって使い分ければよいかと思います。

　そしてPHPで取得した値をMySQLに登録します。

　DB接続の部分などは省きますが、どのフレームワークを使っても処理に変わりはありません。重要なのはINSERTする際のVALUES。ここの設定になります。

　$_FILES["***"]で取得している値をどのようにバイナリに変換するかというと

　file_get_contents($_FILES["***"]["tmp_name"])

　という関数を使い値を取り出してVALUESに設定します。なのでSQL文を簡単に書くと

　INSERT INTO テーブル名 (対象のカラム名) VALUES(file_get_contents($_FILES["***"]["tmp_name"]))

　となります。(本当ざっくりです)

　ということでこれでアップロードした画像ファイルをバイナリとして扱い、MySQLに登録することができました。

じゃ登録した画像を画面で見るにはどうすればいいの？？

　登録したら次はその画像ファイルの参照方法です。

　まずはSELECTを行い、そのカラムの値を取ってきます。

　そして！

　echo header("Content-Type: image/jpg");

　echo {取得したカラムの値}

　これで参照できるはずです。

　ちなみにこの処理は他の処理と混合させず、この処理のみでクラスを作成することをお勧めします。

　MVC的にはController、もしくはModelを一つ独立させ、View連携を解除させて呼び出す。ということになります。

　コードの部分は抜粋しすぎて全然初心者向けではありませんが、備忘録ということにすり替えて。。。

　近い将来、自分用にプラグイン化にできたらGithubなどで公開したいです。

Gmail活用！大量にある埋もれたメールの中からコマンド駆使して探し出す

noreply@blogger.com (ブログ) — Fri, 21 Dec 2012 08:49:00 +0000

　仕事でもプライベートでもGmailを利用しているのですが、最近メールの量が増え捌くのがめんどくさくなることがあります。

　そうやって、「ほとんど同じ内容だろう」とメルマガ系などの自動配信メールを一斉に削除、もしくは既読にしたときにあとになって「あのメールなんだけど～」とどきっとされる場面があるかと思います。

　その仕事やプライベートなどのシチュエーションにもよりますが、1日ほっとくだけで500件近いメールを受信していたりして件数を見るだけでげんなりしてしまいます。

　そこでGmailを利用する際、埋もれちゃったメールを発掘できるようにはしようとコマンドを使い始めたので自分自身の備忘録を含め記載しようと思います。

　。。。こういうのは一度覚えてしまうといい。とは聞きますが中々。。。「検索すればすぐでるし」というささやきに惑わされてしまい後回しにしちゃう。（検索する時間って思ってるほど短いものではなく、むしろ結構時間を取られたりするのでやっぱり覚えたほうがいいんでしょうね。。。）

一番使いそうな「日付」を指定するコマンド

　よく言われるのが「12日に送ったメールなんだけど・・・」というフレーズ。差出人や件名が似たり寄ったり、もしくは一緒だったりして日付で指定したりすると見つけるのに苦労します。

　私もつい上からひとつひとつ探したりもしました。。。

　日付を指定して探す場合は

　after:YYYY/MM/DD before:YYYY/MM/DD

　とafret、beforeコマンドで検索を行います。ここで同日の場合にその日は含むかどうかはaffterは同日を含み、beforeは同日を含みません。

　なので8月の1か月分を抽出したい場合はafter:2012/8/1 before:2012/9/1になります。

他にも便利なコマンド

　日付の他にも違うコマンドで検索にフィルターをかけることができます。私はhttp://tech-neet.com/?p=634などを参考にさせていただいています。

　検索コマンドについては一覧を載せているサイトが多数ありますので、自分に合うものがあればブックマークしましょう！

添付したファイルのファイル名でも検索できるんだ。。。意外に使いそう＠ω＠。。。

紙とペン。シンプルながらも不思議な力を持つツール。

noreply@blogger.com (ブログ) — Thu, 06 Dec 2012 06:26:00 +0000

　これほど身に染みたことはないというくらい紙とペンの組み合わせはシンプルですが素晴らしいものだと思います。
　プログラマーという職種を生業とし、デジタルコンテンツなしでは生きていけないくらいまで達している管理人ですが、いまだに新しいモノを考えるときや作業が詰まったとき、タスクの取捨選択などあらゆる分岐点において紙とペンの組み合わせに頼ってきました。
　自分の周りを見渡してみれば目の前にパソコンがあり、携帯端末がある。それぞれにインストールしているツール、たとえばEvernoteやDropbox、Office製品やWebアプリなど紙とペンがなくともそれぞれの事象に対応できうる媒体がいくらでも存在しそうなものである。
　
　ただ、「ライバルは紙とペン」だと語るEvernoteにあるようにいくら便利なツールでも紙とペンという魅力には敵わないのではないかと思います。現に自分を含め、紙とペンを全く使わずにデジタルコンテンツのみで仕事をこなしている人を見たことがありません。いくら自分はツールを使いこなしていると豪語する人でも机の中に紙とペンが入っているはずです。

何がそんなにも素晴らしいのか

　何故こんなにもコンテンツが充実している世界で、いまだに紙とペンの魔力が聞いているのでしょうか。
　それはシンプル、それも洗練されたシンプルな組み合わせだからだと思います。シンプルといえばAppleが思い浮かぶと思います。自分はMacを使っているわけではないのでそこまで理解しているわけではないですが、本当に必要な機能にフォーカスしてそこにあるモノを研いで深いシンプルなものに仕上げたツールはそこに余計な情報はありません。
　ゆえにそのツールに対して集中することができ、作業をこなすことができるのではないかと思います。
　
　紙とペンはこれ以上にないくらいシンプルです。そこにはこれから行う作業以外の情報は一切ありません。揚げ足を取るのであればペンの側面に記載されるメーカー情報くらいです。そこから余計なものに脇目も振らず作業に集中することでどのような作業でも品質が高い仕事へ昇華することができます。

いつでもいい。まず紙にペンを走らせることから始める。

　パソコンを扱って作業をしているときなんかは、メールのポップアップが表示されたり、閉じているインターネットのアイコンが見えたり、それによって他の作業がちらついたりとコンテンツを使いこなしたり、設定をカスタマイズすればということがあったとしても「作業のこと以外を考えない」という可能性は100％にはなりえないと思います。
　ただ紙とペンはそれしかありません。ひたすら作業をするだけです。
　
　そこでおもしろいのが書いていくないようが芋づる方式で増えていくこと。
　0から1という作業に力を注いでしまえばあとは慣性の力も利用して1,2,3...と増やしていけばいいのです。この0から1に持っていく作業は簡単にいくものではありませんが、1になったものを増やしていくことは意外に簡単なことなのです。

シンプルな組み合わせなのでどのようなシーンにも対応ができる。

　紙とペンさえあればどのような作業にも対応できることがこのシンプルな組み合わせの強みだと思います。
　アイディアを考えている時やタスクの整理をするとき、設計に起こす時や何かトラブルがあったときの対応をまとめたりなど様々なシーンにおいてもその作業に集中して成果を上げるために取り組む環境を作ることができます。
　
　
　実際に自分も新しいアイデアをまとめるときは1枚の紙にひたすら頭に思い浮かんだものを書いてあとから紐付けていってますし、作業工数の見直しが出た時も紙に書きだしてひとつひとつ細かく見ていくようにしています。
　実際にExcelなどツールを使っていた時に比べて作業の質は上がっているように感じます。
　
　ただツールはツールで使いどころがよければ作業の質を上げる要因になってくれるので必ずしも紙とペンが素晴らしいというわけではありません。
　
　まだ紙とペンの組み合わせの魔力を感じたことない人はぜひお勧めします。
　特にこれからクリエイティブな仕事をしたいんだと息巻いている人には紙とペンだけでどれくらいのものができるかが一つの分岐点じゃないのかな。と話したりしています。
　自分の考えが正しいと思っているわけではないです、少なくとも経験則として私は紙とペンの魔力にハマりっぱなしだということです。
　

開発に使うエディタをSublime Text2に切り替えた。すぐに欠かせないツールとなった！

noreply@blogger.com (ブログ) — Wed, 05 Dec 2012 06:38:00 +0000

　開発する際、よくIDEというキーワードを耳にすると思います。統合開発環境の略称でデバッグやコンパイル、プロジェクト管理など開発時によく使う機能をまとめたツールになります。
　おそらく一番有名なのがEclipseになるかと思います。
　あとはOSによってはWindowsモノやMacモノがあるかと思います。自分はこの世界に足を突っ込んだ時、Windowsから始めたのでVisualStudioを中心に使ってきました。確かにコードの検索とか容易に行えますし、管理が楽になったりまた関数を完全に覚えていなくても補助ツールで書くことができるのでものすごく便利な開発ツールだと思います。
　私もそれこそショートカットキーから覚えて使いこなしていた時期もありました。
　今でこそ、さまざまなプロジェクトを見てきてその中でいくつかIDEに触れることもありましたが、いずれもしっくりくるものがなかったのが現状です。

そこで思った！エディタで書こうと。。。

　C#やJavaを扱っていた時期はIDEの恩恵をフルに受けて使い勝手がよく、慣れもあって手放せない感じになっていました。
　しかし、次第にhtml、ｃｓｓ、ｊａｖａｓｃｒｉｐｔをはじめPHPやRubyを触り始めたころからIDEで開発してもなんかしっくりこない状態にありました。
　そして、同じJavaですがAndroidを扱いだして自分の中で一つ思い浮かんだんです。

個人で使うスペックを考えてみた。。。

　そう、当時（といっても今もですが）Eclipseなんかを扱うと会社のパソコンはまださほど気にはなりませんが自分が使う個人のパソコンだとめちゃくちゃ重たいんです。
　まぁちょっと重たいかな～くらいはあったんですがそれでも気にせずやってきました。ただAndroidのデバッグをシミュレータで始めた途端。。。。なんか振り切ってんじゃないの？って思うほどパソコンから悲鳴が＠Д＠；；

　まぁデバッグとかは仕方ないとしてもっと軽く開発ができないものかと模索を始めたのです。

エディタでやるのがやっぱ一番軽いよね！

　学生のとき、Javaの基本的なコードをTerapadで書いてたのが思い出されます。あの時はなんでいちいち書かないといけないのか！？とわけもわからず憤慨していた記憶があり、そこでEclipseを知ってめっちゃやりやすいやん！と息巻いていました。

。。。いい思い出です。

　やっぱりエディタで手で書いているほうがサクサクすすめれますね。。。微妙に関数が覚えきれていなかったり、検索などで継承関係を追いたい場合は確かにIDEは便利ですがひたすらコードを書くときには自分としてはやはりエディタがいいなぁと感じています。

お試しにサクラエディタを使い、ハマる。

　フリーでエディタを探していたとき、探している最中はTerapadを使っていたのですがサクラエディタを見つけて使い始め、しばらく経ったとき・・・サクラエディタ中心の開発になっていました。
　もちろんソッコーで文字の色とか背景色とかカスタマイズします！

　なによりサクラエディタが便利なのは「矩形選択」にあります。

　矩形選択で検索していただけるとどんな機能なのかわかると思いますが、文章を行でとらえるのではなく、ブロックでとらえることになります。
　これは使われないだろうと思われがちですが以外によく使います。とくにコピペで開発する人は特に。だって配列などでキーのこの部分だけ(たとえば共通する名称のみとか)を一気に変えたい場合なんかはものすごく便利です。

（※ちなみに自分はコピペ開発を推奨しているわけではありません。それぞれのメリットデメリットを見て使えると判断できれば使ってもいいという考えで使い手の技術にゆだねられるものだと思っています）

問題発生！OSがUbuntuに！！

　サクラエディタをがっつり使い始め、もうこれなしでは開発は無理！とまで来たときに自分は前の記事(http://knowledge-am04labo.blogspot.jp/2012/10/mypc.html)にもあるように自分のパソコンのOSをUbuntuに変えました。
　そこで問題が。。。

　サクラエディタが使えない。。。

　そう、サクラエディタはWindowsで使うツールでした。

　UbuntuにはWindowsのツールが使えるアプリがあることはあるのですが使い勝手が格段に落ちてしまうので定着することができずしばらくはEclipseで開発をするはめに。。。しかも矩形選択が使えない！
　自分の中で矩形選択はけっこう重要な機能になっていたこともあり、けっこう響いてしまいました。(Eclipseも矩形選択ができるとあったんですが自分は技術不足か知識不足か実現することができませんでした。。。)
　そうして、新しいエディタを探す旅に出たのです。

矩形選択できるぜ！Sublime Text2

　ようやく来ましたSublime Text2！いろいろなブログで「これなしではいられない！」的な記事を見て自分も試してみようとチャレンジ。
　しかもOS関係なく使えるじゃないですが！こりゃ便利！と。。。

　まだ使い始めなんでまだまだですが矩形選択は問題なく。またプラグインで便利な機能を入れれるとのことで暇を見つけてはトライしてみたいです。

　しかし！完璧なものはこの世に存在しないのか。。。日本語のインライン入力ができない。つまりコメントも英語で書かなければならない！ただこれはすでにプラグインが存在し、Ubuntuならhttp://d.hatena.ne.jp/itiu/20111229/1325138744を参考に（ただしVim必須）Windowsならhttp://webkikaku.co.jp/staff/software/windows-sublime-text-2/を参考にすればばっちり解決です

上記記事を書かれた方本当に感謝です。m＿＿m

　日本語の問題も解決し、今となっては自分のパソコン(Ubuntu)職場のパソコン(Windows)に即座に入れて開発に使っています。日本語の入力方法に違いはあるとはいえエディタでの開発では便利すぎます！

　もし、エディタを探している人はこの”恋に落ちるエディタ”を使ってみてはいかがでしょうか。

便利すぎる！Webサイトの配色で困ったときのジェネレータ

noreply@blogger.com (ブログ) — Wed, 14 Nov 2012 20:12:00 +0000

　仕事でサイトデザインなどを担当する時があります。もしくはある程度レイアウトが固まっていてhtmlを組んでるときに細かいところを調整したり。などなど

その時に必ずと言っていいほど迷う箇所があります。それがサイトの色です。完全に使用する色とかが決まっていて内部の機能を組んでいくだけならまだスムーズに作業へ取りかかれます。
　サイトデザインも含めて開発をしているとどうしても確認作業をしているときに。。。

　「あーここの色が気になる。。。。」

　という衝動にかられ、色の数値をちまちまと変えて都度確認して微妙にバランスが気になる。。。このグラデーションが。。。文字の色がぼやけた。。。とかとかあります。
　とくにグラデーションをかけるときや同系統の色の組み合わせを行う場合などはもっと簡単に色の調整ができないかと感じていました。

　最近はhtmlやcssに関するジェネレータが充実していることもあり、上にあるような作業は実はあっさり解決できることなんです！

いくつかある中で気に入ってる色に関するジェネレータ

http://colorschemedesigner.com/

　というジェネレータが自分の中で便利すぎます！実際にサイトを見ていただくと分かるんですがマウス操作で色の指定ができます。さらに同系統の色の濃い薄いまでも表示してくれます。
　さらに色の明暗までも調整可能なのでちょっと色を変えたいと思ったときにここでバランスなんかがすぐに確認できるんです。

実際にテンプレート的なサイトにした場合の色のバランス

ここでは色をただ表示させて同系統の色を並べているだけです。このままでは実際にサイトに落とし込んだ場合にどのような色具合になるかはまだちょっとわかりにくです。

　しかししかし！そこもちゃんと解決できます！

　色のプレビューがあるタブに

　「Light page example」
　「Dark page example」

　があります。各タブをクリックしていただくと分かりますが選んだ色の系統でサイトデザインを起こした場合のサンプル的なサイトを表示してくれます。

　これは自分が作成しているとこで設定を変えずにまずは一般的にどのようなかんじになるか確認できると思います。

　色々あるジェネレータの中で自分はこれをがっつり利用させてもらっているんで紹介させていただきました。
　とくに色のバランスがまだつかめず自分で作るのがちょっと。。。っていう人にはおすすめです。

幾多にも分かれるタスクをすべてうまく渡り歩くために。

noreply@blogger.com (ブログ) — Tue, 13 Nov 2012 15:07:00 +0000

ここ数日。というか10月中旬から11月初旬にかけて自分のまわりは激動していた。。。プライベートも仕事もすべてぐるぐる回ってこの期間は自分が追いつくことができず、空回りして回りに迷惑書けてばかりだった酔うな気がして仕方が無いのです。

　今日は備忘録と反省を含め、今後の作業を効率的にするための考察を残しておこうと。。。。後で後悔しなければいいけどな！

当たり前に集中する。

　こういったことに対しては特別な対処というよりはもっとも当たり前に集中して取り組むことが一番の妙薬だと思っています。
　自分の中では「過去を振り返る」「今を把握する」「未来を宣言する」この三つに限ります。

　何か問題にぶち当たったときや周囲にいる人たちと時間のずれを感じ、クオリティが高い仕事ができなくなっていると感じたとき、この当たり前な作業にどこまで集中し、乗り越えるかが、それこそ当たり前ですが重要なポイントだと捉えています。

「過去を振り返る」で問題を洗い出す。

　まずは今日、今、そのときまで自分がやっていたことを書き出します。仕事のことはとくに細かく書き出して成果を上げているのか、いつものスピードで作業を進めれているのか(明確に分かるようたとえば1日で何行ソースコードを各個とができたかなど。)ちなみに作業のスピードなんかは時間を決めてその時間内にどれくらいソースコードが書けたか、や設計、アルゴリズムをまとめれたかなどを書き出し、その量が自分の考えていたこととどれだけ乖離しているかを確認します。

　そうして書き出した過去からもっと効率的に進めれそうなものや集中力が分散してしまった作業などを確認します。これはたとえイメージや曖昧な記憶で会ったとしても、思い出した時にその程度の印象しか残っていないという事実から真に効率的に進めれていた作業と定義できず、すなわち問題を抱えてしまっていた作業になります。

「今を把握する」ことで過去の問題を引きずっていないか。

　次に今やっている自分の作業と過去から書き出した作業、問題点などを照らし合わせ今も問題として残っているか、改善の余地があるのか、その作業に対して十分な集中力を注いでいるかなどを確認し、今を把握します。
　これは過去の問題点や作業に集中しきれていない自分のパターンにどれだけ当てはまっているのかを正確に把握することが目的です。

「未来を宣言する」ことで今の流れをポジティブに変えて今の作業からよりよく！

　ここまでネガティブなポイントに焦点を充てて、過去の問題点や現状の把握を行ってきましたが、ここでようやくポジティブに転換します。
　何をするかというと現状にまだまだ問題が潜んでいる。これは逆にするともっと効率的な方法にシフトすることができる、作業をよりよくする可能性が残されている。こういうことが言えます。
　
　書き出したネガティブを分析し、どのようにすればポジティブに転換してよりより作業に昇華できるかがここでの目的です。

　そうすることで今の作業からこれからの作業がリスタートされ、品質の高い仕事に進むことができます。

　以上がいつも自分がやっている作業の確認方法です。大なり小なりこのステップを意識して、仕事に取り組むよう意識付けしてきました。

　よくよく考えなくても非常に当たり前なことだと思いますが、自分にとっては非常に強力なツールとして存在しています。

　このように考えを巡らせ、さぁ次の仕事！と切り替えていくのです。

MyPC決定！！

noreply@blogger.com (ブログ) — Tue, 16 Oct 2012 05:38:00 +0000

ここ数日、九州は福岡も冷えてきました。ただ知り合いのプログラマの方とスカイプ中に「こっちはもう灯油とか用意してますよ～」なんて聞くと半袖短パンの自分はまだ福岡は暖かいのだろうと思いなおしています。
　さて、どうでもいい話ですが表題のとおり自分のPCを買い換えました。前のPCはノートなんですがメモリ拡張してもまだ処理が重たく、さらに処理が止まり強制再起動をかけてばかりのもうなんとも言い難いモノに。。。
　まぁ買った時期が3年前でそれもその当時ですでに型落ちしていた安物。よくここまで耐えたなぁというのが一番の感想です。

新しいPCはThinkPad X220に決定しました！

　そうThinkPadにしました。この時期にX220なんてまた型落ちかよ。という思いもナキニシモアラズ。。。ですが実際、自分にとってこれぞThinkPadって感じで気に入っています。
　
　そもそもPCを買い換えようと考えたときにはAppleのMacbookProを検討していました。話題のれてぃーなディスプレイも搭載されていることですしクリエイティブな技術者ならMacだろうと！
　実際、いろいろ話を聞いてMacを選んでいる人が多かったですし、参加するイベントの勉強会で持参しているPCや講演している人のPCはほぼMacでした。
　
　ただその光景を目の当たりにして今Macにするのはマイノリティじゃないなぁなんて考えもできました。（ThinkPadなんてマジョリティすぎるとは思いますが。。。）そこで自分はどんなPCが欲しいかを吟味し最終的に2強＋敗者復活枠の3候補が浮かび上がったのです。

やっぱりMacで行くべきじゃなかろうか！

　まずは初志貫徹のMacです。なんといってもフォルムがきれいですしシンプルなデザインの中に引き寄せられる魅力を感じることは確かです。それにiPhoneやiPadといったiOSアプリを作成するにはApple製品が断然有利だということもやはり第一候補でいた理由になります。
　そのころ再びジョブズ伝記を読み返していたこともあり、尚のこと惹かれていました。

HPという選択肢

　敗者復活枠ということでHP製品のUltrabookが出てきました。とりあえず全体を見てUltrabookなどの軽くてパワフルなPCを探していました。理由は自宅の中で今日はこの机！とか今日は寝転んで。。。とか思い切って地べたで。とか作業する場所が決まっていないので持ち運びできるものが欲しかったから。外でとかまではいけませんが、一つの机におとなしくできるような子ではないので。。。
　話はそれましたがなぜHPかというと前使っていたPCがHPで長持ちということで印象がいいから。さらにAppleの二人のスティーブがHPに関わりを持っていることとシリコンバレーのホントの初期から有名企業であったこと。
　テクノロジー企業として外せないかなという思いからやってきました。
　(敗者復活枠という失礼な表現で申し訳ないですが、適当な表現が見つからず無礼を実行。。。)

ちょっと初恋を思い出す。

　AppleやHPといったいわゆるブランドというカテゴリが選択の判断を大きく左右し始めたとき。一つのキーワードが頭を駆け巡りました。それがThinkPadです。
　自分がThinkPadを知ったのは専門学校のころでおよそ8年くらい前。まだプログラムなんてなんにもわからないし、パソコンなんてどれでも一緒だろう程度な感覚だったとき、形、使い勝手、それこそ名前を含め、初めて他とは違うPCと認識したモノです。PCの初恋ですね。
　その思いから、ここでThinkPadいったら！！というテンションになり、直前にしてごぼう抜き。なんとMacbookProまで抜き去り一躍トップに躍り出たのです。
　
　ちなみにそこから先もちょっとやきもきします。
　ThinkPadの中でもXシリーズというのは決めていましたがカーボンにするかX230にするか。はたまた型落ちを選択するか。その間にもやっぱりMacがとかHPがとか揺れに揺れましたが最終的にThinkPad X220へ決定しました。

なぜX220？？

　X230やカーボンが出ている中でなぜX220を選択したのか。
　X230からアイソレーションキーボードになったり、7列が6列になったりと様変わりした印象を持っていました。これでも構わないとは思いましたが、最終的に。。。
　
　「ThinkPadはアイソレーションキーボードじゃなくあの形がいい！そしてEnterキーの色は他とちがうんだ！」
　
　という身勝手な言い分から。
　
　
　こうして私の新しいPCはThinkPad X220になりました

ちなみに。。。

　ThinkPadということでOSはWindows7が入ってますがUbuntuに変えました。

　なぜならそのほうがかっこいいから！
　
　まぁ不純ですね。。。あと技術者としては自分でいじることができるという点でWindowsやMacよりかは選びやすいという感じです。ここらへんはまだ自分は未熟なんでこれからガリガリやっていく予定です。
　
　そしてテーマやDockはさっそくカスタマイズしてMac風に仕上げています。
　
　
　。。。Windowsが入っていたThinkPadをUbuntu(Linux)に入れ替え、見た目はMacにする。。。
　
　よくわからんPCが出来上がりました。
　
　
　最後にUbuntuのインストールはCDドライブがない（外付け買う気なし）ということで
　http://d.hatena.ne.jp/KNOPP/20110804/1312467611
　を勝手ながら参考にさせていただきました。
　ありがとうございます！！

Let the task of multiple!

noreply@blogger.com (ブログ) — Mon, 01 Oct 2012 07:19:00 +0000

　タイトルの英語があっているかどうかは別として。。。私はタスクを複数持つよう心がけています。時間の管理というものに着目し自分の人生がどれくらいなのかを意識するようになってから、自分に何ができるか。どうしたら何かを残すことができるか。などを常に意識の念頭に置いて行動するようになったのです。
　そしてプログラマーという身ではありますが、心理学や数学、経済学というものに興味本位で触れていく中（あくまで興味本位です。。。）一つのことに注目し集中することが大切だと教えられましたが、同時に自分の意識を変えるだけでひとつのことに集中しながらも違う作業を行えることに気が付きました。ただこれは新しい発見とかではなく周りにも実践している人は大勢いると思います。ただ私の場合そこに意識を集中することでより効率化しようと試みているわけです。
　

　

コンピュータは人より優れているのか？

　
　よくコンピュータの処理速度が上がり、記憶できる容量も大きくなり人の脳みそよりも性能が格段に上がっているという話を聞きます。それは確かにその通りだと思います。コンピュータで記憶できる量と人が記憶できる量は目に見えて差があります。またCPUがいくつも搭載することができ、並列に処理を進めることができます。
　これは人の中に脳みそがいくつもできて、考えるという処理をいくつも同時に行えることだと思っています。
　では人は脳みそをいくつも持たない限り考えるという行為は一回しかできないのでしょうか。
　私は実はそうは思っていません。
　
　

自分の意識をイメージ、集中し無意識化をコントロールするようにする。

　前提として私はまだまだうまくコントロールできているわけではありません。
　しかし、これを意識するようになり作業の効率は格段に変わってきていますし、見ている世界が変わりつつあることを目の当たりにしています。つまり効果が出ているのです。
　ではどういうことかを私の個人的な解釈がほとんどですが書いていきたいと思います。
　
　まずこの考えにたどり着いたきっかけに心理学の勉強の中で「NLP」に触れたことにあります。NLPについては有名な心理学の知識、技術でもあるため説明は省きますが、そこで大事なのは自分の中にある地図を認識することだと思いました。それは意識下で見えている地図と無意識下で広がる地図です。
　意識下で見えるものは確認が容易だと思います。なんせ意識すればいいだけですから。問題は無意識下の地図です。
　無意識を意識的にコントロールするというのは一見矛盾しているように見えますが、これを意識することで世界観が変わっていくと思います。
　
　

意識下にあるものを徐々に無意識下においていく。

　スポーツをやっている人なんかはすぐにわかると思うのですがたとえばあるフォームを身に着けるとなったときにまずは体の感覚を意識して練習に取り組むと思います。
　どのように動作すると力加減に強弱がつけれるか。どうすればスムーズにいけるか。そしてここで注目してほしいのはこのように繰り返し繰り返し実行したものは徐々に意識せずとも動かすことができるということです。
　意識的に動かしていた体が動作を覚え、無意識にでも動かすことができるようになるのです。
　
　これを思考にも使います。
　
　自分が実践しているのは朝の通勤時などでもいいので、まず決めた時間に意識下であることを考えるようにします。たとえばアイデア出しとかエラーに対しての対処方法などです。
　これをそのとき一回だけでなく、意識して繰り返すこと。
　そうすると考えるという行為、動作が徐々に無意識化へ移っていくのです。そうなるとどうなっていくのか。意識下で動かしている場合、無意識化が動かないということはまずありません。意識下で作業をやっている間に無意識下では呼吸をしたり体温を調整するよう汗をかいたりと生理的なものから始まり、思考も無意識下で動いているのです。
　その無意識下に移した考え事も同様に動きます。そして何かアイディアがひらめいたように意識下に伝えます。（この無意識化から意識下に伝えることもイメージします。）
　
　今、何かが降ってきた！
　
　こういう経験を持っている人は何人もいると思いますが、私はそれは無意識下で考え続けたことをそこでいいアイディアと判断したから意識下に伝えた結果だと思っています。
　私はこの一連の流れを意識するようになり、何かの作業中であっても別の作業のアイデアが思いついたり、新しい企画を思いついたりしています。(その考えが世間的にいいものかは別にして。。。)
　
　

まずは意識を向けてそれを無意識に向ける。

　意識していないからすべて無意識というわけではありません。意識して初めて無意識に向かい始めます。私はそう考えています。
　
　人の中身というのはまがわからないことだらけかと思います。でも自分の中身は少なくとも意識することで変えられるのではと思っています。

リーダブルコードを読んで。今のプログラマに必要なこと

noreply@blogger.com (ブログ) — Tue, 11 Sep 2012 09:15:00 +0000

　私はプログラマとして6年程勤めていますが、今まで経験したことは正直濃い経験だとはいえるものではありません。
　それは働き方というもののとらえ方の変化や自分への影響を与えてくれるもの、人がこの1年弱でその過去とは比較にならないほど濃いものだと感じるからです。これから先はもっと濃いものになるかなぁと感じており、さらに自分のアンテナを洗練させねばと張り切っている感じです。
　特にプログラマとしてITに関する技術は高いといえるものではありません。ここ数か月で出会った人たちからすると比較にならないだろうなと思えるほどです。
　それだけ過去の自分は深く考えずにプログラムというものに取り組んでいたんだと思います。
　
　ただ最近は技術はともかく意識は変わっていると自覚します。そのおかげか。ここ数日、通勤の読書が非常に有意義に感じる本がありました。
　「SonicGarden」という会社の創業者である倉貫さんという方から紹介された「リーダブルコード」という本です。

今までの経験をひっくり返されたこと

　教わったことが悪かったのか。自分の解釈が間違ってたのか。以前はコードをきれいに書くという考えは持っていませんでした。周りも「そんなものは自己満足。早く動くものを作るべき」という考えの人ばかりで自分も流されるように無駄なコードを「早く」書くことに専念してました。
　そのときに感じたもやもやはこの本によって今指摘されました。
　
　「そのコードは他の人だけでなく数週間、数か月先の自分にとってわかりやすくするべき」
　
　戻れるんなら戻りたいですね。あのころに。確かにその時はどういうロジックかわかってました。多少無駄があるなぁと感じながら「まぁここを扱うのは自分だけだし大丈夫」という油断から無駄なコードを量産。
　後になって似通ったコードだらけで修正や処理の確認をする際にまた1から追って。。。と無駄コードに無駄作業を繰り返していたのです。

きれいなコードはかんたんで読みやすい

　本にも書いていたのですが。最新技術を持って、短く圧縮して書いたコードが読みやすいかといえばそうではありません。
　時には1行にまとめられるコードも分散して書いたほうが後々の理解がスムーズにいく場合もあるのです。

すぐ返すことはすばらしい

　一つの関数の中でreturnが乱立するのはおかしい。一つの入り口に出口は一つだ。そう考えてた時期が自分にはあります。。。
　だってそう教えられたし。でもそれは違うようです。よほど複雑で何ページにも及び難解なコードでない限りその場で値を返すほうがいいのです。余計な処理を省くことができますし、画面内に収まる関数であればどこでreturnするか容易に把握できるのでそっちのほうがいいのです。

やっぱりと感じるとこもあれば「うそっ・・・私の知識、間違い」と感じる

　この「リーダブルコード」という本はそこまで分厚い本でもないのでさらさら読めるし、かといってすっからかんな内容でもない。著者が集めたデータをもとに記載されているので説得力もありますし、幅広い言語に応用が利く素晴らしい本になっています。
　上記のほかにまだまだ気になるトピックスがありますので今を生きるプログラマは一読の価値が十分にありすぎます。
　
　
　本をほめまくっているような内容ですが実際に読んでみて開発時に手元に置きたいくらい充実した、そしてとても読みやすい本だと思います。
　手法はその時々の流行があるのでずっとこれで大丈夫というわけではないと思いますが、今現在では十分通用する技があると思いますので、パソコンの横には常にこの本が常駐しています。

Railsを使っちゃうぞ！てかhelperの使い方ってなんなんだ！

noreply@blogger.com (ブログ) — Mon, 03 Sep 2012 06:17:00 +0000

仕事ではまだまだPHPerですが、9月をもって正式にRubyestに移行しています。あくまで自称です。
　そんな中、初心者コースから開発を始めてみて「helper？？？」ってなったのでhelperってどこでどうやって使うんだろうということから議事録的に書いています。

そもそもhelperって。。。

　サンプルアプリ程度なら、「helper？何に使うの？とりあえず置いとくか。。。」ってなるでしょうが、ある程度込み入ったアプリを作成するようになると単純にMVCだけ扱っていればいいというわけにはいきません。
　viewなんかは処理のレスポンスによって表示したいものなどが変わり、分岐が出てくる場合があると思います。
　この時、controllerで処理をまとめてしまうという手法をとる人もいるかと思います。しかしそのやり方は自分は間違いかなと感じています。
　何もかもcontorollerにまとめてしまい、viewはただ表示させる。modelはデータを管理するだけだとcontorollerがパンクしてしまいます。そもそもMVCにおけるcontrollerは情報を収集する場所であって特定処理の判断であったりデータの加工を行う場所ではないと考えています。
　では表示に関する判断系の処理やデータ加工処理はviewで行うのでしょうか。
　PHPを使っている人ならまずSmartyが思い浮かぶと思います。controllerからのレスポンスデータをSmartyタグで判断、加工し表示することでviewにもcontrollerにも処理が偏っていません。
　helperはこのSmartyと同じような立ち位置に感じます。
　
　

helperを使うことでviewとcontorollerをすっきりさせる。

　helperをどういう場面で使うかというと、ログインユーザによる権限である項目の表示可否やページネーションでのページリンク、エラー表示などview側で処理の分岐が発生する場面で使用するのが望ましいと思います。
　そうすることでcontrollerやmodelからviewにレスポンスを返す場合、view用の加工をすることなく渡すことができるのでその分すっきりしますし、view側もhelperが判断、加工を行ってくれるのでviewもすっきりします。

　今回、基本的なhelperの使い方についてまとめてみました。
　ここ違うよ！とかこんな使い方あるよ！とかそもそもMVCわかってんの！！！？という指摘がありましたらご連絡ください。そして勉強させてください。。。。

Blogger必見！関連記事をカンタンに作っちゃう。

noreply@blogger.com (ブログ) — Tue, 28 Aug 2012 06:43:00 +0000

　自分はこの先もBloggerを利用すると思います。使いやすさとデザインに惹かれ、FC2やseesaa、Yahooブログなどを経てBloggerにたどり着きました。
　もしかしたらWordpressなんてこともあるかもしれませんが、乗り換えるメリットをあまり感じていないため可能性は低いです。
　でもちょっと前まではWordpressへの移行を考え、システムをダウンロードしてまでデザイン案とかどんな動きを取り入れようとかSNS連携をどうしてやろうとか。。。。
　ちょっとどころかがっつり考えていてデザインを決めてWorodpressを構築した後の運営する姿まで想像していたのです。
　
　でもその間に状況は変わっていました。
　
　Wordpressで自分好みに作ろうとしていた機能や欲しいと思っていた機能がBloggerでも実施することができると知ったからです。
　中でも関連記事を簡単にできちゃったのにはびっくりしました。
　「でも自分でデザインしたい」という感情はあるのは確かです。自分好みを突き詰めたいとは思います。だがしかし！私にデザインセンスはありません。世の中にはもっと素晴らしいセンスを持った人たちであふれています。
　私はその人たちが作ったものを使う立場の人間だと認識しています！
　なので今回も関連記事については素晴らしいセンスを持った人たちが作ったものを使います！

必要な情報を入力するだけでガジェットが追加される。

　今回使ったのは「Linkwithin」。
　これさえあればBloggerに関連記事があっというまに作れちゃうんです。
　作り方はまずサイトにアクセス(http://www.linkwithin.com/learn)して必要な情報を入力します。
　1.メールアドレス
　2.関連記事を追加したいブログのURL
　3.ブログのタイプ(実はWordpressにも対応しています。。。)
　4.表示したい記事数
　
　以上の項目を入力してGetWidgetをクリック
　すると画面付きで説明がありますのでとても簡単に追加することができます。
　

　これで完了あとはブログを確認して実装されていればOK！
　
　
　ちなみに初期のままだと関連記事を表示するタイトルは
　「You might also like:」
　という英語表記になっています。
　
　これはガジェットの編集で
　Var linkwithin_site_id = ******;
　この下に
　var linkwithin_text = “関連記事”;
　を記入する事で日本語表記に出来ます。とても簡単！
　ぜひ試してみてください！
　

マウスの操作性が激変！いれてよかったChrome拡張！！

noreply@blogger.com (ブログ) — Mon, 27 Aug 2012 08:41:00 +0000

　私はブラウザはGoogleCromeを使っています。まずデザインがかっこいいから。機能とか使いやすさとかもありますがデザインで選んでます。
　で、そんなGoogleChromeを触っていくにつれてデザインだけでなく機能面からも魅力を感じるようになりました。中でも拡張機能は自分の好みのブラウザを作れるとあっていじり始めたら止まりません。
　拡張機能の説明がもう本家をはじめ様々な方が散々されているのでここでは省きます。ここでは私がChromeを扱ううえでこれだけは外せない！プロジェクトに参画してまず行う環境設定でもChromeにこれは最初に入れる！という拡張機能を紹介させていただきます。
　
　・Scroll to Top Bar [BBmod]
　　　：https://chrome.google.com/webstore/detail/ejopjkiccflkkaepdhekkdhknokigddo?hl=ja
　・AutoPager Chrome
　　　：https://chrome.google.com/webstore/detail/mmgagnmbebdebebbcleklifnobamjonh?hl=ja

　この二つだけはChromeを使ううえで外せない拡張機能になってます。
　

　

どんなにスクロールしても一発でTOPに行ける！

　まずScroll to Top Bar [BBmod]についてですが、インストールしても最初は機能しているのかどうかわかりません。

　ですが少しスクロールするとわかるんですが、画面の上に薄い影ができると思います。そしてその影はマウスでクリックすることができ、クリックすると。。。
　
　ページの一番上までスクロールを戻してくれるんです。
　
　これはメニューが固定されているページを参照し、下のほうまでスクロールしたときや、ページのヘッダ情報などを確認したいときにいちいちマウスのスクロールをガリガリ上に回さずともクリック一つで上に戻してくれます。
　結構スクロールしてふと一番上の情報をまた見たくなった時なんかはものすごい便利に感じます
　
　

次のページを自動で表示してくれる！ページ番号をクリックしなくてもいいんだ！

　つづいてAutoPager Chromeです。これはよくfacebookなどで下までスクロールすると続きを自動で表示してくれる機能があると思うんですがそれをChromeで実装してくれる拡張機能です。

　インストールした後、Google検索していただくとすぐわかると思いますが、下までスクロールされたことを確認すると自動で2ページ目の検索結果一覧を表示してくれます。
　この機能。Google検索だけでなく、他のページでも対応してくれるので記事を読むときいちいちページ番号をクリックして次のページを表示して。。。というめんどくさい動作を省いてくれます。

二つの拡張機能を合わせるとマウス操作が激変する！

　上記に紹介した拡張機能ですが私にとって二つを使うことに意味があります。確かにひとつひとつ便利な機能ですが併せて使うことにより、かなり便利な機能として成り立ちます。
　複数ページがあるWebサイトでもスクロールするだけで全ページを見ることができますし、ヘッダ情報やGoogle検索であれば検索条件を変えたいからTOPにスクロールしたいと思えばうすーい影をクリックしてTOPへひとっとびできます。
　
　これは中々便利です。いろいろ拡張機能を使っていますがこの二つはおすすめします。
　ぜひ使ってみてください。

jQueryにブン投げ！ページネーションを実装する

noreply@blogger.com (ブログ) — Mon, 20 Aug 2012 07:47:00 +0000

　Webサイトの開発をやってるとめんどくさいこととしてページネーションがあります。
　よく「<<　<　1 2 3 ・・・ 10 >　>>」とか「最初へ　前へ　1 2 3 ・・・ 10 次へ　最後へ」みたいな大量にあるデータを参照するために20件ずつ区切って表示させたりするWebページはよく見ると思います。
　このようないわゆるページ割りの機能を初めて実装することになったときあまりのめんどくささに「おい。。まじかよ。。。」とぽろっとつぶやきました。
　この時は初めて対面したこともあり、プラグインという発想はなく、HTMLのhiddenとphpのPOST、GETを自分なりに駆使して対応しました。今思えばなんと非効率的か！！
　そしてphpに触れる時間が増え、ZendやCakeといったフレームワークに触れていく中でプラグインというものを知り、その中でCakephpのcakephp-search-paginationというプラグインを使って開発するようになり「ページネーションすぐできたｗｗｗすげぇｗｗｗ」ってなりました。
　今回、その「ページネーション」に関することなのですがphpではなくjQueryのプラグインでかんたんにできたという記事です。

どんな要素にも対応できるページネーションのプラグイン「paginator.js」

　まずはhttp://archive.plugins.jquery.com/node/12295からpaginator.jsをダウンロードします。
　

<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript" src="paginator.js"></script>
<script type='text/javascript'>
$(function() {
itemsPerPage = 3; //指定要素内の区切り数
paginatorStyle = 4; ページネーションのスタイル（from1-4）
paginatorPosition = 'bottom'; //ページネーションの配置（bottom,top）
enableGoToPage = true; //指定ページに飛べるようにするか（false）
$("#id名").pagination();
});
</script>

　headタグで上記のように設定したらあとはbodyタグの中で

<div id="id名">
<p>テキスト</p>
<p>テキスト</p>

</div>

　と設定するだけです。ちなみに<div id="id名">～</div>で囲めばテーブルとかにも対応してくれます。
　データを全件抽出してタグで囲めばいいだけなんでものすごく楽です♪
　
　
　ただ問題があるとすれば一度内部でデータを抽出してページネーションを行うので抽出するデータの件数が膨大になると処理が遅くなるということ。
　実際にスペックが劣る環境(メモリは4GあるけどシングルコアなCRU)とある程度スペックが確保されている環境(メモリは2GでCOREi3なCPU)で比較すると体感でわかるくらい処理が遅かったです。
　※ともにOSはwindows7
　
　
　取り扱うデータによって使い分ける必要はありますが、比較的軽いデータやめちゃくちゃハイスペックな環境で開発する場合はjQueryプラグインは楽だなと感じました。

CSSだけじゃない！めんどうな作業を削ってくれるHTMLジェネレータ

noreply@blogger.com (ブログ) — Mon, 13 Aug 2012 06:10:00 +0000

　Webアプリを作成しているとき、ちょっとしたサンプルコードを作成してデザインとかスクリプトの動きを確認したいときってあると思います。
　自分なんかは特にまずサンプルコードを動かしてみてそれが動くことを確認した上でコードの添削に入ります。そして添削したコードを開発しているコードに埋め込みます。
　そこでいつも面倒に感じていることはHTMLファイルを作成する際のheadタグやmetaタグです。あらかじめテンプレートを用意しておけばと思うのですが、ついついいらないと削除したりして、また数日後に試したいことが出てきたときに1からHTMLタグを書くという、どっからどうみても効率が悪い手法をとっていました。
　最近ではCSSをはじめジェネレータというものが出てきてちょっとした煩わしい作業が削られつつあります。
　そんな中、とうとう私の煩わしい作業がなくなるジェネレータが登場したのです。（少々大げさです。。。）
　その名もまさに『HTML5テンプレートジェネレータ』です。

面倒な文字コードの設定とかmetaタグを作ってくれる。

　サイト(http://mizzz.jp/tg/)を見てもらうとわかるのですがマウス操作のみでHTML5の大枠を作ることができるのです。文字コードもUTF-8やSJISの選択が可能でjavascript、CSSの読み込みがあればそのタグも追加してくれます。
　必要な情報を入力してコードを生成すればあとはそのコードをHTMLファイルにコピペしてbodyタグの中を書いていけばいいだけ。たったこれだけ。

　ちょっと実験的にHTMLを作りたいと思った時に既存のHTMLファイルをコピペして中身を開き、bodyタグ内をいったん消してheadタグを見直して。。。とかやっていたころが懐かしいです。
　今ではHTML5のコードが作りたかったらここから生成して貼り付けています。

面倒な作業を削るだけでない。ジェネレータを使うことによって

　このジェネレータは単にコードがすぐできるという他に「きれいなコードに揃えることができる。」というメリットもあると思います。
　個人で開発をやってるとコードが汚くなってくると最初は細かい修正もしていたのですがだんだん「めんどくさい」となってしまいます。そして出来上がる統一感0のmetaタグ。。。あっちのページとこっちのページは同じディレクトリなのに違う設定になっている。文字コードが違っている。etc
　動けばそれでいいとは思いませんが、勉強用に。とか使うのは自分だけだし。とか考えるとついつい隙が生まれちゃうものだと思います。
　
　100％確認しなくていいとは思いませんが、少なくともジェネレータを利用すれば統一されたコードを容易に作ることができるので後々の確認が今までより数段楽になると思います。

　コピペばかりしないで自分でコードを書く。という人もいますし私もどちらかといえば自分で書いたほうがいい派ではあります。
　しかし、コピペも多用ではなく使用くらいにしてバランスよく使いこなせば効率のいい作品ができるのかなと最近思ったりします。