コーディング

コーディング方法

さっと使えるSCSS(SASS)のチートシート集

extendやmixinなどよく忘れるSCSSの書き方をシンプルにまとめたチートシートを集めました。ブラウザでチェックできるものとPDFでダウンロードできるものがあるので必要に応じて使い分けること…

2022 / 05 / 26

CSS、Flexbox、Gridのチートシート集

CSS3のプロパティやBEM記法、Flexbox、Gridなどを網羅したチートシート集です。 CSSは新しいプロパティが追加されてもすぐにブラウザ対応するのが1年後とかだったりするのでほとんど勉強し…

2022 / 05 / 24

あれなんだっけ？を解決するjQueryのチートシート

たまにjQueryを使うことがあって「あれってどうやるんだっけ？」ってなったときのためのjQueryチートシート集です。よくあるのがWordpressでjQueryを使うときに $ じゃなくて j…

2022 / 05 / 21

爆速でコーディングできるEmmetのチートシート

HTMLやCSSのコーディングスピードをもっと上げたい！という人のためのEmmetを使いこなせるチートシートを集めてみました。ブラウザでチェックしたりPDFでダウンロードすることもできるのでHTM…

2022 / 05 / 17

HTML、CSSファイルの正しい開き方

HTMLファイルとCSSファイルの開き方を簡単に解説します。 HTMLファイルやCSSファイルを開くためには専用のソフトウェアが必要です。一応メモ帳でも開くことができるのですが、文字化けする可能性が…

2022 / 05 / 01

CSSでログインフォームをつくってみる

CSSでログイン画面で使われるフォームのスタイルを弄ったことが少ないのでやってみました。デザインを変えたいと思いながらも、デフォルトのまま使ってしまうことが多いコメントフォームなどのフォームのデザイ…

2022 / 04 / 29

[2020最新] カラーミーテンプレートでできること、機能まとめ

カラーミーショップはテンプレートを自由にカスタマイズするのですが、これからカラーミーショップをはじめる人にとってはどんな機能があるのかわかりにくく、カスタマイズのハードルが高いかもしれません。 …

2020 / 08 / 25

【2020最新】カラーミーショップ初心者のためのテンプレートカスタマイズ入門

カラーミーショップのテンプレートはBASEやWordpressとも異なり、使用しているタグの書き方も独特なので慣れるまでのハードルがちょっと高めです。このページでは、これからカラーミーショップのテ…

2020 / 08 / 25

2022年最新版 VSCodeのおすすめ拡張機能まとめ

VSCodeもっと活用したいVSCode使いのためのちょっと便利なものから最強レベルまでインストールして損しない拡張機能を集めてみました。 VSCodeには7000以上の拡張機能が登録されていて、テ…

2020 / 03 / 24

カラーミーショップのフリーページにお気に入りや売れ筋商品一覧を表示する

カラーミーショップには9999個も作れるフリーページ機能があります。HTMLを書くこともできるので、お気に入り一覧や新着商品一覧、特定商品のLPなど、基本的にはなんでも表示させることができる便利なペ…

2019 / 04 / 15

BootstrapのClassやコードをまとめたチートシートまとめ

Bootstrap4とBootstrap5のコンポーネントやClassをすべて網羅したチートシート集です。 Bootstrapはグリッドレイアウトや数多くのコンポーネントなどすごく便利なんですが、量…

2018 / 10 / 25

Bootstrap4のテーマやサイトを作れるテーマビルダー4選

Bootstrap4のテーマを作れるテーマビルダー、Webサイトビルダーまとめ。 Bootstrap4のリソースはたくさんありますが、中でもビルダー系ツールが豊富なのがいいところ。ビルダーを使えば画…

2018 / 10 / 24

Bootstrap4向けの高品質な無料テンプレート300以上

Bootstrap4の無料テンプレート300本+αまとめ。 Bootstrap4の無料テンプレートを配布しているサイトを集めてみました。無料といってもレイアウトやデザインなどどれも高品質なものばかり…

2018 / 10 / 23

Bootstrap4 Scrollspyの使い方とカスタマイズサンプル

Bootstrap4のScrolspy（スクロールスパイ）コンポーネントの使い方を解説。聞きなれない名前ですが、スクロールスパイは画面のスクロールを監視してナビゲションのスタイルを変更できるもので…

2018 / 10 / 18

Bootstrap4 Navbarの使い方とカスタマイズサンプル

Bootstrap4のNavbar（ナビゲーションバー）コンポーネントの使い方を解説。 Webサイトのヘッダーとしてよく使われるNavbarコンポーネント。レスポンシブに対応しており、スマホではドロ…

2018 / 10 / 17

Bootstrap4 Modalの使い方とカスタマイズサンプル

Bootstrap4のModal（モーダルウィンドウ）コンポーネントの使い方を解説。画面の手前にポップアップを表示して、フォームの入力やボタンのクリックを促したりといった使い方ができます。このペ…

2018 / 10 / 16

Bootstrap4 Dropdown（ドロップダウン）の使い方とカスタマイズサンプル

Bootstrap4のDropdown（ドロップダウン）コンポーネントの使い方を解説。 Bootstrap4のドロップダウンは単純なリストメニューの他に、フォームやグリッドレイアウトのコンテンツを入…

2018 / 10 / 15

Bootstrap4 Collapse（アコーディオン）の使い方とサンプルコード

Bootstrap4のCollapse（アコーディオン）コンポーネントの使い方を解説。 Web上ではFAQなんかによく使われるCollapseコンポーネントですが、アコーディオンパネル以外にも、サイ…

2018 / 10 / 14

Bootstrap4 Carousel（カルーセル）の使い方とカスタマイズサンプル

Bootstrap4のCarousel（カルーセル）コンポーネントの使い方を解説。画像やコンテンツのスライドショーとして使えるカルーセルを使えば、jQueryプラグインを追加しなくても良いのでペー…

2018 / 10 / 13