意外と知らない？HTML/CSSを書く上で便利なデベロッパーツールの機能13選｜かずたか
※こちらの記事が400はてブ以上ついて、総合とテクノロジーの人気エントリーに入りました！ こんにちは。Kazutaka Shimizuです。 フリーランスとしてPM、エンジニアをやっています。 元々はWebマーケティングのコンサルタントをやっていましたが、独学でWeb開発を勉強してプロダクトを作って起業しました。 最近は創業した会社を離れ、フリーランスとして活動したり、プログラミングを独学した経験をこちらのツイッターで発信しています。 みなさんはGoogle Chromeのデベロッパーツールをご存知ですか？ ドットインストールなど一部のプログラミング学習サービスでは、デベロッパーツールのレッスンがあるなど、おそらく全く知らない人はかなり少ないと思います。 しかし、とにかく多機能なため、意外と便利な機能を使ったことがないというプログラミング初心者の方も多いようです。 僕自身、何度か自分のTw
https://filmora.wondershare.jp/video-editor/
Call us: +1-60-4343-8521 Mon-Fri 6:00 PM to 11:00 AM Pacific Time
校正用コマンドラインツールtextlintのChromeアドオン版を試してみた ｜ DevelopersIO
ブログ記事の誤字脱字目視確認が割と不安な haoyayoi です。 ブログは勿論、社内チャットでの送信する文章に対して以下の２点で目視確認を入れています。 typoしていないか 異なる意味で受け取られないか 不安なときは3重或いは４重と見直すのですが、それでもやはり見落としは発生します。 今回、testlintのChromeアドオン版にてその負担が若干なり軽減できた感覚がありましたので紹介します。 textlintとは テキストやMarkdown等へ、プラグイン等の形式で利用可能な文法チェックツールです。 Github : textlint/textlint DevelopersIO上の関連紹介記事 Atomとtextlintで始めるその場で文章校正ができる環境の作り方 Chromeアドオン版について textlintについては、オンライン自動校正サービスや特定のエディタにおけるプラグイン
Adobe XDはUIデザインツール戦国時代を制するか？ 次期機能をこっそり聞いた
登場から1周年を迎えたUIデザイン＆プロトタイピングツール「Adobe XD（Experience Designer）」の進化が止まらない。2016年3月のMac向けプレビュー版リリース以降、毎月アップデート版がリリースされ、2016年11月にはベータ版へ移行。12月にはUIデザインツールとしてはめずらしい、Windows 10向けのベータ版もリリースされた。この間、日本語UIへの対応はもちろんのこと、レイヤーやシンボルといった機能を次々と追加し、Sketchなどの競合ツールを急速にキャッチアップしている。 ハンドオフやレスポンシブ対応など待望の新機能も開発中 UIデザインやプロトタイピングツールはいま、戦国時代を迎えている。オランダ発のUIデザインツールSketchを中心に、InVisionやFlinto、Prott、Framerといったプロトタイピングツールも広く使われている。Face
5000人調査でわかった！世界のフロントエンド開発者が使うツールはこれだ
次々とリリースされるJavaScriptライブラリーにフレームワーク、進化を続けるCSSモジュール……と、変化の激しいフロントエンド開発界隈。いま開発者たちに実際に使われているのはどんなツール？ 開発経験は2年以上ありますか？ 高度なCSSスキルとしてSassやAutoprefixerの使用も含まれていますか？ JavaScriptの知識は十分にあり、Gulp、nmp、jQueryを使いこなせていますか？ そうであれば一般的な開発者だそうです。Ashley Nolan氏によるフロントエンド開発ツールのアンケート調査によれば。 気になる結果を見る前に…… この種のアンケート調査は新たなツールを見つけたり、知識不足の分野の把握に役立ちます。執筆時点で5254件の回答が寄せられていて、アンケート調査としてはかなりのサンプル数です。ただ、結果を疑いようのない真実だと受け取るには慎重になるべきです。
iOSとAndroidアプリをWeb開発者が超高速で作れる「Fuse」って知ってる？
iOSとAndroidアプリをJavaScriptのコードで開発できる「Fuse」を知っていますか？動くモックアップをWeb開発者やデザイナーがすばやく開発できる便利なツールの使い方を解説します。 この記事では、Fuseを使用してHacker Newsリーダーアプリを作成します。Fuseとは、AndroidデバイスとiOSデバイスの両方で動作するクロスプラットホームアプリを開発するためのツールです。プロジェクトのソースコードはGithubにあります。最終的なアウトプットは次のようになります。 Fuseとは？ 一言で説明すると、FuseはJavaScriptを使ったクロスプラットホームアプリを作成するツールです。Fuseを支える基本的なアイデアは、React NativeやNativeScriptとよく似ています。FuseはJavaScriptを実行するためにJavaScript VMを使用
比べてわかったSketchとAdobe XDの違い 最高のUIデザインツールはどっち？
UIデザインに特化したデザインツールとして人気のある「Sketch」。その強力なライバルとなる「Adobe XD」と主要な機能と使い勝手を比べてみると……。 Sketchは長い間、Photoshop（ときにはIllustrator）と比べられてきました。 Photoshopは主に写真の編集に使われてきたものの、同時にSketchと直接競合する唯一のツールであり続けたためです。アドビは、アートボードの追加、エクスポート手順の改善、スマートガイドの追加など、UIデザイナー向けにPhotoshopを改良してきました。 もちろん、新機能を搭載したことによりPhotoshopはさらに肥大化して、あかたもオーシャンライナーにアイススケートリンクを追加したかのようです。 Sketchが勢いを増す一方、新たなデザインアプリ（Affinity DesignerやFigmaなど）が登場し、アドビはUIデザイナ
フロントエンドエンジニアなら知っておきたい、JavaScriptのログ収集方法まとめ
サーバーサイドに比べて見落とされがちな、フロントエンドのエラーログ収集。JavaScriptのログ収集、確認に役立つ手法、ツール、ライブラリーを総まとめ。 開発進行中も本番モードでの運用時も、ソフトウェアアプリケーションにおいてロギングは大切です。 サーバーを運用しているなら、サーバーサイドの言語選択にかかわりなく無数のライブラリーを利用でき、広範に及ぶストレージメカニズムやログ出力を扱う際の各種ツールも使えます。 しかし、クライアント側アプリケーションとなるとロギングは見過ごされがちで、利用できる手法もかなり限られています。 この記事ではクライアント側アプリケーション、特にJavaScriptを中心としたシングルページアプリケーション（SPA）におけるロギングの実装方法を紹介します。 コンソール エラーとメッセージのロギング方法でもっとも一般的かつ分かりやすいのは、おそらくコンソールの使
Google DocsみたいなUIデザインツール「Figma」Sketchから乗り換えるべき？
Chrome上で使えて、リアルタイムの共同編集もできるーーそんなGoogleドキュメントライクな特徴を持つUIデザインツール「Figma」がすごいと評判です。Sketchと比較してみました。 デザイン系のブログをフォローしている人なら、新しいUIデザイン作成ツール「Figma」の話題はもう知っているかもしれません。サンフランシスコのプロダクトデザイナーがFigmaを絶賛して注目されるようになりました。FigmaはSketchの長所を持ち、チームで共同編集が可能で、すべてブラウザー上（技術的に言えばChrome）で作成できます。 とはいえ、Figmaは実際どこまで使えるのか？ Sketchと比べてどうか？ Figmaをワークフローに組み込むべきか？ Figmaを試したので、まとめます。 FigmaとSketchの違い 1. Figmaはブラウザー上で動く（Chromeアプリ） Figmaはブ
うんざりするようなWeb制作のトラブルをスッキリ解決する7つの方法
Web制作案件でクライアントとモメないための、ちょっとしたコツと便利なツールを紹介。トラブルはスッキリ解決して、楽しい仕事に集中したいですね。 Webデザインのプロセスにおいて、タグを入れたり、分析したり、クライアントから報告された不具合を直したりすることは重要なことですが、必ずしも楽しいことではありません。今回は、そんな面倒な作業をできる限り簡単にしてくれる方法を紹介します。 リリース前にできる限りのテストをする リリース前の内部での動作テストは、潜在する不具合のうちのほとんどを取り除いてくれますが、クライアントやユーザーからの指摘はほんのわずかしか上がってきません。 Webサイトを訪れるユーザーの動作環境は、莫大な数の組み合わせ（デバイスのOS、ブラウザー、プラグイン、設定など）が存在します。そのため、テストの段階ですべての不具合を検出することは不可能です。さらに、思いもよらない操作を
Instagramをビジネスプロフィールに切り替える方法とメリットを紹介！
Instagramは2016年8月15日（米国時間）に、店舗や会社の連絡先などを掲載できる「ビジネスプロフィール」、投稿の閲覧数やフォロワーの属性などを調べることができる「Instagramインサイト」、広告配信を行える「投稿の宣伝」の3つのビジネスユーザー向け機能の提供を開始しました。 今回はその３つのツールの紹介から、ビジネスプロフィールの設定方法まで詳しくご紹介します！インスタグラムを使いこなして、ビジネスに活用していきましょう。 ※この機能は日本国内で徐々に展開されており、現時点でオプション画面内の「アカウント」の欄に「ビジネスプロフィール」への切り替え表示が無い場合はお使いのアカウントには導入されていない可能性があります。アプリのアップデートを行うなどして、随時確認してご利用ください。(2016年8月17日現在) ※更新 ビジネスプロフィールへの切り替えボタンが確認できるようにな
これ知ってる？WEBの人なら押さえておきたいツール＆サービス50選 - 死ぬまでWEB屋
公開前に知人に見せたら、読むのに20分もかかったわ！！ と、お叱りを受けましたｗ オススメのツールやWEBサービスということで50ほど紹介していますが、僕の使用感のほかに、ところどころ経験談的なものが入っています。そのあたり、読むのがめんどうな方は読み飛ばしていただければ幸いです。 2万文字近くあるので、お時間ある際にゆるりと読んでいただければと思います。 それではお楽しみ下さい！ サイト解析に使えるツール・サービス import.io Juicer Ptengine GTmetrix CLOUD FLARE wayback timemachine シミラーウェブ Open Site Explorer サクラサクLABO aguse Built with ディレクションに使えるツール・サービス ウェブチェッカー Cat Mdes maindmaister ひとりブレスト 関連キーワード取得
WordPressコアコントリビューターに聞く「ぼくのかんがえた最強の開発環境」
WordPressで開発をするなら、いまどきどんなツールを使うのがいい？ WordPress専門のデベロッパーであり、コアコントリビューターでもあるMatt Geriさんがおすすめるする、最高の開発環境とは？ 近年、WordPressによる開発は大きな進展を遂げています。特に、ツールに関しては。以前は、WordPressでサイトを構築しようものなら、ほぼ確実にMAMP/WAMPのローカルホスティングの設定をしなければならず、それはもう悩みの種でしたよね。ひょっとしたら、本番の状態でサイトの開発を進めなければならなかったりしました。 そう、私もその一人でした。 幸い、時代は変わり、いまではそんな頭痛の種や反復作業を取り除くツールが出てきました。 WordPress開発業者としてフルタイムで開発をしていた私は、WordPressから離れて丸3年後の2015年12月、再びフルタイムのWordPr
デザインデータの受け渡しが3倍捗る！Sympliはワークフロー革命だ
SketchやPhotoshopでデザインしたUI、エンジニアとどうやって共有していますか？ Sympliを使ったワークローなら、デザイナーもエンジニアも幸せになれるかもしれません。 2016年、デザインコラボレーションツールは大人気となっています。 一昔前は、カレンダーアプリとToDoリストアプリをうまく組み合わせたプロジェクトチームがほとんどで、その結果もたいていは良いものでした。しかし、デザイン・開発プロセスが複雑になり、特化したコラボレーションツールをめぐる論争はさらに激しくなっています。 では、現在利用可能な「完璧な」デザインコラボレーションプロセスとはどのようなものでしょうか。その定義は少し厄介かもしれませんが、最近デザインコラボレーションツール界の有望な選手を見つけたので、紹介しましょう。 デザインコラボレーションツールを選ぶ上で、好みの問題は大切な要素ですが、結局は誰にとっ
【VWOプレミアムパートナー】世界4500社導入ヒートマップ付A/Bテストツール (VWO) | Visual Website Optimizer
「これは便利だ！」と驚きの声が上がる操作感。 マウスだけでA/Bテストが作成できる VWOの紹介動画をご覧ください。 ※音声あり。ご注意下さい。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
