Chrome の console.log でハマらないために
JavaScript を書いたことがある人ならば一度は使うであろう console.log ですが、この関数は思ったよりも厄介な性質を持っています。その性質を知らずに console.log を使うと、デバッグ時に大ハマリしてしまうことがあります。この記事では console.log の落とし穴についてお話します。 今回は Chrome に特化して解説しますが、Firefox や Safari でも同じ落とし穴があります。 console.log とは まずはさらっと基本をおさらいしましょう。 大前提なのですが、console.log は JavaScript の言語仕様（ECMAScript）で定義されていません。ブラウザ向けには whatwg の仕様がありますが、あくまでもそれはブラウザ向けの仕様であり、Node.js を含むほぼ全ての JavaScript 環境で使えるのは cons
開発体験を変える! Chrome DevTools Tips 7選 - Qiita
最近Chrome DevToolsについて調べていて発見した便利機能を紹介します。 誰もが使える最高便利な開発マシンChrome DevToolsを使いこなして開発体験を変えましょう！ 1. $0で選択中のDOM要素の取得 特定の要素に何かしたいという時には、要素のIDやclassを確認してConsoleでdocument.querySelector("#xxx")で取得するというのが一般的だと思います。実はそれはカーソル選択と$0で代替できます。 Classや、IDがついていない特定のDOMを取得したい時とかにも使えるので地味に便利です。 手順 カーソルで取得したい要素を選ぶ Consoleタブで$0を入力 最近知ったChrome DevToolsの便利機能① $0 での選択中のDOM要素取得 Elementsタブで選択状態のDOM要素は、Console上で $0 を入力することで取得で
VSCodeのオススメ拡張機能 24選 (とTipsを少し)
1. vscode-icons アイコンがついて見やすくなる。 2. GitLens とにかく強い。 「コミット単位でのファイル比較」や「最新のコミット内容とそのコミッター表示」など色々してくれる。 git blameする手間なくなる。 3. Prettier コードのフォーマットは自動でやりましょう！ 複数人のこだわりをうんたらするよりも、Prettierに委ねるのが楽。 関連のTipsはここ 4. Git History Git logが見やすい 5. Bracket Pair Colorizer カッコの対応を色付きで表示してくれる。 ものすごく読みやすくなって最高&最高！！ なおBeta版ですが、後継となるBracket Pair Colorizer 2も出ています。 6. Settings Sync どこでも同じ設定で使いたい人には便利。 ⇧ + ⌥ + U/D で設定をアップロ
検索じゃ学べない！ HTML/CSS/JavaScriptの気づきTipsまとめ31こ | _level0 - KAYAC Front Engineer Blog
HTMLファイ部のほんだです。 気づきTips！ Σ(・ロ・) カヤックの中でもHTML5のWebフロントエンド実装を担当する エンジニアを集めた部署「HTMLファイ部」では、 制作にあたってはまったことや、気づいたことをメモ的に蓄積・共有しています。 通常は、 1. 制作で何かわからないことがでた ▼ 2. Google等で検索して解決の糸口をさがす ▼ 3. こんな方法があったのか〜 と気づきを得る というフローでスキルアップしていくことがもっぱらだと思うのですが、 学びを増やしていくためには違うアプローチも必要なんじゃないかと思います。 カヤックHTMLファイ部では、 1. みんなで蓄積したTipsをざぁっと読む ▼ 2. こんな方法があったのか〜 と気づきを得る ▼ 3. 制作の際に導入していく というフローを繰り返し実践していくことで、 検索では気づけないことを学び、実装力アップ
MacBookAirで使っている便利ツール vol.2 - Qiita
##概要 ###Mac | Mavericks Mavericksの設定については、ブログでも何度か紹介してきましたので、割と簡単にいきたいと思います。 主に、使用しているツールを書いていきます。 ###Windows | Windows7 私の場合、メインとしてCygwinとPowerShellを使っています。 Windows7は、仮想環境上で動作させています。 アプリのインストールは、Chocolateyで行います。 その他、TerminalにConsole Zを使います。 ###Linux | Manjaro Linux 現在、もう一つのMacBookAirには、Manjaro Linuxを直接インストールしています。 ウィンドウマネージャは、Awesomeを使っています。 最初は、Macとのデュアルブートしてみたのですが、どうもしっくり来なかったので、Macは消しました。非常に快適
最初に設定しないと絶対損する！Google Analytics 9個の必須設定＆解説 | Find Job ! Startup
アクセス解析は最初の解析設定が命。「やっておけばよかった！」と後悔しても、設定し忘れた集計数値はもう2度と手に入りません。 Webサイトの財産とも言える解析データをしっかり取得してビジネスの成長につなげるためにも、必ず設定しておきたいGoogleアナリティクスの必須設定項目をまとめました。 もし抜けがあるようでしたら、この機会に設定してみて下さい。 ※現時点で、アナリティクスの設定は標準・ユニバーサルの2種類があります。ユニバーサルは、まだ不完全なので今回は「標準」での設定をベースにご紹介します。 【設定1】プロパティ＆プロファイル まずはサイトの運用方針などに合わせて、的確にプロパティとプロファイルを設定します。 基本的には「サイトごとにプロパティ」設定がおすすめ いくつものサイトを『それぞれ別のドメインで展開』する場合や、サブドメインでそれぞれのサイトを管理する場合、基本的に
Mountain Lionの知名度は低いが有用なコマンドたち - 新・OS X ハッキング!(97)
いよいよ来週から「WWDC 2013」がスタートします。基調講演も予定されていますから、Macの新機種にOS Xの次期バージョン、iPhoneにiPadにiOSに……と何が発表されても不思議ではありません。個人的には、これまで見たこともない新デバイスの登場に期待しています。 さて、今回は「知名度は低いが有用なコマンド」をいくつか取りあげる。Mountain Lionに収録されているコマンドは千数百、知らないコマンドがあるのは無理からぬ話で、これを機に機能や使い方を知ってはいかがだろう。 Macの眠気覚ましには「caffeinate」 名前にインパクトはあるが、知名度はいまひとつの「caffeinate」。Mountain Lionから登場したOS X/Darwinの独自コマンドで、わかりやすくいえばシステムのスリープ禁止期間を設けるためのもの。"カフェイン注入"的な役割であることは、コマン
デジイチに関する覚え書き - guldeenのはてブロ
ども、guldeen（『ガルディーン』って読むんだよ。知らなかった方は、この機会に覚えてください）です はてなブログ開設そうそう、書くネタがこれかよ！って感じですが、いちおう“カメラ屋店員”だった事もある自分としては、このネタはスルーできなかったので。 「デジタル一眼レフ買いたいけど、どれにすれば良いかわからない」という記事に多くの反響が返ってきらむたたぞ！ わざわざカメラ専用機を買うことの意味 iPhoneに限らず現在の携帯通信端末機器には、必ずと言っていいほど『内蔵カメラ』が装備されています。2010年代以降の機種に内蔵のカメラは、L判(現た像ショップではサービス判、なんて言ったりも)でプリントする・あるいは「写メール」等の用途なら、とくに不都合を感じさせないくらいの高い品質の画像が撮影できます。ふだんから通話・メール送受信やウェブ閲覧に使ってる端末で、静止画・動画が撮影できるわそれを
意外と知られていない!?自分のブログへ積極的に「はてブ」するメリットを教えるぞ！ - むねさだブログ
こんにちは、わんぱくブロガーのむねさだ(@mu_ne3)です。 今日はちょっとWEBサービス系のお話。 自分のブログに「はてブ」を付けるセルフブックマーク、いわゆる「セルクマ」と呼ばれる行為は、賛否両論あると思います。 ただ、僕はある理由から、自分のブログに積極的に「はてブ」するようにしています！ これって意外と知られていないのでは？と思うのでご紹介したいと思います。 はてブとは？ はてブとは、はてなブックマークの略。 はてなブックマーク はてなブックマークとは、日本最大級のソーシャルブックマーク。 「ブックマークしておこう」と思ったものをインターネット上にブックマークしておけるサービスです。 基本的には、「後で見よう」とか、「これは役に立つ！」等と思ったサイトに対して「ブックマーク」するのですが、 この行為を「はてブ」を付ける。などと言ったりします。 このように多くの人が「はてブ」を使う
とりあえずJavaScriptを記述して動作を確認したいって時はFirefoxに搭載のスクラッチパッドが断然便利 ｜https://wp.yat-net.com/name
2013年 04月 05日 とりあえずJavaScriptを記述して動作を確認したいって時はFirefoxに搭載のスクラッチパッドが断然便利 カテゴリ： Firefox タグ：javascriptエディタデバッグ JavaScriptを記述出来るエディタは沢山あるんですが、「とりあえずソースを書いて試したい」って時はFirefoxに標準で付属しているScratchpad（スクラッチパッド）を使っています。 Scratchpad（スクラッチパッド） Firefox 6で搭載されたスクラッチパッド。使ってる人は結構居るかもしれませんが、まだ知らない人も居ると思うのでちょっと紹介しようと思いました。 Firefoxにはブラウジングする機能以外に開発者向けの機能が沢山備わっています。Scratchpad（スクラッチパッド）もその中の一つで、これはJavaScriptのソースを記述・実行・デバッグが
quusookagaku.com - quusookagaku リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
Macの小技16個。あまり知られてないと思う操作方や隠し設定など。 | Macとかの雑記帳
Macの操作方や隠し設定など16個です。最近知ったものや以前どこかで見たけど忘れてたもの等、メモを兼ねてまとめて記事にしてみました。 Macの小技16個 目次 アプリケーションスイッチャでアプリのウィンドウ一覧を表示 アプリケーションスイッチャから最小化したウィンドウの復元と新規書類の作成 装飾されたメールをプレーンテキストで表示 メールに添付されてるファイルをアイコン表示にする メールの内容を素早く他のアプリにコピー ページアップやページダウン時にカーソルも移動 改行やタブを検索対象に含む Macに入っているフォント一覧のサンプルを作成 Dockアイコン上でスクロールしてアプリケーションウィンドウを表示 Dockの表示位置をドラッグして移動 Spotlightでカテゴリ単位の移動 Spotlightでファイルパスなどを表示 ウィンドウの大きさを簡単に変更できるようにする 複数ファイルの
「間抜けで気持ちの悪い文章」を書くために知っておかなければいけない6つのテクニック
ブログや日記、メールなどを作成している際についつい「正しい文章」を書いてしまい、読んでいる人を辟易させたことはありませんか？ 日本語が乱れがちな現代社会。 没個性を重んじる風潮が強いこの国において、”この人は正しい日本語が扱えるきっちりした人だ”と言う印象を与えることは、あなたのイメージを損ねる原因となりかねません。 そこで本日は、読んでいて気持ちの悪い「間抜けな文章」を書くために知っておくべき6つのテクニックをご紹介しましょう。 間抜けな文章を書くために では実際に気持ちの悪い文章テクニックと文例を見ていきましょう。 最初に出ている青枠は気持ちの悪い（今回の講座においては正しい）文章、赤枠はきっちりと構成された大変に読み応えのない悪い例です。 1.敬体と常体を入り混ぜましょう。統一性が無くなるからだ。 私は篠崎愛ちゃんが大好きだ。 彼女の豊満な体にばかり目がいきがちですが、注目すべきはそ
iOS向け Xcode開発Tips入門編 -とりあえず最初にやってること- - @kitano_ow 's blog
ちょっとした細かい事なんですけど、設定とかimportとか プロジェクトを跨がって使いそうなやつは最初にうちにやってること多いんですけど、 その辺のネタを少々・・・ 1.NSLogの拡張と、prefix.pch NSLogは、コンソールにその内容を出力してくれるわけですが、 NSLog(@"%s",__PRETTY_FUNCTION__); NSLog(@"%d",__LINE__); とすると、 __PRETTY_FUNCTION__：クラス及び関数名 __LINE__：行数 などを表示してくれます。 ただ、毎回これを記述するのは、 面倒なのでだいたいマクロにしたりしますが、 #define LOG(fmt,...) NSLog((@"%s %d "fmt), __PRETTY_FUNCTION__, __LINE__, ##__VA_ARGS__); これをあるヘッダファイルなどに記述
Mac を使っているなら必ず使うべき2つの機能 "Automator" と "サービス" - kurainの壺
Automator ってなんか超高機能なマクロみたいなイメージがありますが、とても便利なのでご紹介。 もともとは、会社の上司が Windows から Mac に移行したのだけれど、"秀丸みたいに選択範囲を ruby で evalできないの" とおっしゃっており、しかも Emacs は微妙とのことなので、Automator でどうにかしてみた。Service でできるんじゃないかねと教えてくれた同僚に感謝。 追記(2013/02/24) デバッグ方法を別エントリに書きました できること 文字列選択して Ctrl+= を押すと選択文字列が ruby で実行されます。編集可能なテキストエリアならだいたい何処でも。 作り方 アプリケーション ディレクトリにある Automator を起動します。 新しくサービスを作ります ユーティリティ > "シェルクスクリプトを実行"というアクションを選んで右の
MacのQuickLookを快適にするプラグインや小技など17個のTips | Macとかの雑記帳
Quick Lookの機能を強化するプラグインと、Quicklookでソースコードをハイライト表示してくれる「QLColorCode」を自分好みにカスタマイズする方法、ついでに小技なども含めた17個のTips集です。 微妙な感じのプラグインが少し混ざってますが、メモを兼ねてまとめて記事にしてみました。 Quick Lookを快適にする17のTips 目次 QuickLookでシンタックスハイライト JSON形式のファイルを表示 Appleスクリプトを表示 拡張子のないファイルを表示 Markdownで書かれたファイルを表示 CSVファイルを表示 ZIP等の圧縮ファイルの内容を表示 パッケージファイルの中身を表示 画像ファイルのサイズを表示 Photoshopのブラシを表示 ZIPファイルのサムネイルを変更 SQLite3のデータベースを表示 Day Oneの日記を表示 NFOファイルを表
[WordPress]閲覧中の記事と同じカテゴリの最新記事をブログのサイドメニューに表示する方法 | NANOKAMO BLOG
photo credit: Oxymoronical via photopin cc どうも@kuroji1987です。 最近@isloop氏と@kogure氏の記事を読んで、色々とブログをいじいじしておりました！ ブログでめしを食うために行っている5つのSEO | 和洋風KAI [N] 「ブログでめしを食うために行っている5つのSEO」を読んで考えたこと いくつか仕込んだのですが、とりあえずその成果として、サイドメニューに表示している記事と同じカテゴリーの最新記事を表示する方法をご報告したいと思います。 ずらずらーっとコードを晒しますので、あとは煮るなり焼くなりコロ助ナリでお願いいたします。 同カテゴリーの最新記事を表示するコード WordPressのフォーラムにあったコードを参考に表示させています。 <!-- 同カテゴリー記事 --> <?php if( is_single())
MacBook Pro Retinaに入れたフリーなソフトウェア - ザリガニが見ていた...。
MacBook Pro Retinaを使い始めて1ヶ月が経過した。Snow Leopardである旧MacBookの環境は丸ごとコピーせず（OSが劇的に変わっているので）、必要なものだけ、その都度、ひとつ一つ手作業でコピーしてきた。ゆっくりだけど、少しずつ便利な環境になりつつある。以下は何をインストールしてきたか、のメモ。 方針 可能な限りOS標準の状態を維持する。 可能な限りOS標準のソフトウェア・機能を利用する。 しかし、そうなっていない気もする...。 Resolution changing app Retina入手したら、まずは2880×1800の素の解像度を試したくなった。 圧巻！なんて広いデスクトップだろう！ と同時に、なんて小さな文字だろう...。 現状はAppleScript＆Quicksilverを利用して、以下の解像度に自由自在に変更できるのだ！楽しい！ Retinaの広
スマホサイト対策！ウェブクリップアイコンの設定を忘れずに | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！サリーです。 昔は、設定していたら「あらオシャレ」くらいの感覚だったfaviconも、近頃はすっかり必須項目となってまいりました。 ▲ちなみにLIGのfaviconはこんな感じ その一方で、最近ではスマホ用の「ウェブクリップアイコン」というものがあります。 これがちゃんと設定してあると「おっ」て思います。とっても簡単なので設定してみましょう。 ウェブクリップアイコンって？ スマホではホーム画面にブックマークのアイコン（タップでブラウザが立ち上がり任意のサイトが開くアイコン）を置くことを、「ウェブクリップ」と呼びます。 そのときホーム画面で使用されるアイコンの事をそのまんま「ウェブクリップアイコン」と呼ぶのですね。 ウェブクリップアイコンをホーム画面に設置する方法 iPhoneなどの場合 iPhone/iPod touch/iPadでは、Safariでサイトを開き、下部中央の共有
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
cmmntr.com