タグ

ブックマーク / webdrawer.net (5)

  • タスクランナー「gulp」の導入手順(Windows)

    前に同じタスクランナーのGruntを導入してみましたが、gulpというのも結構話題に見るのでこちらも導入し試してみました。 エラーがでてインストールできない人は、ページの下の方に自分がとった解決策が書いてあります。 gulpとは gulpとはnode.jsを使ったタスクランナーです。機能的にはGruntと一緒です。設定を記すgulpfile.jsの書き方が少し違うのと、処理スピードがGruntより速いようです。 公式サイトはこちらから gulp.js – the streaming build system インストール 基的なインストール方法はGruntと一緒です。 こちらのコマンドをコマンドプロンプトに入力します。 npm install -g gulp 次にそのプロジェクトフォルダの階層まで移動します。 cd 階層へのパス ここで試しにgulpのバージョンを確認してみます。 gul

    タスクランナー「gulp」の導入手順(Windows)
  • コーディングが早くなる!?噂のSublime Text 2を入れて初期設定をしてみた。

    最近私の周りでよく話題になっているエディタ「Sublime Text 2」。 使い慣れているからという理由でずっとDreamweaverを使っているのですが、紹介記事をいろいろ見ていたら良さそうだったので使ってみようと思い入れてみました。今回は その「Sublime Text 2」をインストールして初期設定、そしてプラグインを入れる方法までをご紹介したいと思います。 Sublime Text 2とは WindowsLinuxMacで動作し、特にWeb開発に適したテキストエディタです。 有償製品ですが、ダウンロードは無料。継続して利用するにはライセンスの購入が必要です。 便利なショートカットと拡張機能 Sublime Text 2を使おうと思ったきっかけが、便利なショートカットと豊富なプラグインです。探せばいろいろ出てくるので検索して調べてみると、こんなものもあったのかというようなプラグ

    コーディングが早くなる!?噂のSublime Text 2を入れて初期設定をしてみた。
  • 初めてSassとCompassを使った際に参考にした記事まとめ

    しばらく前から気になっていたCSSを書く時に便利だという「Sass」と「Compass」を自分のサイトを作る時に使ってみました。 順番に導入の手順を追ってもいいのですが、検索すると多くのサイトが紹介していますので、私が見て参考にしたページをまとめておきたいと思います。 Sassとは まずSassとは何かと言うと、CSSを生成するためのメタ言語で、これを利用することでCSSを早く書けたり、記述が楽になったりします。 Sassの公式サイトは以下から。 Sass – Syntactically Awesome Stylesheets Compassとは Sassを拡張して、便利な機能を追加してくれるものです。ベンダープレフィックスを自動でつけてくれたり、リセットCSSを呼び出してくれたり、CSSスプライトを使えたりします。 Compassのドキュメントは以下から確認できます。 Compass H

    初めてSassとCompassを使った際に参考にした記事まとめ
  • Sublime Text 2の設定をDropboxで共有して便利にする

    前回は初期の設定とプラグインのインストールと削除をやりました。 今回は、Dropboxを使って家のマシンでも会社のマシンでも設定を共有出来るようにしたいと思います。 設定の共有 別のマシンでも製作する人は設定が同じ方が便利ですよね。でもわざわざ設定をまるまる移すのは大変だったりします。移し忘れることもありますし。 というわけで、このSublime Text 2を使うときに設定が簡単に共有できないか調べたのですが、 Dropboxで設定ファイルを共有し、別のマシンでも同じ設定を共有できる方法を見つけました。 共有するフォルダ 共有するフォルダは以下の3つ。 Installed Packages Packages Pristine Packages フォルダの場所は「C:\Users\hogehoge\AppData\Roaming\Sublime Text 2」 MacWindowsか。ま

    Sublime Text 2の設定をDropboxで共有して便利にする
  • 初心者のためのスマートフォンサイトを作るときに見ておきたいサイト|WEB Drawer -WEB制作に関するメモサイト-

    スマートフォンサイトを格的に作るようになってきたので、いろいろ基的なことから調べてみました。 自分はコーディングがメインなので、HTML/CSS/JSが主になっています。 制作する前に仕様の確認 スマートフォンの仕様が載っています。一通り目を通すと、製作してる時に「これができない!」などの問題が回避できるかもしれません。 ASCII.jp:サイト制作の前に知りたいiPhone/Androidの仕様|実践!iPhoneAndroidサイト制作ガイド ASCII.jp:サイト制作の前に知りたいiPhone/Androidの仕様|実践!iPhoneAndroidサイト制作ガイド スマートフォンサイトの制作 – 基礎編 – – ぺーぺーエンジニアのおぼえがき スマートフォンサイトの制作 – 基礎編 – – ぺーぺーエンジニアのおぼえがき iPhone iPad向けサイトを制作するためのいろ

    初心者のためのスマートフォンサイトを作るときに見ておきたいサイト|WEB Drawer -WEB制作に関するメモサイト-
  • 1