調査メモ

2014/01/30

gitignoreファイルを作成する「node-gi」を公開しました

gitignoreファイルを生成するためのコマンドラインツールを作成したので、npmで公開しました。

中身は http://www.gitignore.io/ にリクエストを投げて、結果を返してるだけです。

詳細は以下を参照してください。

2013/06/26

bootstrap-selectを試してみる

概要

bootstrap-select

bootstrap のデフォルトでは selectタグのスタイルはイマイチ。

bootstrap-selectを使用すると、selectタグを Button dropdown menu に置き換えてくれる。

テストページ

bootstrap-select.css, bootstrap-select.js を読み込む

スタイルを変更したい selectタグに selectpickerクラスをセットする

$(document).ready にて $(".selectpicker").selectpicker();を実行する

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>ぶーとすとらっぷ せれくと</title>
    <link rel="stylesheet" href="vender/bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet" href="vender/bootstrap-select/bootstrap-select.min.css" />

    <style type="text/css">
        body {
            padding: 40px;
        }
    </style>
</head>
<body>

    <form class="form-inline">
        <select id="s1" class="selectpicker" name="s1">
            <option value="1">hoge</option>
            <option value="2">foo</option>
            <option value="3">bar</option>
        </select>

        <button id="hoge" class="btn btn-primary">Get Value</button>
    </form>

    <input id="t1" type="text" readonly />

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
    <script src="vender/bootstrap/js/bootstrap.min.js"></script>
    <script src="vender/bootstrap-select/bootstrap-select.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function(){

            //enable bootstrap-select
            $(".selectpicker").selectpicker();

            //click hoge button
            $("#hoge").click(function(){
                $("#t1").val($("#s1").val());
                return false;
            });

        });
    </script>

</body>
</html>

今、開発中のアプリで使おうかと思ったけど Internet Explorer 7だとちょっと表示が変だったので、今回はbootstrap標準のselectタグを使う。

2013/06/11

[ASP.NET MVC2] 簡単なカスタム認証機能の実装

環境

Visual Studio 2010
.Net Framework 4
ASP.NET MVC2
PostgreSQL 8.4

概要

LoginとMenuの2画面
未認証状態でMenuにアクセスするとLoginに戻される
PostgreSQL上でアカウント管理を行う

プロジェクトの作成

プロジェクト名： CustomAuthorize

Githubレポジトリ CustomAuthorize

パッケージ追加

NuGetで必要なパッケージを追加

Npgsql
PetaPoco.Core
log4net
Bootstrap
(jQuery 1.9.1) Bootstrapと一緒に追加される

log4net.config

構成ファイルを追加
ファイル名: log4net.config

ファイル名に日付を付けてローテートさせる

Global.asax.cs

初期表示パスを /Login/Index に変更
Application_Start() にてlog4net設定ファイル読み込み

Controllerの作成

LoginController
とりあえず空っぽにしておく
MenuController
未認証ではアクセスできないように classに [Authorize] を設定

Viewの作成

マスターページを作成

MVC2 ビューマスターページを Views/Shared に追加

Site.Master

ログインユーザー名を Session["USER_NAME"] から取得し、ヘッダー部分に表示
ログアウトボタン押下で LoginController/Logoff に Ajax($.get) で問い合わせ
結果に関わらず Login画面に遷移

Login View を作成

LoginController.csを開く
Index Methodを右クリック → ビューの追加を選択
Login/IndexはSite.Masterを使用しない
Login/Index.aspx

LOGINボタン押下で LoginController/Authenticate に Ajax($.post) で問い合わせ
認証結果を受けて、メニュー画面に遷移

Menu View を作成

MenuController.csを開く
Index Methodを右クリック → ビューの追加を選択
Menu/Index.aspx

Modelの作成

Database(今回はPostgreSQL)の接続には PetaPoco を使用する

user.cs を作成

AccountManager.cs を作成

LoginController 実装

LoginController.cs

Authenticate: ログイン認証を行う
Logoff : ログオフ処理を行う

実行してみる。

初期表示で localhost/Login が表示される
認証せずに localhost/Menu にアクセスすると、 localhost/Login に戻される
localhost/Login で認証を行うと localhost/Menu に遷移する

2013/06/07

C#製の簡易O/Rマッパー PetaPoco を試してみる

PetaPoco

PetaPoco .NETの簡易O/Rマッパー。

とりあえずPostgreSQLで試してみる。 Getting Started With PetaPoco and Postgres

環境

Windows XP SP3
.Net Framework 4
PostgreSQL 8.4

プログラム作成手順

Databaseの準備

server: localhost
database: petapoco
owner: postgres

Visual Studioでコーディング

プロジェクト作成

コンソールアプリケーションのプロジェクトを作成

名前: PetaPocoTest

NuGet Package追加

NuGetすごい便利。
以下のパッケージを追加

