最近のJavaScript開発まとめ
こんにちは、中川です。 ここ1・2年ですが、私の担当するプロジェクトでは、 PHPよりもJavaScriptの開発が多い状態が続いております。 JSのプロジェクトを重ねるにつれ、開発環境も段々と整理されてきましたので、 一旦、最近のJS開発で利用しているライブラリやツールなどをまとめてみました。 フレームワーク ●Backbone.js http://backbonejs.org/ JavaScriptのMVCフレームワーク。 何も使わない(もしくは我流)よりは、これを使って欲しいと思えるフレームワークです。 利用者が多く日本語情報も豊富にあるのと、フレームワーク自体が1500行程度と軽量なため、学習コストを低く抑えることができます。 ●AngularJS http://angularjs.org/ データバインディングを備えたフレームワーク。 高機能なテンプレートや、DIの仕組み、ルーテ
JavaScriptでうっかりやってしまいそうなこと色々
こんにちは、中川です。 今回はJavaScriptで開発していると、うっかりハマってしまうちょっとした罠たちを紹介したいと思います。 JavaScriptでの開発経験者であれば、どれか一度はひっかかったことがあるのではないでしょうか？ String ●String#replace()は文字列指定では全部置き換えない 対象文字列を一括して置き換えたいなどでString#replace()を使いますが、 検索対象を文字列で指定してしまうと最初に一致した部分しか置換しません。
【Javascript】consoleオブジェクトが持つlog以外の便利メソッド18（前編）
こんにちは、橋本です。 今回と次回の２回にわたり、Safari、ChromeのWebインスペクターやFirefoxのFireBugで使えるconsoleオブジェクトの使い方について書いてみたいと思います。 Javascriptのコードをデバッグする際に、console.logを使ってメッセージやオブジェクトの内容をログに表示することがあるかと思いますが、 この「console」オブジェクト、実はlogメソッド以外にも複数のメソッドがあります。 まずは、consoleオブジェクトにどのようなメソッドがあるか、console.logを使って表示してみたいと思います。 consoleオブジェクトの中身を見てみると、__proto__オブジェクトに以下のメソッドが定義されています。 assert count debug dir dirxml error group groupCollapsed g
もうアイコン画像はいらない！ Webフォントを使って、iOS風タブバーとアイコンを作成する方法
こんにちは、鴨田です。 最近、アイコンがセットされたWebフォントを使うことで、 画像を使わずにアイコンを表示するという手法が流行っていますね。 すごく興味はあったのですが、なかなか使う機会もなく、 便利そうだなと思っていただけで、今まで使ったことがありませんでした。 しかし、先日、とある案件でやっと使う機会に恵まれたので、やり方をご紹介いたします。 (プロトタイプだけ作って、結局プロダクトとしては使いませんでしたが・・・) 最近話題になっていたこちらのサイトがとても便利です。 Fontello - http://fontello.com/ 使いたいフォントを選択します。 ここでは、「Entypo」フォントから5つ選択します。 選択が終わったら、上部のタブから「Edit codes」をクリックします。 アイコン画像の上部のバーをクリックして、アイコンに割り当てる文字列を決めます。 英語で頭
JavaScriptのクロスドメイン問題対応方法
<!DOCTYPE html> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JS_CrossDomainテスト</title> <script language="javascript"> <!-- var winEntPopup; //メッセージが送られたときに反応するイベントリスナー window.addEventListener("message", receiveData, false); //データを受け取る関数 function receiveData(e) { document.FormTest.bro_info.value =e.data; } //ポップアップで呼び出し function fnc_popupWindo
JavaScriptのコーディング規約を気軽にチェック
こんにちは、中川です。 今回は「Google JavaScript Style Guide」を気軽にチェックできるClosure Linterをご紹介したいと思います。 http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml Google JavaScript Style Guideのいいところですが、 規約だけでなく、しっかりしたツールも揃っているところが素晴らしいと思います。 コーディング規約はあったとしても、それに従っているか定期的に簡単にチェックする方法がないと、 いつしか守られないまま開発されてしまうことになりますね。 ※今回の内容はMacにて動作確認を行なっています。
使えるとちょっと便利なSSHのTIPS
こんにちは、牧野です。久々の、9か月以上ぶりのブログです。。 仕事では、ここ1年近くずっっとインフラ関係のことをやっていました。 今日は、SSHに関するTIPSを紹介します。 １. 特定のサーバーにSSHログインする時に、特定の設定を使用する ホームディレクトリ/.ssh/configファイルに設定を書いておくと、特定のサーバーにログインする時に、自動的に特定の設定を使うようにできます。 SSHのオプションをサーバーによって分けたい時に入力が楽になります。 以下は、xxx.yyy.zzz.aaaでアクセスする時に使う秘密鍵をid_rsa_testに設定しています。 .ssh/config Host xxx.yyy.zzz.aaa IdentityFile /home/asial/.ssh/id_rsa_test ２. ホストキーをチェックしないようにする LinuxからサーバーにSSH接続
screen(だけ)の時代は終わり。tmuxでリモートコンソールを便利に使うTips
でサクっとインストールできます。tmuxコマンドをタイプすると、コンソールが表示されると思います。 ○ よく使うtmuxコマンド 私は下記のコマンドをよく使います： tmux attach - すでに開いたセッションにアタッチする tmux list-windows (C-b w) - ウィンドウの一覧を取得する tmux new-window (C-b n) - 新しいウィンドウを作る tmux detach-client (C-b d) - クライアントをデタッチする tmux list-keys (C-b ?) - キーバインドの一覧を表示する tmux next-window (C-b n) - 次のウィンドウを表示する tmux previous-window (C-b p) - 前のウィンドウを表示する tmux kill-window (C-b k) - ウィンドウを強制的に
HTML5+CSS3の導入時に役立つ7つの設定
こんにちは、鴨田です。 個人的に仕事の大半はスマートフォン関連なので、 最近のマークアップはほとんど全てHTML5+CSS3で行っています。 とはいえ、PC向けのサイトではまだまだHTML4.01、XHTML1.0、CSS2.1を使用している場合が多いと思います。 ですので、今回はHTML5+CSS3を導入するにあたって、役立つと思う7つの設定について、書きたいと思います。 １．HTML5の初期テンプレート案 <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>HTML5 初期テンプレート</title> <!-- reset.cssの設定 --> <link rel="stylesheet" media="screen" href="reset.css" /> <!-- Viewportの設定 --> <meta nam
jQueryだけ使うのが馬鹿らしくなる。KnockoutJSに触れる
久保田です。最近KnockoutJSというJavaScriptフレームワークを勉強しています。 KnouckoutJSはjQueryの上に構築されているフレームワークです。jQueryのみ使うのと比べてKnockoutJSを利用すると、ウェブページ上のインタラクションを圧倒的に簡単に記述できます。この記事では、簡単にKnockoutJSの概要を説明し、KnockoutJSを用いたデモを紹介します。 このフレームワークの特徴としてあるのは、HTML内に宣言的な記述を埋め込むことでインタラクションが実装できることです。HTML5のカスタム属性(data*属性)を用いて、その要素に関する処理を宣言してきます。裏側の処理は、JavaScriptでViewModelを定義し、そこにビューが必要とする値を管理します。 例えば、あるチェックボックスにチェックを入れると下の要素がトグルする簡単な例は、以下
Gitを使い始めたらやっておきたい便利な設定いろいろ
こんにちは、中川です。 Gitを使い始めてから、Subversionを使う機会がめっきり減ったこの頃です。 Gitだとローカルだけで簡単に使い始められるのもいいですが、気軽につくれるbranchや、mergeのしやすさがたまりませんね。 インストール直後の状態でも普通に利用できますが、 ちょっとした設定でさらに使いやすくなる方法をご紹介したいと思います。 ※今回ご紹介する内容はいずれも私のMacBook上での動作確認となり、Windows環境は考慮していませんがご容赦ください。 ■ユーザー名とE-mailアドレスの設定 まずは、最初にユーザ名と、メールアドレスを設定してしまいましょう。 $ git config --global user.name "yoshiki" $ git config --global user.email "yoshiki@example.com"
AndroidにおけるLauncherアイコン、背景画像の作り方 - アシアルブログ
はじめまして。鴨田と申します。 年初からアシアルにてデザイナーとして働いており、 今日からブログも書くようになりました。 どうぞよろしくお願いいたします。 さて、今日はAndroidにおけるLancherアイコン制作を中心に、 お話をさせていただきたいと思います。 なぜ、この話題かというと、アシアルでは現在、 Androidアプリの制作を積極的に行っていて、 正式なプレスリリースは明日行いますが、 今日から、「ClapClap Clock」というAndroidアプリがAndroid Marketにて、 無料公開されています。 どんなアプリかというと、拍手に反応して、 現在の時刻を声で知らせてくれるという時計ユーティリティです。 興味のある方は是非インストールして頂ければと思います。 今回はそのデザインを自分が担当したので、 そのときに参考にしたデザインガイドラインを大まかに翻訳しながら、
node.jsの開発時に役立つモジュール
こんにちは、中川です。 今回もPHPには一切触れないで、node.jsについて書いていこうと思います。 主に開発時に便利なモジュールを紹介いたします。 ■今回紹介するもの ・nvm ・node-dev ・node-inspector ■nvm ・https://github.com/creationix/nvm node.jsはまだまだ開発途上ということもあり、頻繁にバージョンアップが行われています。 現在では0.2系のstableバージョンと、0.3系の開発バージョンがあります。 複数のバージョンをインストールして、簡単に切り替えられるようにするために、 開発環境では、nvmを使っています。 セットアップは非常に簡単で、
今さら聞けないSubversion使い方まとめ
皆さん、こんばんは。笹亀です。 ご挨拶が遅くなりましたが、明けましておめでとうございます。 今年も良いブログを皆さんにご提供できるように頑張ります！ 先日のニュースでAppleCEOのスティーブ・ジョブスさんが病気で休暇に入るとの心配なニュースをみました。急なことでとても心配です。１日も早い復帰をお祈り致します。 さて、本日はSubversion(svn)の基本コマンドからよく使うコマンドやこだわりの使用方法まで一気にご紹介します。いろんなサイトを観て確認しながら使うことが多いので、よく使うコマンドやこだわりの方法をメインにご紹介できればと思います。 まずは基本コマンドの紹介です。 ーーーーーーーーーーーーーーーーーーーーーーーー ■基本コマンド １．バージョン管理されているモジュールを取り出す
Titanium で iPhone開発を始めるときに気をつけておきたいこと７つ
こんにちは、亀本です。 本当は今日はアシアルの日常を書く、という名目のブログ当番なんですが、どうせエンジニアの日常なんてコード書いてますよね。 ということで、最近使ってみたTitaniumについて書いてみる事にしました。 さて、最近ちまたでTitanium Mobileがあつい！という話が出ていて、入門記事もいろんなところで上がり始めていますね。 Titaniumをご存じない方のために簡単に説明しておくと、JavaScriptを使ってiPhone/Androidアプリを作ってしまおう、という物です。 果たしてどんなもんか！と、手元で作成中だったアプリをTitaniumを使って再実装してみたのですが、世間で言われるとおり所々で凝った事をしづらいものの、想像していたよりはずっと、リッチ・簡単・高速に作れる印象でした。 早い、安い、うまいなんてぎゅうどｎ(ry その開発の際に、Objective
sshでポートフォワード
sshには言わずと知れた「ポートフォワード」という機能があります。 読んで時の如しで、sshの暗号化されたトンネルを利用し、任意のポートに来た通信を転送できます。 何がうれしいかと言うと、リモートの 5432番 をローカルの 5432 にマッピング出きる。 つまり、sshさえ繋がれば、そのサーバから見える範囲ならなんでも使える！と言うことです。 1・ローカルへリモートのポートをマッピング 例えば、二つのホスト（chiba, shiga）があるとします。 chibaに、shigaの5900ポートをフォワードする場合は以下のようになります。
システムの品質向上のお供に使えるツール達
こんにちは、中川です。 今回は、私が普段の開発で使っているツールを紹介したいと思います。 と言いましても、開発中というよりは、開発後半・テスト段階などでの品質向上に役立つことが多いと思われるツール達を取り上げてみました。 Firebug ・https://addons.mozilla.org/ja/firefox/addon/1843/ ・Firefoxアドオン。 ・JavaScriptのパフォーマンスチェックや、エラーチェック。ファイル・ページの読み込み時間チェックに。 ・開発初期から大活躍ですね。 HTML Validator ・https://addons.mozilla.org/ja/firefox/addon/249/ ・Firefoxアドオン。 ・HTMLの妥当性チェック。HTMLが汚いと保守フェーズに影響大ですね。 ・あまり最初は気にせず、最後のほうで一気にチェックしつつ直し
知っておくと役立つかもしれないLinuxコマンド(サーバ確認関係）
こんばんは、牧野です。 一時期また夜型になってしまっていたのですが、最近はまた朝型生活、というよりも早朝型生活になりました。 仕事の方はというとsymfony案件は一段落して、今はオリジナルのフレームワーク、ライブラリでプログラムを作ったり、javascriptのプログラムを1から書いたりと、マイペースでやっています。 さて、今日も軽めなネタで、知っているといざという時に役立つ、かもしれないLinuxのコマンドです。 サーバ構築や緊急対応などでサーバを触る場合は使う機会があると思います。 ■サーバのOS情報を確認
DRBD+heartbeat+LVM(on Fedora Core10)によるクラスタリング
こんにちは、亀本です。 今回は、PHPとかから少し離れて、サーバのクラスタリングのお話です。 ちょっと仕事で冗長化システムを組む必要があったので、せっかくなので記事にまとめました。 さて、ここで目指すのは、DRBDを使ったデータレプリケーションサーバ( Master / Slave 構成 )の自動フェイルオーバークラスタ( 非フェイルバック構成 )です。 ネットワーク構成としては、ルータから結ばれるLAN(eth0に接続)とは別に、eth1で１対１のLAN接続を行います。 また、heartbeatでのクラスタ構成後は、eth0に仮想IPとして192.168.1.100を割り振るようにします。 eth1の設定は、 # vi /etc/sysconfig/network-scripts/ifcfg-eth1 DEVICE=eth1 HWADDR=00:00:00:00:00:00 ONBOOT
座標から地名を取得する逆GeocodingAPIのまとめ + サンプル
こんちは。松田です。 トレイン・トレインで使用しているGoogleMapをいじっている時に座標（緯度・経度）から地名を取得する必要が出てきたので、その際に調べた逆Geocoding機能を実装したAPIをまとめてみました。 GoogleMapsAPIなど地図を使ったシステムを使用していると、住所から緯度経度などの情報を取得する方法が必要になります。これはGeocodingと呼ばれる技術で、GoogleMapsAPIではすでに公式なAPIが存在しています。 これとは逆に、ユーザーに登録させたスポットの地名を自動入力させたりする場合など、座標から地名情報を取得したい場合があります。これらは「逆Geocoding」や、「Reverse Geocoding」などと呼ばれていますが、現在のところGoogleMapsのAPIは提供されていません。 この逆Geocoding機能が使えるサービスをいくつか紹
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
