Web制作者が備えておきたい最新版チートシートのまとめ

あれはどうだったかな? という時にすぐ分かる、Web制作の実装や勉強に役立つチートシートを紹介します。

iPhone 8やXsのスクリーンサイズはいくつだったかな? CSS FlexboxやGridの挙動がまとめて知りたい、CSSのプロパティの値や対応ブラウザは? Vue.js, React.jsのよく使用するイベントや構文、ブラウザごとのバグやハックはあるのか、がまとめられています。

Web制作者が備えておきたい最新版チートシートのまとめ

チートシートはPDFや画像をダウンロードしておいたり、ブックマークして、すぐに確認できるようにしておくと便利ですね。

チートシートのキャプチャ

Adaptivity and Layout -iOS Human Interface Guidelines

iOSのApple公式のガイドラインです。iPhone, iPadなどのUIのスペックを調べるにはココが一番です。

チートシートのキャプチャ

iOS Design Guidelines

iOSの制作者向けの情報が分かりやすくまとめられたガイドライン。

チートシートのキャプチャ

Popular Screen Resolutions: Designing for All

Apple, Androidの主要なデバイスの解像度がまとめられています。

チートシートのキャプチャ

HTML Cheat Sheet

HTMLのタグと実装のコードがまとめられたチートシート。PDF版もダウンロードできますが、オンライン版は楽しいデザインになっています。

チートシートのキャプチャ

CSS Flexbox の各プロパティの使い方を詳しく解説

Flexboxで使用する各プロパティがどのように機能するのか、レイアウトにどのように影響を与えるか視覚的に解説したリファレンス。

チートシートのキャプチャ

CSS Flexbox Cheatsheet
CSS Grid Cheatsheet

CSS FlexboxとGridの各プロパティがどのようにレイアウトされるかコンパクトにまとめられたチートシート。

チートシートのキャプチャ

CSS Alignment Cheatsheet
解説: CSS GridやFlexboxでコンテナ内の要素を揃えるテクニックのまとめ

揃える際に、最適な方法が分かるチートシート。最近主流になっているCSSの整列テクニックは、これまでのものとはまったく異なります。

チートシートのキャプチャ

CSS Reference

CSSのプロパティなど、使い方が分からない時に便利なリファレンス。

チートシートのキャプチャ

Sass Cheat Sheet

チートシートのキャプチャ

SASS::Script Cheat Sheet

チートシートのキャプチャ

Vue.js Cheat Sheet

Vue.jsのよく使用するイベントや構文、メソッド、プロパティがまとめられたチートシート。

チートシートのキャプチャ

Vue.js Handbook
解説: Vue.js Cheat Sheet

Vue.jsの導入から、実装まで、122ページにわたり、詳しく解説されたハンドブック。

チートシートのキャプチャ

Vue.js Complete API Cheat Sheet

チートシートのキャプチャ

Vuex Cheat Sheet

チートシートのキャプチャ

React Cheatsheet

チートシートのキャプチャ

ES6 Cheatsheet

チートシートのキャプチャ

Asynchronous JavaScript cheatsheet

チートシートのキャプチャ

JavaScript Regex Cheatsheet

チートシートのキャプチャ

gulp.js cheatsheet

チートシートのキャプチャ

Browserhacks

各ブラウザ用のCSS Hackがまとめられています。

チートシートのキャプチャ

Browser Bug Searcher

ブラウザごとのバグがまとめられており、解決方法があるもの、お手上げなもの、が分かります。

チートシートのキャプチャ

Chrome DevTools のキーボード ショートカット

チートシートのキャプチャ

GitHub Cheat Sheet

チートシートのキャプチャ

Visual Studio Code Cheat Sheet

チートシートのキャプチャ

Font Awesome Cheatsheet

PDF版も画像版も縦長で同じです、Font Awesomeの膨大なアイコンを一覧できます。

sponsors

top of page

©2018 coliss