PetaPoco.CORE
Npgsql
log4net

PetaPocoを追加すると、勝手にModelsフォルダが生成される。

POCOクラスの作成

いわゆるModel Class。
usersテーブルに合わせて以下のように作成

主キーが複数の場合は [PetaPoco.PrimaryKey("key1,key2")]

PetaPocoに管理させたくないプロパティには [PetaPoco.Ignore]

DataManagerクラスの作成

Databaseに接続し、PetaPocoを使用してデータを取得するクラス。

コンストラクタ

DbProviderFactoriesの指定は app.config にも書けるけど、記述が面倒なので引数で渡した。

GetUserBySystemIdメソッド

PetaPoco.Sql.BuilderにてSQLを組み立て。
きっと引数とかはちゃんとエスケープしてくれるのだろう。

テーブル作成時にキチンと指定していないけど、 system_idはユニークな想定なので、Fetchで返されたListの先頭を取得している。

Program.cs

Databaseからuserを取得し、名前をログに出力。

あたりまえだが、実際には GetUserBySystemId から返ってきた値が null かどうかチェックしないといけない。

参考

2013/05/15

WindowsでGitを使う(proxyとかFirewallの設定)

企業内のネットワーク配下でGitを使う際の設定について。
Windows XPでやってます。

Git for Windows をインストール

ウィザード内の選択肢で、コマンドプロンプトでgitを使うよう選択する。

以降の作業はコマンドプロンプトとGit bashどちらでも可能。

初期設定

git config --global user.name kazunori.kimura
git config --global user.email kazunori.kimura.js@gmail.com

proxy設定

Proxy配下の場合は以下の設定を行う。
環境変数 HTTP_PROXY を設定してたけど、見てくれなかった。

git config --global http.proxy http://{proxy_host}:{proxy_port}
git config --global https.proxy http[s]://{proxy_host}:{proxy_port}

gitプロトコルの対応

Firewallで git:// の通信が阻害されてしまう場合は。。。

$ git clone git://github.com/Kazunori-Kimura/MyPowerShellSnippet.git
Cloning into 'MyPowerShellSnippet'...
fatal: unable to connect to github.com:
github.com[0: 204.232.175.90]: errno=No such file or directory

以下の設定によって、自動的に git:// を https:// に置き換えて通信してくれる。

$ git config --global url."https://".insteadOf git://

参考: git:// protocol blocked by company, how can I get around that?

2013/05/13

node で Oracle に接続する

Oracle接続

Windowsにて、nodeでOracle 11gに接続し、値を取得したい。

結論

node-odbcで動いた。

事前準備

python
node-gyp
- gyp: Generate Your Projects
- Google Chromeのためのビルドシステム
- pythonで書かれている
- node-gyp: gypによるビルドファイルの生成からコンパイルまで行える
python2.7をインストール後、node-gypをglobalオプション付きでインストール
npm install -g node-gyp

node-odbcインストール

node-odbc

npm install node-odbc

node-gypのbuildで3箇所警告が出たが、一応インストールは成功した。

動作確認

とりあえず、単純なselect文を投げて結果を取得してみる

app.js

/*
 * oracle test
 */

var odbc = require("odbc");

var db = new odbc.Database();
var cs = "DSN=<DataSourceName>;UID=<UserName>;PWD=<Password>";
db.open(cs, function(err){
    var sql = "select foo, bar from HOGE order by foo";
    db.query(sql, function(err, rows, rs){
        //console.log(rows);
        var i=0;
        for (i=0; i<rows.length; i++) {
            console.log([
                i,
                rows[i]["foo"],
                rows[i]["bar"]
            ].join(", "));
        }

        db.close(function(){
            console.log("close.");
        });
    });
});

試行錯誤の経緯

試したmodule

node-oracle
- 上手くインストールできない。コンパイルで失敗する。
- node-gypで、-zオプションの使い方がおかしいといったエラー。
node-db-oracle
- node-wafを使用しており、コンパイルで失敗する。
node-odp
- インストールはできるが、うまく動かない。
- module内にバイナリファイル nodeodp.node があるが、これがx64用？

2013/05/06

[備忘録] node.js環境構築

node.js環境 (nvm, npm) をインストールする手順。今回はMacにて行ったが、Gitを使える環境であればWindows/Linuxで(ほぼ)共通。

Githubからnvmを取得する。

cd ~
git clone git://github.com/creationix/nvm.git .nvm
. .nvm/nvm.sh

nvmでダウンロード可能なnodeの最新バージョンを確認する。

nvm ls-remote

最新バージョンのnodeをインストール

nvm install v0.11.1

インストールされたか確認。nvmインストール時に最新のnpmもインストールされている。

node -v
npm -v

次回ログイン時以降に .nvm/nvm.sh が読み込まれるように、~/.bash_profile に登録

. ~/.nvm/nvm.sh

登録: 投稿 (Atom)