使い勝手がよく、高速動作のオープンソースのコードスニペットマネージャーを紹介します。VS Codeと同じMonacoがエディタに使用されており、非常に快適です。 macOS, Windwos, Linux対応のアプリで、Web制作のさまざまな言語をサポートしています。日本語の入力など、日本語環境でも問題なく利用できます。 massCode massCode -GitHub massCodeの特徴 massCodeのダウンロードとインストール massCodeの使い方 massCodeの特徴 massCodeは、デベロッパー向けのコードスニペットマネージャーです。ライセンスはGNUで、オープンソースなので商用でも無料で利用できます。 macOS 10.13+, Windows 7, 8, 10, Ubuntuをサポートしています。 コード管理 massCodeは、マルチレベルのフォルダとタグ
massCodeはElectron製のOSSな開発者向けコードスニペット管理ツールです。Monaco Editorが採用されており、スニペット管理ツールとコードエディタを兼用する事ができます スニペットは様々なプログラミング言語に対応しておりタグやフォルダでカテゴライズできる他、1つのタイトルで複数スニペットを登録出来たり全文検索出来たりと、最低限の機能を備えつつ痒いところにも手が届く、といった印象でした スニペットはショートカットでコピーできたり保存も自動保存だったりと非常に使いやすい仕様となっています。これでオープンソース、クロスプラットフォーム対応とは恐れ入ります。有難く使わせてもらいます。ライセンスはAGPLとのこと。 massCode
Install and Configure a CSS Preprocessor CSS preprocessors like Sass and Less are tools that greatly enhance CSS development. Sass and Less have been around for a while now and are widely adopted by the web development community. CSS preprocessors bring real language features to CSS such as variables and mixins (functions) which result in clean, extensible and reusable CSS code. For this example,
前回はなぜTypeScriptか？という話を書きました。今回はTypeScriptを使うとして、どういう環境を作れば気持ちよく開発できるかについて解説します。 本稿に出てくるサンプルをまとめたリポジトリを随時メンテしております。時期によっては、本記事の内容に沿わない（より磨かれた）状態になっているかもしれません。 TypeScriptの開発環境が指すものは2つあります。IDEやエディタといった、本当に開発を行うための環境と、初期設定を行ったりリリースビルドを作ったりするためのタスクランナーの二種類です。 本記事ではお勧めの構成として、Visual Studio Code+grunt+dtsmを用いていきます。別構成として、Atomとgulp、tsdについても言及します。いずれの構成でも、Mac OS X、Windows、Linuxといった主要なプラットフォームで同じように動かすことができま
こんにちは増田です。今回はPHPStormの便利な機能を紹介します。 0. キーボードショートカットを設定する。 PHPStormにおけるキーボードショートカットの設定はKeymapで行うことが出来ます。 設定する際は一覧から目的のアクションを探して、キーボードショートカットを設定します。アクション名は画面上部の検索ボックスから検索することもできます。 Keymap設定画面 1. Structure クラスで定義されている関数一覧を見ることができます。EclipseにはあったのにPHPStormではどこにあるんだろう、と結構長い間探していましたがこんなところにありました。 Structureで関数の一覧を表示 2. 矩形選択 Editor Actions > Column Selection Mode Altを押しながらマウスで範囲選択をすることでもできますが、キーボードから離れたくないこ
今日はEmEditorでSassファイルの対応をしていく設定例を紹介していきます。デフォルトはどうだったっけ？ってという部分もあって、すでに設定している場合もありますが、そこはスルーしてもらえばと思います。 Sass用EmEditor設定ファイルのダウンロード 今日紹介する設定では、コードカラーリングとSass・CSS3用のキーワードファイルを配布しています。先にこちらをダウンロードしておくとスムーズに進められます。 Sass用EmEditoro設定ファイルのダウンロード 基本的な設定 ［ツール］→［設定の選択］→［設定の定義］→［CSS］→［プロパティ］から設定を開きます。以降は設定するタブの表示順に設定例を書いていきます。 設定はこの画面からスタートします。 自動インデント 僕はCSSのセレクタを入力し、「{」の後にEnterキーを押して改行します。すると、デフォルトだと、カーソルがセ
Adobeが開発するオープンソースのコードエディター「Brackets」アドベントカレンダーです。Bracketsをちゃんと仕事でバリバリ使っている人がどれくらいいるのか気になってます。参加者がいなかったら僕一人でやるかも。エクステンションの話しとかテクニックの話しとか聞きたいです。
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
Sublime Text offers thousands of extensions and settings to make a personalized code editor available for everyone. Right now, I’m going to show you some settings, plugins, themes, and color schemes to help make the coding experience more visually appealing. This won't just make your screen prettier, it'll make you a better coder! Settings Sublime Text comes pre-built with some great features to v
エムソフト、「EmEditor」v13を正式公開。「Professional」「Free」が同一バイナリに - 窓の杜 前のフリー版からのめぼしい変更点としては、HTML5のcharset属性値に対応したのと、フリー版でもesy形式の構文ファイルを食わせることができるようになった、というところでしょうか。 で、既存のHTML5構文ファイルがEmEditor (テキストエディタ) - HTML 5 構文ファイルとしてあるにはあるのですが、どうにも要素および属性名の記述が怪しい感じがしたので、書き直してみました。 生成物：html5.esy（Google Drive） 要素および属性のファイルへの打ち込みに際しては、2013-05-28 HTML5.1草案のIndex（やりかけの和訳）に基づいています。 MathMLとSVGの子要素については記述していませんが、カスタムデータ属性data-*に
Chrome CanaryDevToolsも進化してるのでStableではなくCanaryを Local ProxyPCのみならDevToolsだけでもいいけど、スマホのWebView内解析とか考えるとLocal Proxyは必須 Windowsなら Fiddler （無料） Macなら Charles （有料） Macでお金払うのが嫌な場合 CocProxy for nginx （無料。CUI。Ruby版使うくらいならこちらを） JS製が良くてソース読みたいなら Klepto （無料。GUI。不安定） ソースの文字コード変更ChromeでJS、CSS開くと日本語が化けるので、初期文字コードをUTF-8に変更 （フォント設定（ chrome://settings/fonts ）の一番下を「Unicode (UTF-8)」に） “This Frame” Context Menuiframeの
No longer works as of Firefox 57 IAT will no longer be supported because a rewrite is required for Firefox 57+. Ever started type into an edit box on some web page (such as to post a comment or describe why your scooter was defective and they should send you new one)? If so, then you need "It's All Text!" This miracle extension provides an edit button for any edit box[1] on any page or your money
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 2019/06/11追記: これは2012年の投稿です。なぜかはてなブックマークで拡散されていますが、内容は時代にそぐわなくなったものもあるのでご注意ください。 これ知らないプログラマって損してんなって思う汎用的なツールのコメントに寄せられたツールを分類分けしてみました。 解説は、ほぼコメントに寄せられた内容のコピペです。 URLのみの記述は公式サイト(か、ほぼ公式サイトと化しているサイト) 公式サイトとは別に、ページタイトルだけでツールを説明しきっているページへのリンクも付けておきました。類似ページが複数ある場合は、はてブのブックマー
こんにちは、ちょっと年末前くらいから、「Emmet」というキーワードを聞くようになり、 日頃お世話になっている、sublme text 2でも使えるということで今回、上下巻に分けてご紹介したいと思います。 アジェンダ Emmetとは？ 誰が開発してるの？ Emmetプラグインのインストール！ インストール後の設定 どんな感じがさわってみる。 おまけ Emmetとは？ はじめて「Emmet」を聞いた方は「Emmetってなに？」となるかと思いますので、簡単にご説明をできればと思います。 それでは、「Zen Coding」はどこかでお聞きしたことがあるのではないでしょうか？ 「Zen Coding」は、コード(スニペット)とショートカットを組み合わせて、効率的にHTMLやCSSのマークアップ手助けしてくれる、すごいツールで認知度も高いと思います。 その「Zen Coding」が名前を変えて＆進化
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く