「nth-childとnth-of-typeの違いをわからず使ってしまっている」「ブログやYoutube動画を見ていて、発信者によってnth-childとnth-of-typeを使っている人がバラバラだから違いが余計わか […]
Tips
React Emailを使ってメールのひな型(テンプレート)を作る方法
React Emailは、メールの作成を簡単かつ効率的に行うためのReactのライブラリです。 WebサイトやWebアプリで自動送信メールをつくるときにテキストのみの無機質な文面よりは、LPのようなスタイルでユーザーの興 […]
JavaScriptで連想配列、入れ子オブジェクトのコピーの注意点【複製してもコピー元は変わらないようにしたい場合】
JavaScriptにおいて連想配列や入れ子オブジェクトのコピーは、注意が必要な点があります。 一番簡単な方法は新しく変数を作ってコピーしたいものを代入するだけです。 しかしコピーを作成しても元のオブジェクトが変更されな […]
CSSの単位の使い分け!文字(フォント)やサイズによく使うものを紹介【rem,em,px,vw,vh,%】
「CSSの単位でいろいろありすぎて混乱している」「コーディングでレスポンシブがよくレイアウト崩れを起こして苦手意識を持っている」「模写コーディングでpxとremをよく見かけるけど使い分けがピンとこない」 本日はそんな方に […]
スクロールするとヘッダーの背景が変わるアニメーションの作り方【InterSectionObserver,observe】
近年のWeb制作ではいろんなアニメーションが求められるようになっていています。 その中でもスクロールと連動したアニメーションは頻繁に登場するアニメーションですが、あまりナレッジがブログ記事やYoutube動画などで無い印 […]
Reactのカスタムフックとは?作り方や使い方を初心者向けに解説
「Reactを勉強し始めたけど全体の仕組みがイマイチわかっていない」「フックと言われても何のことか理解できずに学習を進めている」「カスタムフックについてはスクールや学習教材では習わないから困っている」 本日はそんな方に向 […]
なぜか効かない?ReactにおけるCSSの書き方の基本!module.cssが適用されない問題も解説
「普通にCSSを書いているのに何故かスタイルが適用されないことがある」「Reactって結局CSSをどのファイルに書くべきなのかがピンときていない」「〇〇.cssと〇〇.module.cssって何が違うのかわからない」 本 […]
モーダル(ポップアップ)が作れるdialogタグとは?【showModal,close,clientX,clientY,backdrop,getBoundingClientRect】
「モーダルやポップアップをサクッと作ることができない」「JavaScriptは簡単なメソッドかライブラリしか使ったことがない」「モーダルやポップアップを要素外をクリックしたときにも閉じれるようにしたい」 本日はそんな方に […]
react-draft-wysiwygを使ったエディタの作り方とカスタマイズの方法
Reactでリッチテキストエディタを実装する場合、react-draft-wysiwygという便利なライブラリがあります。 react-draft-wysiwygはDraft.jsというライブラリをベースに作られていてテ […]
JavaScriptのbindとは?使い方や用途、thisの意味を解説します
「”thisが〇〇だから▲▲”みたいな話が出てくるけど何を言っているのかわからない」「JavaScriptの学習でbindが登場するけど使うタイミングがよくわからない」「addEventListenerなどのイベント時の […]