タグ

zen-codingに関するweb_designerのブックマーク (8)

  • Emmet CSSショートコード

    Emmetは、Zen-Codingの次期バージョンの名前です。 Zen-CodingはHTMLの記述方法が取り上げられることが多いですが、個人的には、CSSの入力補助こそ真価が発揮されると思っています。 私は、EmmetまたはZen-Codingがなければ、CSSのプロパティを打つのが苦痛なほどです。 Emmetから、さらに多くのプロパティに対応し、数値も含めて展開できるようになりました。CSSの記述がより使いやすくなったので、紹介します。 Zen-Codingから使える CSSの展開は、ほとんどのZen-Codingから使えます。 Emmetではさらに使いやすくなりましたが、Emmetは現在開発中のため、不安定な部分があります。不安な方は、Zen-Codingをおすすめします。 プロパティに、ショートコードが用意されており、+でつないで展開(Expand Abbreviation)する形

    Emmet CSSショートコード
  • Zen-Codingの次期バージョン、Emmet について - kojika17

    Sergey Chikuyonok氏のGithubを見に行ったら、"Emmet (ex-Zen Coding)" という気になる記述があり、気になったので調べてみました。 Zen-Codingについて Zen-Codingは、IDEやエディタで使えるHTML/CSSのコーディングをパワフルにサポートするプラグインです。多くのアプリケーションで提供されており、3年前ほどから日でも多くのサイトがZen-Codingを紹介しています。 そのZen-Codingが、「Emmet」と、リネームされてプロジェクトが進められているようです。 Emmet(beta) Emmetは、開発中です。 正式リリースはまだですが、機能は試すことができます。 Emmetは、2013年2月24日に正式リリースされました。 基的には、今までのZen-Codingと変わりません。 Zen-Codingを使っていた人は、

    Zen-Codingの次期バージョン、Emmet について - kojika17
  • Coda 2を買ったのでZen-CodingとWordPress Syntax modeを入れてみた

    Coda 2、日(2012/5/24)限りで半額4,300円だったので、おおおおうどうしようどうしようと迷いつつ、買ってみました。 ほんでとりあえずZen-CodingとWordPress Syntax modeを入れてみたのでその覚書です。 Zen-Codingを入れる まずはこちらから「Zen Coding for Coda」をダウンロード。⇒ zen-coding ダウンロードしたファイルを解凍すると「TEA for Coda.codaplugin」というファイルが出てくるのでそれをダブルクリック。 インストールできるとCodaのメニューバーに「Plug-ins > Tea for Coda」が表示されるようになります。 これでインストール完了。 展開はControl+Eでできます。 Control+Eだと行末へ移動するショートカットとかぶって不便なので、ショートカットを変更しまし

    Coda 2を買ったのでZen-CodingとWordPress Syntax modeを入れてみた
  • Codaを入れたらまず行っている設定|1bit::memo

    いろいろなエディタ環境を触ってみて、結果的にcoda(時々dreamweaver)に行き着いたわけですが、今回は自分好みのカスタマイズにするためのメモをしておこうと思います。 1.Codaのダウンロード パニック・ジャパン – Coda – Mac OS X 用 シングルウインドウ Web 構築環境 2.CodaにWordpressのシンタックスモードを入れる プラグインはこちらからダウンロードする。「WordPress Mode » Pradador.com」 ダウンロードし、回答して出来た「WordPress.mode」のフォルダ丸ごとを 「/Users/ユーザー名/Library/Application Support/Coda/Modes」にコピーする。 3.Zencodingを入れる プラグインはこちらからダウンロードする。「TEA for Coda | One Crayon」

  • どうせCodaにZencodingを入れるなら最新版を入れよう|1bit::memo

    CodaにZencodingを入れる方は非常に多いと思いますが、どうせなら最新版を入れると機能も増えて作業が捗ります。 Coda用のZenCodingを入れるならGoogleCodeの方から Coda用のZenCodingを探すと以下の2つのリンク先を探し当てることができると思います。 TEA for Coda | One Crayon zen-coding – Set of plugins for HTML and CSS hi-speed coding – Google Project Hosting 個人的には、GoogleCodeの方をダウンロードする方がいいと思います。なぜなら、ZenCodingの機能が追加されているからです。 個人的によく使っているZenCodingの機能 ( )カッコ グルーピングしたい時に使えます。下のhtml階層から上へ戻って続きを書く時に必須です。 [

  • CodaにZen-Codingを入れてみると… | gaspanik weblog

    前回、前々回とTextMateをベースにZen-Codingの話をしたわけですが、一番最初にも書いたようにTextMateは日語の処理がうまくないので、導入したくても導入できない方も多いかもしれません。 でも、Zen-CodingをTextMate以外で使おうとするとグッと選択肢が減ります。Mac使いの皆さんがお使いのエディタといえば、CodaやskEdit、miあたりが有名どころです。良かった!Codaならコマンドの違いはありますが、その恩恵にあずかれますよ(笑)。 (追記)Zen-CodingのDreamweaver用のMXP(ダウンロードはこの辺で)でも、以下の操作と同じショートカットで略語や構造の展開はできるみたいです。 Codaでやるなら「TEA for Coda」をインストール 前々回のエントリーにも書いておきましたが、現在Coda用のプラグインは「TEA for Coda」

    CodaにZen-Codingを入れてみると… | gaspanik weblog
  • コーディングの効率化に効くと評判のツールを手軽に試せるサイト(+アドオン)4つ | バシャログ。

    桜はまだか。hakoishiです。 さて、web制作界隈は次々に便利なツールが登場してきます。 「便利と評判のあのツール、使ってみたいけど導入が手間で…」 そんな時、web上で手軽に試せるツールがあったりすると嬉しいですね。 ってことで、今回はそういったツール達のご紹介です。 zen-codingを試す JavaScriptフレームワーク各種を試す LESSを試す vimを試す zen-codingを試す マークアップ効率化 - zen-codingでコーディングを倍速に (Yahoo! JAPAN Tech Blog) 「基的な記法」まで移動して、各デモ欄の文末でtabを押してみてください。結構感動しますよね。 編集するとそれも反映されますので、いろいろ試してみてください! 【参考】 物足りなくなったら、こちらも。 kzms2 zen-coding editor JavaScript

    コーディングの効率化に効くと評判のツールを手軽に試せるサイト(+アドオン)4つ | バシャログ。
  • 連載インデックス「Zen-Codingで高速HTML&CSSコーディング」 - @IT

    連載インデックス 「Zen-Codingで高速HTMLCSSコーディング」 Zen-Codingのテキストプラグイン使うと、効率的にHTMLCSSが書けます。特定の省略された記法や展開を試そう Zen-Codingを使いこなして、らくらくマークアップ Zen-Codingで高速HTMLコーディング(2) Zen-Codingにはさまざまなコマンドや省略形があります。よく使いそうなものから覚えて、マークアップをさらに効率化しましょう

  • 1