制作環境メモ(主にgitのこと)
定期的に書いてる気がするけど、実際に定期的に見直しているので、最近の制作環境のメモを書きます。
制作環境で言う制作とは、割と一般的なサイト制作のことです。
制作ツール
- vim
- git
- sass(最近はcompassも使ってみたり)
- yuicompressor
- firebug
- Wordpress or Movabletype
- Dropbox
- 社内サーバー
ほとんどの案件で使う制作ツールはこんな感じ。MTを使うことが増えてきてます。
MTはCMSとして使うほか、CMSが不要なお客様の案件でも、案件ごとに社内サーバーにMTOSを入れて、HTMLジェネレータツールとして利用しています。
Dropboxは社内で共有しています。個人的には、全員がgitを使えるようになれば、共有する必要はないと思っていますが、まだその段階は先の話です。
gitの使い方
個人的にgitがようやく「使うことで効率が落ちる」というフェーズから、「使わないことで効率が落ちる」というフェーズに入って来ました。
「使うことで効率が落ちる」というのは、単に学習コストを払えていないため、ツールの使い方を調べたりするのに無駄に時間がかかるということです。
- 社内サーバーに共有リポジトリを作る
- Dropboxに置いた制作環境をgitで管理し、remoteに社内サーバーの共有リポジトリを設定する
- 社内サーバーのドキュメントルートをgitで管理し、remoteに社内サーバーの共有リポジトリを設定する
- 社内サーバーの共有リポジトリのhookに、Dropbox内の環境でpushした時には、社内サーバーのドキュメントルートでpullを走らせる設定を書く
- WordpressとMovableTypeのテンプレートファイル以外のすべて、コンパイル後のCSSとJavaScriptは.gitignoreで除外。
利用する本番サーバーでgitが使える場合は、remoteをもうひとつ追加して、ローカルの編集内容が本番サーバーにも同期されるように設定する場合もあります。
静的ファイルとテンプレートの管理
静的ファイルを先に作って、WordpressやMovableTypeなどのテンプレートに切り出していきますが、割と大きめな修正がある時は、テンプレートを書き換えるより、静的ファイルを書き換えた方が手っ取り早いことが多く、静的ファイルも同じディレクトリ構成で管理しています。
- HTML
- DevServer
のようなふたつのディレクトリを用意し、基本的には同じディレクトリ構造にします。同じディレクトリ構造というのは、ディレクトリ的に同じというよりは、最終的なURLのパスが同じ構造になるようにということです。HTMLディレクトリとDevServerディレクトリに違いがあるとすれば、DevServerの方には、WordpressやMovableType固有のファイルや、scssファイル、圧縮前のjsファイルなどが入っている点が違います。
また、HTMLディレクトリの中身は、社内サーバーには要らないので、remoteを追加せず、別のgitの環境として管理しています。
そして、HTMLディレクトリの画像、CSS、JavaScriptのディレクトリは、DevServerディレクトリのものと同じファイルを使うことになるので、DevServer側のディレクトリからシンボリックリンクを貼ります。
DevServerのファイルも、HTMLのファイルも、環境依存がないようにパスの記述が必要な箇所は、「/(スラッシュ)」から始まる絶対パスで書くように統一しています。
現時点の問題点及び改善点
- 社内サーバーのドキュメントルートで更新した内容をcommitしたり、それをDropboxの環境に反映するのは、手動でしていますが、これも自動化した方がいいのかもしれない。
- sassとyuicompressorを走らせる設定もhookに書いておいた方がいいかも。
- 他の人が行った更新のコミットログは、自分が書かないといけない感じになっているので、なんとかしたい。
- 他社の方のやり方を聞いたり、ディスカッションする場があまり持てていない。
- まだgitの表面的な使い方しかできていない。
まとめ
文字ばかりでごめんなさい。まだまだ試行錯誤してます。もっと良い方法が多分ありますが、やりながら見つけていくしたないですね。
とりあえず、現段階ではgitをベースにしたサイト制作のフローが、それなりに機能してきたので嬉しいです。