SourceTree（Git）から差分ファイルを抽出してzipに圧縮 - Jiro Laboratory
SourceTreeでコミット間の差分ファイルを抽出して zipファイル に圧縮する方法です。 フォルダ構成を維持した状態で差分が抽出されます。 リリース後に変更分のソースを渡したりするのに重宝します。 ics.media 上の記事を参考にしていますが、以下を変更しています。 日本語ファイル名が化けてエラーになるのを修正 git.exe にパスが通っていない環境用にフルパス*1を指定 バッチファイルを作成（export_diff_zip.bat） gist.github.com SourceTree にカスタム操作を追加 ツール > オプション > カスタム操作 > 追加ボタン 「実行するスクリプト」に上記のバッチファイルを指定します。 実行 こんな感じで２つのコミットを選択して右クリック > カスタム操作 から選択します *1:環境に合わせて書き換えてください
まだフォント探しで消耗してるの？足りないフォントの検索ができるSketchプラグイン「FontBuddy」の使い方 | テクニカルクリエイター.com
まだフォント探しで消耗してるの？足りないフォントの検索ができるSketchプラグイン「FontBuddy」の使い方 Animaさんがまた素敵なプラグインを出してしまったようですね…。 他人からSketchファイルをもらったとき、「Missing Fonts」と警告が出ていたことはありませんか？ そうそう、こういうやつです。 そんなときに、自動的にフォントを探してインストールしてくれるプラグイン「FontBuddy」が公開されました！ FontBuddyの使い方 まずはサイトからダウンロードします。メアドの登録が必要です。 ダウンロードしたらFontBuddy.sketchpluginを開いてプラグインをインストールします。 インストールしていないフォントが使われているSｋetchファイルを開いてみると緑色の表示が出ています クリックすると、該当のフォントが検索されてプレビューが表示されます
死んだCSSを見つける方法 - Qiita
使われてないCSSであればツールで見つけられますが、そうではなく、"実質的に"使われてないCSSを見つけるにはどうすればよいでしょうか。 という問題にスマートな解決方法を記載している記事を見つけたので訳してみます。 以下はFinding Dead CSSの日本語訳です。 Finding Dead CSS 私が今週開いていたパフォーマンスワークショップで、Webサイト上で死んだCSSを見つけるテクニックが頭をよぎりました。 今、故意に『未使用CSS ( unused CSS ) 』ではなく『死んだCSS ( dead CSS ) 』というフレーズを使いましたが、これは以下のようなシナリオを想定して使いました。 数十人規模の多数のチームが開発している、数十万行のコードを含む、長期にわたって運用されている大規模なプロジェクトがあるとしましょう。 そこには既に使われていないCSSがあるだけではなく
googleスプレッドシートのフィルタ機能で自分だけの絞り込みを行う方法 - Qiita
googleスプレッドシートの複数人でファイルを同時に編集する機能、とても便利ですよね。 ただ、フィルターをかけようとしたら他の人の表示もフィルターされてしまい、困ったことはありませんか？ 「フィルター禁止！」なんて運用ルールになり、非常に不便な思いをしているケースを見たことがあります。 実は、わかりづらいですが解決策があるので、それをご紹介します。 「フィルタ表示」機能を使う 絞り込み対象の 「データ > フィルタ表示 > 新しいフィルタ表示を作成」 とクリックしていきましょう。 画面の表示が変わり、データの周りの領域がグレーの表示になりました。 これが「フィルタ表示」機能が有効になっている状態です。 このフィルタ表示状態にしてから絞り込みを行うと、他の人には影響を与えずに、自分だけ絞り込み表示をすることができます。 ↑他の人から見ると絞り込なれていない状態で表示されている 仕組み 実は
WordPressの代わりになる！2018年注目の静的サイトジェネレーター6選
WordPressを使ってブログサイトやホームページを作成しているひとは多いかもしれません。しかし、もしあなたにプログラミングの知識が多少なりともあって、SEO上も有利にしたいのであれば、静的サイトジェネレーターを使ってみるのはいかがでしょうか。 静的サイトジェネレーターを使えば、データベースが不要になり、一般的にページの読み込み速度も上がるとされています。汎用的に使えるものからシンプルに使えるものまで幅広く存在するので、用途にあったものが選べます。 そこで今回は、2018年に注目の静的サイトジェネレーターを、概要を中心にご紹介していきます。 サンプルコードなどは、参考として挙げているページをご覧ください。 静的サイトジェネレーターとは？ 静的サイトジェネレーターとは、Markdownなどで書かれたファイルをもとに、静的なコンテンツのテンプレートだけでビルドを行いサイトを作成するためのWe
今日からUnity + Visual Studio Codeを用いた快適な開発生活(随時更新中) - Qiita
最初に 記事で使用する作業環境は以下の通りとなります。 Visual Studio Code：1.19.2 Mac：「OS X EI Capitan」 Windows：「Windows10」 Visual Studio Codeをインストールするためのシステム要件を以下に掲載します。 また、本記事で気になったことや書いてほしい機能等ありましたら以下Twitterもしくはメールアドレスまでご一報いただけますと幸いです。 Twitter:https://twitter.com/4_mio_11 mail:mio041100505@gmail.com VS Codeとは Visual Studio Code(以下 VS Code)はマイクロソフトが無償で提供しているオープンソースなデスクトップアプリケーションです。このVS Codeの開発を率いているのは「オブジェクト指向における再利用のためのデ
結局Firebaseのdbでは何に気をつけるべきか？少しマニアックな内容も含め，わかりやすく説明する(realtime database) - Qiita
結局Firebaseのdbでは何に気をつけるべきか？少しマニアックな内容も含め，わかりやすく説明する(realtime database)AndroidiOSAngularVue.jsFirebase Firebaseのrealtime databaseはいわゆるNoSQLであり，馴染みが薄い人が多いとともに，一般に流布している情報はふわっとしていてわかりづらい． 山に篭って修行していたらある程度知見が溜まってきたため，下山して共有する． 追記： 新しいdbが発表されたので雑感書きました． Firebase RTDB + GCP datastore = Firestoreについて第一印象 tl;dr 割り切れ！ ユーザの見えるままに作れ！ それ以外の細末は下記参照 大原則その1：割り切り これは特にRDB勢に気をつけていただきたい． 我々は少し気を抜くと，つい正規化したがり屋さんになってし
よくJavaScriptで実装されるものをHTML・CSSのみで実装してみた
JavaScriptをあまり使いたくない、使えない。 速度の面やSEOとして、CSSで実装したい。 そんな方のために、JavaScriptで実装されがちなものを、HTML・CSSのみで実装してTipsにしてみました。 IE11〜、iOS Safari 9.2〜、Androidブラウザ4.4〜でだいたい動きます（ベンダープレフィックスが必要な場合も）。 デメリットもあるので、合わせて確認してみてください。 バルーン表示
【自分で出来る】羽毛布団の洗濯方法を紹介！（コインランドリーを活用せよ） - 教えて！ホルスタインおじさん！
ども、ホルスタインおじさんです。 皆さん羽毛布団って洗濯してますか？ 冬の間に吸った、汗・皮脂・汚れはダニの格好の餌になってるのはご存知ですか？ 今回は、自分でもできる羽毛布団の洗濯方法をコインランドリーの店主に教わったのでご紹介します。プロ直伝なので本格派ですよ。 コインランドリー 準備編 洗濯機編 羽毛布団と毛布は別々に洗う 折りたたみ方にコツがある 乾燥機編 乾燥機投入前に手で羽毛の潰れを広げる 乾燥機に投入 と乾燥時間 持ち帰り後にすべきこと かかった金額と時間 最後のアドバイス 面倒くさいと思ったら・・・ 準備編 イケアのバックは羽毛布団も入ります まず、準備すべきは羽毛布団を持ち運べる入れ物です。 意外とイケアのバックが丁度いい大きさでしたね。 洗濯後は体積が増えるので少し余裕があった方がいいですが、羽毛ぶとんは圧縮可能なのであまり気にしなくてもいいですよ。 今回コインランドリ
Visual Studio Code で文字コードの自動判別
Visual Studio Code 日本語のSJISのテキストを開くと文字化けし、その都度手動で文字コード変更が必要でしたが、 Visual Studio Code バージョン 1.11 から文字コードを自動判別してファイルを開くことが可能になりました。 https://code.visualstudio.com/updates/v1_11#_auto-guess-encoding-of-files ユーザー設定 ([ファイル(F)]>[基本設定]>[設定(S)]) に files.autoGuessEncoding を設定することで自動判別が有効になります。 { // 有効な場合、ファイルを開くときに文字セット エンコードを推測します "files.autoGuessEncoding": true } 快適です。まだまだShift-JISな文書は多いですからね。
VS Codeのミニマップが邪魔なので消す - mrivのメモ書き
(2019/05/14) 設定画面が新しくなったので更新 手順 [ファイル]→[基本設定]→[設定]で設定画面を開く (ショートカット Ctrl + ,) 検索でminimapと入力 Editor > Minimap: Enabled のチェックを外す 設定画面が新しくなってから、随分と簡単になりましたね (当初の内容) Visual Studio Code を1.13.0にアップデートしたら、スクロールバーの横にミニマップが常に表示されて邪魔！ なので消す手順の備忘録。 手順 ツールバーの「ファイル」→「基本設定」→「設定」で設定画面を開く 設定のJSONに以下の内容を追記して保存する "editor.minimap.enabled": false おしまい！
PDFが文字化けする原因と対処法
PDFで保存すれば、どのような環境でも同じように表示されるという認識を持っている人は多いでしょう。しかし、ごく稀にPDFで保存したとしても文字化けなどのトラブルが起こる場合があります。この記事では、PDFが文字化けする原因と対処法について説明します。 ここでは、次の３つのケースについてそれぞれ説明していきます。 PDFをコピー＆ペーストしたとき文字化けする PDFを変換したとき文字化けする PDFを印刷したとき文字化けする PDFをコピー＆ペーストしたとき文字化けする テキストファイルをコピー&ペーストするとき、ほとんど問題なくできますが、PDFファイルをコピー＆ペーストすると一部の文字が文字化けしてしまう場合があります。 PDFを作成する際に、フォントの埋め込みが行われなかった可能性が考えられます。その場合は、Acrobat（有料ソフト）のOCR機能を使って直接編集する方法がありますが、
三本線のメニューアイコンから×マークに変化するアニメーションいろいろ - Qiita
<div class="menuWrapper"> <a href="#menu" id="menuButton"><span>MENU</span></a> </div> .menuWrapper { position: relative; z-index: 0; border: 1px solid #ccc; width: 50px; height: 50px; } #menuButton { overflow: hidden; display: block; position: relative; z-index: 0; width: 50px; height: 50px; cursor: pointer; } #menuButton span, #menuButton::before, #menuButton::after { display: block; position: a
ReactをjQueryの数行に要約する | POSTD
「Reactが素晴らしい理由は、UIをアプリケーションの状態の純粋関数にできるからだ」いうような話を聞いたことがあるでしょう。しかしそれだけではなく、不変性と仮装DOMを利用して動作するということも聞きますよね。その上、保存、読み込み、取り消し、それにタイムトラベル・デバッグと呼ばれるすごい機能まで自由に手に入れられる。でも知っていますか？ Reactの核となるアイデアを利用し、その恩恵に預かるのにこれらのことは必要ありません。jQueryの数行にしてお見せします。 <span id="colored-counter">0</span> <input id="color"></input> <button id="inc"></button> <script> $('#color').on('keyup', function () { $('#colored-counter').css('
これは使える!覚えておきたいEXCELのちょっとした技20選 - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
Photoshopでの作業がはかどる！ウェブデザイン（特にスマフォ）用の効果的な環境設定のまとめ
Photoshopでウェブページやスマフォページのユーザインターフェイスをデザインする時に、最も良い結果がでる最適な環境設定を紹介します。 最後の「作業のパフォーマンスを向上させる設定」はウェブデザインに限らず、Photoshopの動作がもっさりしている人は見直してみてください。 How To Set Up Photoshop For UI Design 下記は各ポイントを意訳したもので、画像は当方のPhotoshop日本語版です。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。海外の多くのブロガーからあのブログでの無断翻訳・転載の声を聞くのでご注意ください。 環境設定はiPhone用を例にしていますが、基本的なポイントは全てのウェブデザイン作業に適用できます。 新規ドキュメントの設定 スナップの設定 テキストの設定 光源の設定 グリッドの設定 画像を書き出す時の設定 R
ソシオメディア | iOS6 Mobile Safari : ローテーションで余白が生じる現象への対処
はじめは問題なく表示されているが… デバイスを一度横向きにして戻すと余白ができる スマートフォンの普及にともない、スマートフォン向けウェブアプリケーションのUIデザインを依頼いただくことが多くなってきました。 先日、ある一般消費者向け検索サービスのスマートフォン対応に際し、UIデザインとプロトタイプ制作のお手伝いをさせていただきました。 ちょうど同時期に iOS6 のリリースがあったのですが、プロトタイプのコーディングをしているなかで、「端末を回転させているうちに余計な余白ができてしまう」という iOS6 特有の不具合に出くわしました。 スマートフォン向けのいくつかのウェブサイト/アプリケーションに同様の現象が見られましたので、不具合解消の一助になればと思い、現象の発生条件と対処法を紹介させていただきます。 iOS6 の Mobile Safari で、画面をランドスケープ表示（横向き）か
Photoshopで30分かかっていた作業がわずか1分でできるようになる「神速Photoshop [Webデザイン編]」
「学校では教えてくれない、89の時短テクニック」「自己流で時間をムダにしていませんか？ウェブデザインをもっとラクに、もっとすばやく」ということで、かなり実践寄りの効率的なテクニックばかりを集めたのが「神速Photoshop [Webデザイン編]」です。ちょうどPhotoshop CC＋Lightroom 5が月額980円で使える「Photoshop 写真家向けプログラム」を使い始めたところだったので、しげしげと読んでみてお役立ちっぽいのがないかどうか探してみました。 まず以下が神速デザイン五カ条、「ショートカットを活用しよう」「最新機能を使いこなそう」「目的によってツールを使い分けよう」「「直し」に強いデータを作ろう」「面倒な作業は自動化しよう」ということで、どれもこれもごもっともな感じ。人は放っておくと今までの慣れ親しんだやり方が非効率的であっても「慣れているから」というただそれだけの理
![Photoshopで30分かかっていた作業がわずか1分でできるようになる「神速Photoshop [Webデザイン編]」](https://cdn-ak-scissors.b.st-hatena.com/image/square/0c41fbe4b12f924168669811ff3092c3f86d6551/height=288;version=1;width=512/https%3A%2F%2Fi.gzn.jp%2Fimg%2F2014%2F04%2F04%2Fphotoshop-god-speed-web%2FP1930188.jpg)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
シン・総火演撮影メモ
@webbingstudio@githubのマイページ - Qiita
