読者です 読者をやめる 読者になる 読者になる

時計を壊せ

駆け出しWebプログラマーの雑記

about.meをやめてオレオレabout.meを作った

もう去年の11月頃の事になるが、仕事の一環であるイベントに参加した。
イベントの参加者のエンジニア志向の学生と名刺やtwitter idなどを交換した。


当時の僕のtwitterのプロフィールなどに載せているURLはabout.meだった。
about.meは良いサービスだ。お手軽に自己紹介ページを公開出来る。似たようなWebページをわざわざ書かなくていいし、車輪の再発明を防ぐ。
しかし、当時のabout.meはスマートフォン向けにUIが最適化されなかった。スマートフォンでWebを閲覧する人が多い時代にこれは致命的だった。(現在はスマートフォン向けにもUIが最適化されてるようだ)*1
また、僕はWebエンジニアの端くれだ。仕事ではPerlでバックエンドサーバーのコードを書き、必要があらば新しいミドルウェアの導入からサーバーの構築、HTML/JS/CSSのコーディングから、AndroidアプリのためにJavaでゴリゴリロジックを組んだり、JNIを使ってCライブラリのバインディングを書く事もある、なんでも屋なWebエンジニアだ。
Webエンジニアのくせに自分のWebページすら自分でコーディングしてないのはどうなのだろうか。自己紹介ページ程度すら自分で組めないのか?今日会った学生にはあのひとは自身の自己紹介のWebページすら組めないようなエンジニアだと思われたりしないか?口だけのクソエンジニアだと思われたりはしないか?もしかしたら自分は死んだほうがいいのでは?などいろいろなもやもやした思考が駆け巡った。


そんなもやもや家に帰ってから1時間くらいでデザイン組んで2時間くらいでごりっとコーディングした。現在の様子がこれである。
http://karupas.org/


デザインは zurui-design // Speaker Deck を参考にしつつ、背景画像は適当なフリー素材をググって見付けて利用した。
CSSはそんなに得意では無いのであまり自信が無いがとりあえずゴリッと書いたきがする。あんまり覚えてないけど、たぶんCSS得意な人からしたらだいぶクソなCSSなんだろうとおもう。
CSSフレームワーク使ってたらなめられそうだからnormalize.cssだけ使ってごりーっと書いた。
コンテンツもてきとーにGithubとかから取ってきて埋め込むことにした。
モバイル向けのWebアプリを仕事で作ってるのにスマートフォン対応しないのもどうなんだろうと思って、昔ながらのリキッドレイアウトに加えてフレキシブルボックスを使ってなんちゃってレスポンシブな感じのを実装した。
でも、iPhoneとかで横幅が揃わなかったり、うまいこといかなくて次の週くらいにCSSをなにか修正した気がする。どう修正したかはあんまり覚えてない。
Angular.jsを初めて使ったがドキュメントが充実してて、サンプルコードも多く、あまり苦労せずに組めた。


当時のコードはこんな感じだった。(是非HEADのコードもみてもらいたい)
https://github.com/karupanerura/Profile/tree/e9e1b49b0a1bfe94f2918f17ca40587de0ea3b3b


もやもやした思いをコードを書くことによって晴らすことができて、エンジニア感あったし、いいかんじだった。
コード書き始めたのが24時頃で、次の日は仕事で、なるべく短時間でつくりたくてタイムアタック感あって楽しかった記憶がある。
あと、興味あったけどネタがなかったanguler,jsを試すにはちょうどいい題材だった。
こういうの楽しいしみんなやると面白いんじゃないかと思った。

*1:もしかしたら当時も既にこの施策は実施されていたかもしれないが長らく自分のabout.meを見ていなかった僕のabout.meに対する印象は昔のままだった。