環境整備
www.sfpgmr.netのリニューアルにあたりまずは環境整備を行った。
ちょうどVS2013 Community Editionがリリースされたのでそれに入れ替え、NTVSやWeb Essentialsをインストールした。そしてgithubにリポジトリを作った。
この環境を使って以下のサイクルで開発を行っていく。
- node.jsで開発環境にコンテンツを生成するコードを書く。
- クライアント・サイドのスクリプトを書く。
- テストする。
- 適当にcommitし、githubにpushする。
- gzip化し、WinSCPで本番サイトにアップロードして確認する
今回gruntを導入して楽しようと思ったけど、VS2013自体かなりのタスクを自動化してくれるのでやめた。 たとえばlessファイルのコンパイル・最小化、構文チェックなどはVS2013が自動的に行ってくれる。なのでgzip化してWinSCPでアップロードするところだけバッチを作って実行することにした。
バッチスクリプトは以下のとおりだ
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @ECHO off | |
| rem 元ファイルとgzファイルを比較して元ファイルが新しいものだけをgzip化 | |
| rem もし.gzファイルがない場合は作る | |
| rem 環境変数の遅延展開を可能にする | |
| setlocal enabledelayedexpansion | |
| for /R h:\pj\www\html %%1 in (*.*) do ( | |
| if "%%~x1" NEQ ".gz" ( | |
| set gzipf=%%1.gz | |
| if EXIST !gzipf! ( | |
| for %%g in (!gzipf!) do ( | |
| set tf=%%~t1 | |
| set tgzip=%%~tg | |
| if "!tf!" GTR "!tgzip!" ( | |
| @echo 日付が新しい: %%1 | |
| gzip -9Nfk %%1 | |
| ) | |
| ) | |
| ) else ( | |
| @echo gzファイルが存在しない: %%1 | |
| gzip -9Nfk %%1 | |
| ) | |
| ) | |
| ) | |
| // | |
| winscp /console /script="synchome.txt" |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| option batch on | |
| option exclude ".git;.ntvs_analysis.dat;node_modules;data;obj;metrop;less;" | |
| open scp://xxxx@hogehoge.net/ | |
| synchronize remote h:\pj\www\html /var/www/html/ -delete -mirror -criteria=time | |
| synchronize remote h:\pj\www\wwwnode /var/www/node/wwwnode/ -delete -mirror -criteria=time | |
| exit | |
JSON-LDの本格導入
コードはちょこちょこ書き始めている。以下はコンテンツ.htmlをd3.jsのtreeレイアウトで表示してみたところ。
東京メトロオープンデータで多少d3.jsに詳しくなってきたのでsvgを中心に使ってサイトを構築しようかなと考えている。でもそうすると検索エンジンにうまく解析してもらえないのではないかと思う。だから別途メタデータを埋め込むことにする。メタデータは<meta>タグのみではなくせっかくなので、JSON-LDを使って記述しようと思っている。
しかしこのJSON-LDとやらの記述方法が今ひとつわからなくて昨日から関連ドキュメントを読み漁っているところ。ティム・バーナーズ＝リーが提唱したリンクド・データからさかのぼって勉強しているところだ。