ドーモ、デザイナーのigguです。 ドワンゴでもっぱらエンジニアと連携しながらWebサービスやツールのUIをデザイン/実装したりしています。 今日のお話 僕は2012年8月ごろから3年間ほどSublimeTextを使っていました。その前はDreamweaverです。DreamweaverにおけるGUI中心の環境はマウスとキーボードを行き来する場面が多く、ストレスになっていました。加えてSASSやLESSのメタ言語を使い始めていたのでそれが扱えるキーボード主体で高速なエディタが無いかなーと探していた所でSublimeTextに乗り換えたわけです。 からの・・・約2ヶ月前でした。 そろそろSublimeText飽きたなーと思っていた所に、以前Betaを試したっきり放置していたAtomがにわかに盛り上がっている模様をキャッチ、物は試しとメインエディタをSublimeText (以下Sublime
こんにちは、さいそん(@tak723sio)です。 普段僕は開発時にはGitHub製のエディタ、「ATOM」を使っています。 クローズドβ(?)の時からなので、かれこれ１年以上使っているのですが、 使ってて「こいつ便利！」と思ったパッケージをまとめてみました。 ATOMって？ 公式サイト https://atom.io/ 上にも書いてある通りのGitHub製のエディタになります。 Windows、Mac、Linuxと、多くのOSに対応しています。 ATOMパッケージ (MacOS)ならATOMを立ち上げてCmd + ,で設定が開けます。 そこから「Install」のタブをクリックして検索バーで検索するとパッケージが探せます。 というわけで、便利だと思ったパッケージを紹介していきましょう！ Color Picker https://atom.io/packages/color-picker
こんにちは、okutani(@okutani_t)です。最近は、WindowsでプログラミングするときAtomを使っています(MacはEmacsですが)。 Atomでは使えるパッケージがたくさんあり、検索するとオススメのパッケージはいろんなところで紹介されていますね。 本記事では、はじめにパッケージの導入方法について、次に実際に自分で使ってみて良さ気だなと思ったパッケージを紹介しています。 スポンサーリンク パッケージの導入方法 パッケージ導入画面の開き方はWindows・Macで異なります。 Windowsの場合は「File」→「Settings」を選択。ctrl + ,でも開くことができます。 Macの場合は「Atom」→「Preferences」もしくはcommand + ,で開くことができます。 左メニューの「Install」を選択、Install Packagesの検索欄にインス
Sublime 一筋でしたが最近は Atom ばかり使っています。Atom でないとできないことはそれほどないし、Chromium ベースなので動きはもっさり、特に起動とファイル開いた時の Syntax 当たるまでが遅いですが Chromium ベースなのでカスタマイズしやすくて、結果 まあいいか と。Brackets は多機能すぎるのと Adobe なので警戒しております。 そんなわけで、エディタ導入したら必要になるであろう Git を使った 設定のバックアップと複数マシン間での同期方法をさくっと紹介します。 インストール Homebrew Cask にありますので $ brew cask install atom でいけます。特に何もしなくても $ atom -v $ apm -v でバージョン情報出ると思います。出なければ Atom 起動してメニューバーの Atom->Install
更新日: 2022年08月09日公開日: 2015年07月21日今注目のテキストエディタ「Atom」の使い方と便利機能まとめ 『Atom』というエディタの名前を聞いたことはありますか？ 登場したのは2015年と比較的新しいエディタながら、Web開発者が作業を効率化するための様々な機能を網羅している優れものです。拡張機能が数多く公開されたり、人気の拡張機能が標準機能として加わったりと、今も進化しています。 使い始めると奥が深い、Atomの基本を簡単にご紹介します。 ※記事執筆2017年7月18日時点の最新バージョン1.19.0 Beta4の画像を使用しています。 Atomとは まずはAtomの基本情報や特徴などを紹介していきます。 Atomの基本情報 公式サイトはこちら AtomはGitHub（※1）の創業者Chris Wanstrath氏が「Web技術を用いて、Emacsのように自由にカス
Sublime Textのさまざまなパッケージの中から、利用シーン別におすすめのものを紹介。また、Sublime Textのパッケージの基本的な使い方として導入方法や有効化／無効化、削除の方法も説明する。 ← 前回 連載 INDEX 今回はSublime Textのさまざまなパッケージの中から、特におすすめのものを紹介する。 Sublime Textのパッケージ Sublime Text自体はオープンソース・ソフトウェアではないが、内部機能を操作するためのAPI（API Reference - Sublime Text 3 Documentation）が公開されている。また、メジャーなスクリプト言語であるPythonのランタイムが搭載されているので、誰でもパッケージを作成できる。 そのため、パッケージの作成は盛んで、2014年12月時点登録されている公式パッケージは2600以上となっている
※すいません、Package Controlを開くショートカットキーがCtrl+Alt+Pって書いてありましたが、 正しくはCtrl+Shift+Pです！（5/3訂正） 2014/9/3 プレビュー児時のSublimetextフリーズについて追記 恋に落ちるエディタとして名を馳せるSublimetext 3もベータ版ながらに問題なく機能しており人気沸騰中のエディタです！ 最近、やっと僕も手を出し始めたのでメモ代わりに記事にしていきます。 インストール手順も日本語化もスキップして、今日は「Sublimetextでのブラウザプレビュー」について書こうと思います。 これが色々検索したものの、”これだ！”というものにあまりヒットせず… Browser Refreshなんかも有名ですが、何故か僕はショートカットキーが効かず。 純正テキストエディタとまで書かれているSublimetextにとってブラウ
今年SublimeText3に乗り換えてからメニューまわりがうまく表示できなかったので再インストールしました。windowsの場合です。 SublimeTextのアンインストール SublimeText 本体をインストール Package Controlをインストール 日本語化 追加した設定・パッケージ 半角スペースやタブを可視化 全角スペースを可視化 折り返しを解除 shift-jisのファイルを文字化けせずに開きたい。文字コードを表示したい 文字変換の候補が変な位置にでてしまう コーディングの入力補助 タブ移動を順序どおりにする タブが多数開いても重ならないようにする 全てのタブを一気に閉じる テーマ まとめ SublimeTextに追加した設定 基本ユーザー設定 キーバインドユーザー設定 パッケージユーザー設定（trailing_spaces） SublimeTextのアンインストー
設定画面を開く メニューから Preferences... を選択します。ショートカット command + , でも行けます。 パッケージを検索する 左のメニューから ＋ Install を選んで検索画面に行きます。 お探しのパッケージを見つけてインストールボタンを押して完了です。 変更が反映されない場合があるので Atomを再起動 しておきましょう。 パッケージのインストール方法は以上ですが、実際の流れがわかるよう、例としてメニューの日本語化をやってみます。 日本語化パッケージをインストールする 「 japanese-menu 」というパッケージを検索してインストールします。 はい、おわり。簡単ですね！ 右クリックで表示される、コンテキストメニューも日本語化されていますよ。 Windows や Ubuntu にも対応しています。 日本語化の設定は以上です。 それでは、よい Atom ラ
sublime text3 emmet というキーワードで検索されている事が多いようなので、じっくり解説です。 画面はmacのものですが、windowsでも同じような操作でインストールできます。 SublimeTextは、パッケージで機能追加 SublimeTextは、2も３も、パッケージと呼ばれるプラグインで必要な機能を追加していくことができます。 Emmetもパッケージとして配布されています。 パッケージは、パッケージコントロールで。 パッケージコントロールを導入すると、パッケージのインストールが簡単です。 パッケージコントロールの導入方法は、 Sublime Text 3 に Package Control をInstallするのが簡単になったよ - フロントエンドとかPCとかスマホとか を参照してください。 Emmetのインストール Mac：[Sublime Text] - [Pr
1. コードフォーマット パッケージとして提供されている HTML-CSS-JS Prettify を導入する。使い方はソースコードで右クリックして、Prettify Codeを選択。ショートカットは Shift + Command + H。しかるべきところでの改行と、インデントをまとめてしてくれるのでたすかります。 コードフォーマットの設定 Prettify Code コードフォーマットにおけるデフォルトでのインデントの設定はスペースです。設定変更や拡張子の追加などを行う場合は、Performance→Package Setting → HTML/CSS/JS/Prettify → Set Prettify Setting と進むと、設定ファイルが表示されます。(コマンドパレットからも呼び出し可。) インデントの設定を変更する場合は インデントの文字をスペースからタブに dent_cha
CPI x CSS Nite x 優クリエイト 「After Dark」（9） 『「今すぐSublime Textを使いこなす！」90分ライブセットアップ』 フォローアップを公開します 記事公開日：2014年4月21日（月） 2014年4月17日(木) 、KDDIウェブコミュニケーションズセミナールーム（麹町）で開催したCPI x CSS Nite x 優クリエイト 「After Dark」（9） 『「今すぐSublime Textを使いこなす！」90分ライブセットアップ』 のフォローアップを公開します。 CPI x CSS Nite x 優クリエイト「After Dark」（9） from CSS Nite on Vimeo. こちらもご覧ください。 CPI x CSS Nite x 優クリエイト 「After Dark」（9）Sublime Textが終了しました | CSS Nite
最近コーディングをする時はすっかりSublimetextを使用するようになりました。 軽さ、機能、プラグインが良くて多用している日々でございます。 Sublimetextの魅力は、いろいろあるのですが、ここでは割愛させていただきます。 代わりに記事を紹介しますので、そちらをご覧下さい。 新しい年に、テキストエディタをsublimeに変えた | スターフィールド株式会社 ”恋に落ちるエディタ”「Sublime Text」 完全入門ガイド！ | 株式会社LIG Sublime Text 2入門 (全14回) – プログラミングならドットインストール オススメのプラグイン 僕が今回オススメしたいのが「Hayaku」というプラグインです！ こちらはその名の通り、cssを早く書けちゃうという代物でございます！ hayaku/hayaku · GitHub sublimetextを使っている人であれば
今日は久しぶりに書籍の感想を書きます。 今回感想を書く書籍は「Web制作者のためのSublime Textの教科書」です。 知らない人のために説明すると、「Sublime Text」というのは、シェアウェアのテキストエディタです。 主にWeb制作をしている人や、プログラミングをしている人がよく使っている、シンプルかつ拡張性の高さが人気だったりするそんなエディタです。（かなりざっくりすぎる説明です） 僕も愛用しているエディタで、仕事でメインで使っている訳ですが、勉強し直すつもりで買って読んでみました。 知ったつもりになってるとよくない メインで使っているんだから、かなり詳しいんじゃないか、であればわざわざ買う必要もないんじゃないかと考える方もいるかもしれませんが、僕はいつもこう思っているんです。 「慢心するな。知った気になるな」と。 これは常々思っている事で、以前記事でも書いたかと思うんです
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? via Impress Japan: Web制作者のためのSublime Textの教科書 今すぐ最高のエディタを使いこなすプロのノウハウ サンプルPDF4章の目次より ※説明は私の調べたものなのでかなり適当です。 SideBarEnhancements サイドバー右クリックのメニューを拡張 titoBouzout/SideBarEnhancements LineEndings 改行コードの変更。 SublimeText/LineEndings ※現状、SublimeText3で動かないです。143Pのコラムで動かし方について言及がある
Sublime Text 2 に入れたパッケージ一覧
Sublime Text 2 のパッケージについて幾つか纏めておこうと思う。何かしら有名な奴ばっかりなので、有名所の説明文は簡易的な物で済ませておきます。しかしながら「Sublime Text 2 パッケージ」とかプラグインで検索する同じパッケージばっかり出てくるのはどういっ…。逆に有名所でも使う事はないだろうと言うパッケージとその理由についても記載してみる。 基本 お馴染みのアレからソレまで。 Package Controlパッケージのインストールや管理 ：https://sublime.wbond.net/installation JapanizeUIの日本語化 IMESupport全角日本語入力に対応させる InputSequence連番の入力：https://github.com/kope88/InputSequence SideBarEnhancementsサイドバーコンテキスト
どうもですはやちです(ノ)◜ω◝(ヾ) 最近『龍が如く維新』にどっぷりはまっております。畑仕事と釣りと別宅のローン返済が楽しくて本編のストーリーが進みません。 龍が如くシリーズは毎回寄り道してしまいます( ˘ω˘) どうでもいいですねc⌒っ´ʘ‿ʘ｀)っ 今回はLIGのデザイナーチームで半数以上のメンバーが使用している『sublime text』がより見やすく、使いやすくなるデザインテーマをご紹介いたします。 テーマを変えてみよう まずテーマの変更方法をご紹介します。 テーマをインストールする Control + Shift + pで呼び出して Package Control: Install Packageを選びます( ˘ω˘)☝ そのあとにパッケージ一覧が表示されますのでthemeで絞り込み、お好みのものを選びましょう( ˘ω˘)☝ これでインストールは完了です。 テーマを反映させる。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
