はてなブックマーク

この記事は 俺のメニューバー Advent Calendar 2015 25日目の記事です。 俺のメニューバーアドベントカレンダーも最終日になりました。メリークリスマス この24日間で紹介したアプリを振り返り ＋ 書くまでもなかった定番アプリ、紹介できなかったアプリやネタアプリなども含め、ジャンル別に俺のメニューバーをここに総決算しますメリークリスマス 追記：44選って中途半端なので50選に加筆しました。（2015.12.25 19時頃） 俺のメニューバーとは 常駐アプリ多すぎてみんなに笑われた くやしいからアドベントカレンダーはじめました Togetter そもそも「俺のメニューバー」とは、Stocker.jp のなつきさんと会話していて、メニューバーを晒したら、色んな人に笑われたんですが、どれも便利で消せるものがないので、じゃあそれでアドベントカレンダーで毎日アプリを紹介してみようとノ

この記事は 俺のメニューバー Advent Calendar 2015 24日目の記事です。 ExpanDriveがあると、様々なクラウドストレージやサーバーを外部ドライブとしてマウントすることができます。 AWS や SFTP をドライブしたり、同期させるほどでもないストレージサービスを、一時的に接続する場合にも使えます。俺は Google ドライブと Dropbox のサブアカウントで使っています。 対応サービス ExpanDrive creates a virtual USB drive that connects to all major cloud storage providers such as Dropbox, Google Drive, Amazon Cloud Drive, Box, OneDrive, Openstack Swift, Amazon S3 or you

この記事は 俺のメニューバー Advent Calendar 2015 10日目の記事です。 色々とコードスニペットツールを使ってきましたが、やっとしっくりくるコードスニペットツールに出会えました。俺、SnippetsLabでいくわ。 Stop reinventing the wheel – be more productive with SnippetsLab. インストール インストールはApp Storeから。 SnippetsLab カテゴリ: 開発ツール 現在の価格: ￥1,200 使用方法 俺は、メインウィンドウから登録し、メニューバーのアイコンより検索・コピーして使用。という感じで使っています。 ネットも必要なく、単体で動作し、つねにメニューバーからアクセスできるのが、結局一番使いやすいと思いました。 メニューバー メニューバーのアイコンよりいつでも検索・登録ができます。 公

デザリングなど使用量に制限があるネットワークを使う時、うっかりDropboxやGoogleドライブなどのオンラインストレージを起動していると、あっさり3日1Gに到達して激遅の通信規制が辛い時があります。 そんな時、Little Snitchというネットワーク監視アプリケーションを使うと簡単にテザリング時に特定アプリケーションの通信を遮断することができます。 Little Snitch 3 – Objective Development Little Snitchはネットワークを監視し、通信しようとするプロセスを表示し許可するかしないかを設定できるアプリケーションです。 それだけではセキュリティソフトとあまり変わりがなさそうですが、「Profile」を設定することでネットワークごとに通信させるアプリケーションを設定できます。 これを使いテザリング時にはオンラインストレージのプロセスを遮断させ

この記事は Sublime Text Advent Calendar 2014 1日目の記事です。 いまだDreamwaverから離れられないコーダーさんに伝えたい「それ、Sublime Textでもできるよ。」という機能を紹介します。 パッケージの機能追加については言わずもがなPackage Controlから拡張してください。 コードヒント Emmet (Package) Dreamwaverではプロパティ補完→値補完という流れになりますが、「Emmet」パッケージを入れることで［プロパティ:値］をワンセットで補完することができます。Fuzzy Searchという機能で、よしなに補完してくれます。 DreamwaverでもEmmetの拡張はありますがコード展開だけですね。 コードヒントも「sublime-snippet」ファイルというテンプレートファイルで簡単に追加・管理することができ

