タグ

ブックマーク / blog.asial.co.jp (23)

  • 【Javascript】consoleオブジェクトが持つlog以外の便利メソッド18(前編)

    こんにちは、橋です。 今回と次回の2回にわたり、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

    【Javascript】consoleオブジェクトが持つlog以外の便利メソッド18(前編)
  • もうアイコン画像はいらない! Webフォントを使って、iOS風タブバーとアイコンを作成する方法

    最近話題になっていたこちらのサイトがとても便利です。 Fontello – http://fontello.com/ 使いたいフォントを選択します。 ここでは、「Entypo」フォントから5つ選択します。 選択が終わったら、上部のタブから「Edit codes」をクリックします。 アイコン画像の上部のバーをクリックして、アイコンに割り当てる文字列を決めます。 英語で頭文字を取るとか、abc~とかにするとかですかね。 文字列の指定が終わったら、フォントファイルのダウンロードを行います。 サイト右上にある「Download webfont(n)」をクリックしましょう。 「fontello-xxxxxxxx.zip」がダウンロードされます。 解凍して中身を見てみましょう。 fontello -cssフォルダ -icons.css -icons-codes.css -icons-ie7.css

    もうアイコン画像はいらない! Webフォントを使って、iOS風タブバーとアイコンを作成する方法
  • 続・イラストでわかるgit入門の入門:ブランチを切る

    drwxr-xr-x   3 masatoshi  staff  102  6 13 18:29 . drwx------+ 17 masatoshi  staff  578  6 13 18:28 .. drwxr-xr-x  10 masatoshi  staff  340  6 13 18:29 .git

    続・イラストでわかるgit入門の入門:ブランチを切る
  • JavaScriptのコーディング規約を気軽にチェック

    こんにちは、中川です。 今回は「Google JavaScript Style Guide」を気軽にチェックできるClosure Linterをご紹介したいと思います。 http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml Google JavaScript Style Guideのいいところですが、 規約だけでなく、しっかりしたツールも揃っているところが素晴らしいと思います。 コーディング規約はあったとしても、それに従っているか定期的に簡単にチェックする方法がないと、 いつしか守られないまま開発されてしまうことになりますね。 ※今回の内容はMacにて動作確認を行なっています。

    JavaScriptのコーディング規約を気軽にチェック
  • イラストでわかる!git入門の入門

    こんにちは、アシアルの志田です。 社内でもgitが浸透し、皆バージョン管理といえばgitだよね、という空気になってきました。 ですが、これまでバージョン管理システムを使ったことがない人にオススメしても、 「gitて…まあ…そりゃ…ねえ、いつかやらないといけないけど…」 「ギット?ジット?俺はgiはジと読む派なので、gitは胡散臭いと思う」 「そもそもバージョン管理して何が嬉しいの?なんか難しそうでいやだ」 というような反応ばかりでした。 きっとみんな、gitって難しくて訳のわからんもんだと思っているのでは?と思い、 今回はgit入門の入門、gitってなんだ?というところから、簡単にgitを使う際の流れについてご説明します。 ちょっと不安を覚えるようなイラストがついていますので、頑張って読んでください。 バージョン管理ってなに? プログラムを書いていて、こんなことありませんか?私はあります…

    イラストでわかる!git入門の入門
  • 使えるとちょっと便利なSSHのTIPS

    こんにちは、牧野です。久々の、9か月以上ぶりのブログです。。 仕事では、ここ1年近くずっっとインフラ関係のことをやっていました。 今日は、SSHに関するTIPSを紹介します。 1. 特定のサーバーに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 2. ホストキーをチェックしないようにする LinuxからサーバーにSSH接続

    使えるとちょっと便利なSSHのTIPS
  • Twitter BootstrapでさくさくWeb開発 : アシアルブログ

    <div class="container-fluid"> <div class="row-fluid"> <div class="span4"> Span4の中身 </div> <div class="span8"> Span8の中身 </div> </div> </div> Preタグで囲むコード エンジニアの皆さんなら、ブログにコードを書きたいですよね。 Twitter Bootstrapでも、かっこ良くコードを見せる手法を提供しています。 ・codeタグで囲む 赤くなります。 ・preタグで囲む 囲み枠がつき、灰色になります。 ・Preタグ+Google Prettifyを使う preタグのclassに、prettyprint linenums を入れましょう。 これが超かっこいい!!コードを見せるならこれがよさそうですね! さて、かっこいいGoogle Prettifyですが、こ

    Twitter BootstrapでさくさくWeb開発 : アシアルブログ
  • screen(だけ)の時代は終わり。tmuxでリモートコンソールを便利に使うTips

    ※ コメントをいただきましたので、一部文を修正させて頂きました。 1.サーバー・クライアントモデルというのはネットワーク接続なイメージになってしまいますので、取り外しました 2.mouse-utf8に関してコメントを頂いたので補足しました 3.タイトルを「screenの時代は終わり。tmuxでリモートコンソールを便利に使うTips」から「screenだけの時代は終わり。tmuxでリモートコンソールを便利に使うTips」に変更しました(変な誤解を受けられた方がいらっしゃったため) お久しぶりの田中です。最近、ずっと大型案件に携わっていた関係で、あまりブログ等でのアウトプットができていませんでした。これからはドンドン書いていきますので、どうぞよろしくお願いします。日はGNU screenと同様の機能を持つtmuxを紹介します。 GNU screenやtmuxは、1つのターミナル画面上に複数

    screen(だけ)の時代は終わり。tmuxでリモートコンソールを便利に使うTips
  • HTML5+CSS3の導入時に役立つ7つの設定

    こんにちは、鴨田です。 個人的に仕事の大半はスマートフォン関連なので、 最近のマークアップはほとんど全てHTML5+CSS3で行っています。 とはいえ、PC向けのサイトではまだまだHTML4.01、XHTML1.0、CSS2.1を使用している場合が多いと思います。 ですので、今回はHTML5+CSS3を導入するにあたって、役立つと思う7つの設定について、書きたいと思います。 1.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

    HTML5+CSS3の導入時に役立つ7つの設定
  • jQueryだけ使うのが馬鹿らしくなる。KnockoutJSに触れる

    久保田です。最近KnockoutJSというJavaScriptフレームワークを勉強しています。 KnouckoutJSはjQueryの上に構築されているフレームワークです。jQueryのみ使うのと比べてKnockoutJSを利用すると、ウェブページ上のインタラクションを圧倒的に簡単に記述できます。この記事では、簡単にKnockoutJSの概要を説明し、KnockoutJSを用いたデモを紹介します。 このフレームワークの特徴としてあるのは、HTML内に宣言的な記述を埋め込むことでインタラクションが実装できることです。HTML5のカスタム属性(data*属性)を用いて、その要素に関する処理を宣言してきます。裏側の処理は、JavaScriptでViewModelを定義し、そこにビューが必要とする値を管理します。 例えば、あるチェックボックスにチェックを入れると下の要素がトグルする簡単な例は、以下

    jQueryだけ使うのが馬鹿らしくなる。KnockoutJSに触れる
  • Gitを使い始めたらやっておきたい便利な設定いろいろ

    $ git config --global user.name "yoshiki" $ git config --global user.email "yoshiki@example.com" ■カラーリング git status や git diffなど、デフォルトでは味気ない文字がズラズラと画面に表示されますが、それを見やすいようにカラーリングすることができます。

    Gitを使い始めたらやっておきたい便利な設定いろいろ
  • MacPortsの基本的な使い方とコマンド

    Macに移行して2ヶ月になりそうな今日この頃、ようやくMacになれてきた熊谷です。こんにちは。 MacというかOSX上で開発を行う上で欠かせないものにMacPortsがあります。前回もちょっと触れたのですが、今回はこれについてもうちょっと触れたいたいと思います。 MacPortsとはOSXで利用可能なパッケージ管理システムで、これを使うことによりOSX上でより良いUNIX生活を送ることができるようになります。私自身、まだMacPortsを使い始めたばかりで勉強中なんですが、それを忘れないようにするためにもメモ書きします。 まず、MacPortsをインストールするためにはOSXの開発環境であるXcode Toolsをインストールしておく必要があります。Xcode ToolsはMacに付属しているDVDかDeveloper Connectionからダウンロードしてインストールしておきます。で、

    MacPortsの基本的な使い方とコマンド
  • とても便利なvimのコマンド紹介

    こんにちは。小川です。 今日はvimのコマンドでも紹介しようかなと思います。 僕はテキストエディタは大体vimを使っています。 執筆をしたときもvimでやっていましたし、PHPvimで書いています。 vimって色々コマンドがあって便利ですよね。友達vimのコマンドを教えあったりして、度々「こんな便利なコマンドがあるのか!」と驚かされます。 今日はそんなvimのコマンドの中から普段使っていて便利だなーと思うものをいくつか紹介していきます。 ちなみにShiftを押しながらのコマンドは、アルファベットキーの場合は大文字で表記します。 エンターやエスケープを押下する必要がある場合はエンターやエスケープと記述します。「:」ではじまるコマンドモードはエンターを押さないと意味がないので、そこは省略します。 同時押しは+でつなげて表記し、基的には1文字ずつ順番に押下します。 ■ページ移動 「ggで」

    とても便利なvimのコマンド紹介
  • 今さら聞けないSubversion使い方まとめ

    ■よく使うコマンド 1.管理下にしないファイルやディレクトリはignoreで管理外にする 例)ignoredir内に格納されているファイルすべてをバージョン管理外に設定する

    今さら聞けないSubversion使い方まとめ
  • PHPerなら知っておいて損はない10の関数

    こんにちは。小川です。 日は数あるPHPの関数の中でも、わりと知られてそうで実は知らない人もいるかもしれない便利な関数をご紹介します。 ■nl2br 改行コードを<br />に変換する関数です。 <?php $string = <<<EOS foo bar baz EOS; echo nl2br($string);

    PHPerなら知っておいて損はない10の関数
  • Macを買ったらすぐ変更する設定

    こんにちは。 先日、新型MacbookAirの美しさに魅せられ、ついついMacbookAir13インチ特盛りをポチってしまった橋です。 今日は、弊社熊谷の記事「続・続Macを買ったらすぐインストールするアプリケーション」のインスパイアの意味も込めて、アプリではなく、Macの設定変更について書いてみたいと思います。 ※注意※ 今日ご紹介させていただく内容は、ターミナルからコマンドを入力して設定を変更するものです。試してみる際には自己責任でお願いします。MacOSX 10.6.5で動作確認済です。 では、早速。 1. デスクトップ上のアイコンを消す ちょっとしたファイルを保存するときに、ついついデスクトップに保存してしまうことってありませんか?自分はよくあります。ただ、このいい加減な習慣を続けていると、いつの間にかデスクトップがアイコンで埋まってしまって、せっかくの壁紙が台なしになってしまい

    Macを買ったらすぐ変更する設定
  • 知っておくと役立つかもしれないLinuxコマンド(サーバ確認関係)

    こんばんは、牧野です。 一時期また夜型になってしまっていたのですが、最近はまた朝型生活、というよりも早朝型生活になりました。 仕事の方はというとsymfony案件は一段落して、今はオリジナルのフレームワーク、ライブラリでプログラムを作ったり、javascriptのプログラムを1から書いたりと、マイペースでやっています。 さて、今日も軽めなネタで、知っているといざという時に役立つ、かもしれないLinuxのコマンドです。 サーバ構築や緊急対応などでサーバを触る場合は使う機会があると思います。 ■サーバのOS情報を確認

    知っておくと役立つかもしれないLinuxコマンド(サーバ確認関係)
  • 使えるとちょっと便利なLinuxコマンド

    こんにちは、牧野です。 最近、とても暖かくなりましたね。天気がいいことも多く、そんな日は外を散歩するととても気持ちいいです。 さて、今日は軽いネタで、ちょっと便利なLinuxコマンドを紹介します。 1.アクセスログを見る リアルタイムでログを見る時、tailをよく使うと思います。

    使えるとちょっと便利なLinuxコマンド
  • PHPスクリプトの遅い部分を簡単に見つける方法

    extension=xdebug.so xdebug.profiler_enable = 1 xdebug.profiler_output_dir = /tmp と設定して、apacheのリロードを行えばXdebugが動作します。 これで、あとは、ブラウザで調査したいページにアクセスすれば、 /tmp/ 以下にプロファイルデータが作成されていきます。 次にプロファイルデータの閲覧の為に、 http://sourceforge.net/projects/wincachegrind/からWinCacheGrindをダウンロードしてwindowsマシンにインストールします。 あとは、WinCacheGrindで作成されたファイルを取り込めば、関数ごとの 実行時間をたどりながら確認することができます。 ※WordPress2.7.1日語版インストール直後のTOPページで試してみた場合です。 We

    PHPスクリプトの遅い部分を簡単に見つける方法
  • 続・Macを買ったらすぐインストールするアプリケーション

    明けましておめでとうございます。熊谷です。あっという間に過ぎ去ったお正月休み、皆さんはいかがお過ごしでしょうか。今日から仕事始めの方が多いのではないのでしょうか。 もう昨年のことになってしまいますが、またMacユーザに戻りました。MacBook Airで懲りたはずなんですが、やはりその魅力に負けてしまいアルミのMacBookを購入してしまいました。そんなことで、今回は私がMacを買ったらすぐインストールするアプリケーションを紹介します。以前にも同じようなことをやっていますが、ほぼ1年前のことになるので、そこでは触れなかった(もしくは新たな)アプリケーションを紹介します。 Thunderbird 以前はOSX標準のMail.appを使用していたのですが、使い難いというかやはり使い慣れたメーラーが一番ということでこれに戻ってきました。 Adobe Photoshop Lightroom 写真管

    続・Macを買ったらすぐインストールするアプリケーション