本日、2014年3月20日に「Web制作者のためのSublime Textの教科書」が発売になりました。 Web制作者のための教科書シリーズ第２弾です！ 前作のWeb制作者のためのSassの教科書からご縁があり、今回も執筆に参加させていただきました。 Kindle版も同時に発売になりました。ちょっと安いです。こちらも一緒にぜひ！ 本書は、上野正大さん、杉本 淳さん、前川昌幸さん、（五十音順）と私の４名で執筆しました。 そしてSublime Textのエバンジェリストと言っても過言ではない、こもりまさあきさんが監修しております。 私以外の執筆・監修の皆さまの守備範囲が異常に広いので、デザイナからフロントエンドエンジニア、プログラマまで読める内容となっていると思います。 もちろん全員がSublime Textを常日頃から愛用しており、現場で使える機能やパッケージ、小ネタなどを紹介おります。 本

Aiが落ちたー！Psが落ちたー！Fwが落ちたー！なんてタイムラインであるあるすぎて、もはや誰も反応してくれない風景ですが、ForeverSaveがあれば救われるかもしれません。 自分の周りは案外知らない人が多かったんで紹介します。 ForeverSave 2 ForeverSave 2 – Overview – Tool Force Software Tool Force Softwareのシェアウェアで現在の価格は$19.95 USD。ちょっとお高いと思うかもしれませんが、もしも数時間分の作業が吹っ飛んだら、$20払ってでも復元したいですよね？ MacUpdateであと２日くらいは半額セールで$9.95だそうです。  [終了しました。] ※Mac App Storeのリンクが本家サイトから無くなっているので、もしかしたらMac App Storeはもう更新しないのかもしれません。すでに2

マカーお馴染みの高機能GUIコンパイラー Codekit がバージョン2になり、色々刷新されました。 いきなり新バージョンがリリースされたんでびっくりです。とりあえず買ってみたんで全部機能試してはいないですが、ひと通り触ってみた感想をつらつらと。 Codekitとは CodeKit: THE Mac App For Web Developers CodekitとはMac専用のGUIコンパイラーのアプリのことで、SassやらLessやらCompassやらこーひーすくりぷとやらをコンパイルしてくれたり、ブラウザをオートリロードしてくれたり、画像最適化してくれたりと、黒い画面が苦手な方安心◎のコーディングお助けツールです。 2でさらにビルトインサーバーやアセットなど機能が追加してパワーアップ。 Codekitを知らない人は、このまぼろしの木村さん西畑さんのスライド見れば全てわかります。 CSS

みんな大好きMacのランチャーの定番Alfred。 WorkFlowを作ったけど、もっと便利なものが既にあったので紹介します。 Alfredとは Alfred App – Productivity App for Mac OS X もはや説明不要なMac用のランチャーです。 アプリの起動やファイルの検索など、Alt+Space押しとけば何とかしてくれるやつです。 ぼくたちは、Alfredひげメガネ芸人です！ — SOU (@sou_lab) 2014, 2月 19 Alfredひげメガネ芸人のみんなから熱いRT（少） Alfred Workflowが便利 無料版でもアプリの起動やファイルの検索など充分便利なのですが、お布施をすると更に便利な機能が開放され、iTunesやクリップボード履歴やターミナルの操作ができるようになります。 そして、Workflowという機能も開放されるんですが、これ

日付では本日発売となりました「Web制作者のためのSassの教科書」。 もう書店に並んだり、Amazonで届いたって声をちらほら聞いております。ありがとうございます。 なぜか自分で注文したAmazonは明日到着のメールが。。モンハンと一緒に発送されたのかも(´・ω・`) さて、共著させていただいた平澤さんが「Sassの教科書で一番読んで欲しいところ。」というエントリーを書かれて、この記事も是非読んでほしいのですが、その後の章も読んでほしいのところがあるので、再度宣伝エントリーです。すみません。 Amazon以外（楽天ブックスなど）のリンクは本書サポートサイトにのっております！ Compassの章 第6章 Sassをさらに便利にするCompass 6-1 Compassを利用する準備 Compass って何？ Compass のインストール プロジェクトを作成する config.rb の設定

週末にSublimeText2を起動したらパッケージからテーマからおかしなことになってました。 どうやらPackageControlが2.0にアップデートされたのでその影響だと思います。 Twitterを見ていたら、お友達のフォロワーさんもなっていたので、Twitter検索したら私だけではない症状だったので直し方を共有します。 再インストールやパッケージを入れ直したりしなくても直せますので焦らずにー。 エラー画面 ちなみに画面がこんな感じになった。 ブフォォｗｗｗ 終わったンゴｗｗｗｗｗｗｗ 見た目でおかしくなったのがすぐ分かりましたが、その他のパッケージも色々使えなくなってました。 テーマのパッケージがPackageControlのアップデートで更新されたみたいです。 Packageフォルダ見ると、アルファベット順にどんどん更新されている。 直し方 前置きはどうでもいいとして、直し方です

普段PHPのローカルサーバーはMAMP PROを使っているんですけど、そのphpMyadminがアップグレードしろとメッセージが出てるので、セキュリティてきにも更新しとこうってことで備忘録がてらメモ。 後半全くMAMP PRO関係ないですが、XAMPPやサーバーのphpmyadminとかでも使えると思います。 こんなメッセージでアップグレードを促されてました。 phpMyAdminをダウンロード phpMyAdmin公式サイトからの左のDownloadボタンで一式ダウンロードします。 今回のバージョンは「4.0.4.1」。DLしたZipを解凍します。 phpMyAdminフォルダを上書き MAMP PROのphpMyAdminはここにあります。 /Library/Application Support/appsolute/MAMP PRO/phpMyAdmin ユーザーのライブラリフォルダ

先日、Sass,Less,Coffee対応のアイコンが不気味カワイイGUツールKoalaがバージョン1.4になりました。わりとがっつりパワーアップしたので、また紹介します。Koalaで二回目の記事です。 インストールや基本的な使いかたは前回の記事を参考にしてください。 バージョン1.4の新機能 公式サイトのChangelogを見ると、 Fix bug: version 1.4.0 can’t run. New features: project settings, see the doc here. Compass full supports. Minimize on startup. Press “Esc” key to close the settings and log window. Update Less to version 1.4.0. Update CoffeeScript

タイトルとおりほんとに無料すか？っていうくらい高機能なGUIコンパイラーがPreprosがリリースされました。 CSS HappyLife大明神様よりとても詳しく丁寧に解説してくれるだろうとのフリをうけ筆を走らせている次第でございます。 追記:現在は無料版はなく有料版のみっぽいです (2015.04.05) Preprocessing just got easier with Prepros Prepros 現在バージョンは1.7。Windows版のみリリースされています。 追記:バージョン2.2でMac版も出ました (2013.07.11) Codekitのような高機能GUIコンパイラーがWindowsにもいよいよ登場ですね。 すでに海外の記事では「WindowsのCodekitだぜ！」みたいなことが言われてるとかいないとか。 Preprosの主な機能 Preprosの主な機能として ブ

どうも僕だよ。AdobeCCリリースされましたね。 僕もさっそくインストールしてみたよ。 PsCCのスマートシャープは結構いい感じだし、角丸編集はやっとできるようになったし、イラレCCはCSS書き出ししてくれるし。いいですね。DwCCはSassに正式対応のはずなのに、設定ファイルをいじる方法となにも変わってなくてびっくり。コードカラーリングが残念なことになってます。 そのへんはアップデートで対応してくれないかな〜と願いつつ、新機能はガチャをしながらチェケラするとして、いつも通りの馴染んだ環境にするために拡張機能とかをインストールしようとしてたら。。 MXPファイルがグレーアウトして選択できません。どうやらCCからMXPファイルは使えなくなったみたいです。 うーむ。Zenが使えないのは困りました。 ZXP形式にコンバート ということで、MXPをZXP形式に変換してみましょう。 Extensi

Macでスクリーンショットを撮るアプリは数多くありますが、 レイヤー構造（PSD形式）を持ってスクショできる機能はちょっと凄いと思いました。 それができるアプリがScreenLayersです。 Softmatic ScreenLayers カテゴリ: グラフィック&デザイン 価格: ￥850 今週まで無料？らしい。 終わりますた。(2013/05/04) 無料化された？っぽいです。(2013/05/06) ￥850になりましたガチしょんぼり沈殿丸。(2013/05/16) ざっくり使い方 使い方はいたってシンプル。 メニューバーから”Capture All”を選択、 もしくは⌘+shift+5で指定した場所にPSDが保存されます。 保存されたPSDファイルを開くとあら素敵。 各ウィンドウがレイヤー別になってます。 不要なウィンドウを消したり、背景を抜いたり、メニューバーを消したり色々できま

KoalaはWin,Mac,Linuxなどマルチプラットフォーム動くGUIのコンパイラです。 対応言語はSass(Compass),Less, CoffeeScriptです。 インストールはこちらからご使用のOSを。 現時点のバージョンはv1.0.0v1.3.0です。リリースしたてですね。 動作には予めRubyのインストールが必要です。 ※v1.3.0になったので少し修正しました（2013.6.2） koala使いかた ややフラットUIてきなインターフェイス。 プロジェクト登録 「＋」ボタンでフォルダを選択するか、 作業フォルダをドラッグすればプロジェクトが登録されます。 基本これだけでSass,Less,Coffeeのコンパイルをしてくれます。 書き出し設定 scssの緑のファイルアイコンをクリックすると画面右にオプションメニューが現れます。 「dynamic compilation」を

はーい、そうらぼです。 先日、マイメンぽよし氏が「MacBookを持ち運ぶためのかっこいいバッグパック」というマカー男子をくすぐる記事を書いたのですが、取り上げられているバッグは全てリュックだったのです。 トートバッグ派のわたしは憤怒しました。激昂です。なので怒りのトートバックまとめを書きました。 一応、まとめの条件として 肩にかけれる Macbookを裸で入れれるフカフカゾーンがある おれ欲しい この三点を条件にしました。 INCASE Macバッグの大定番INCASE。 わたしの使用しているモデルはTERRA COLLECTION。 ペンホルダーやにMagicMouseピッタリのポケットなどMac様に作られている機能性は実に優れています。 このデザインは非常に好きなんですが、裏地の赤色がゴムなどに色移りしまくりでMagSafeやケーブルが真っ赤です。ガッデム。 INCASEはカメラバッ

日付や時間を指定して差分ファイルを抽出できるアプリCowseeを紹介します。 AIRで作られたアプリケーションなのでWinとMacどちらでも動きます。 リポジトリを作成してればGitで差分を取り出したりできますが、 Windowsなら「拡張コピー」で選択してコピーしたり、なんなら自力で抽出。 うむ。めんどくさい。。 CowseeはGUIで簡単に差分抽出できるのでオススメです。 Cowseeの使いかた 操作は簡単で、 調べたいフォルダとコピーしたいフォルダをテキストエリア内にドラッグして更新日時を指定し書き出すだけです。 調べるフォルダの階層の指定や隠しファイルを含めるかなどのオプションもあります。 1ファイルであればそのまま修正してクライアントにメールで送信してもいいですが、 複数ファイルを修正した際、階層が違う場合は階層構造を持たせたままZipで送った方が楽ですね。 Cowseeはコピー

Hammer for Macを作っているRiot社がAnvilをいうアプリも作っていたので入れてみた。 AnvilはRubyのライブラリPowをGUIで設定できるアプリです。 Anvil for Mac http://anvilformac.com/ PowとはオープンソースのMacOSX用Rackサーバーのこと。 Node.js と CoffeeScriptで実装されているらしい。 http://pow.cx/ Anvilをインストールすると、メニューバーにアイコンが出ます。 Powがインストールしていないと”Install Pow”と表示されるのでPowをインストールします。 黒い画面が出るのでパスワードを入力しPowをインストールします。 「＋」ボタンでフォルダを選択したらデフォルトではフォルダ名で登録されます。 この「フォルダ名+dev」がローカルでのURLになります。 変更もでき

WordPress.com(ブログサービスのほう)のCSSエディターがSass・Lessに対応したようです。 WordPress.comの機能はパッケージ型のWordPressでもJetpackプラグインにより提供されているので早速試してみました。 とりあえずプラグインをインストール。 1. プラグインからJetpack by WordPress.comをインストール。 2. WordPress.comのアカウントが必要なので登録しアカウント認証。 インストールと認証が完了するとJetPackのメニューが現れます。 JetPackのメニューからカスタムCSSを選択。 もしくは、「外観」から追加された「CSS編集」。 CSSスタイルシートエディター画面にいきます。 この「カスタムCSS」とは、テーマのstyle.cssとは別のCSSで、 テーマのCSSをいじらずに外観を編集する際に使用します