どんぐり

Excel

VLOOKUP関数と同じ動きをVBAで処理して複数該当の値を取得する【Excel/VBA】

ExcelといえばVLOOKUP!っていうくらいこの関数をよく使います。というか関数はVLOOKUPとSUMくらいしかまともに使えません、、。勉強しなきゃ、、 今回は、VLOOKUP関数ではなくVBAで複数該当の値を取得したので、コ...
JavaScript

Reactでグローバルな状態を管理する【Context/useContext】

グローバルな状態管理の方法は複数ありますが、Reactに標準で実装されてるReactHooksのContextとuseContextの使い方をまとめたのでメモ。 グローバルな状態管理とは コンポーネント間で値を渡すにはProp...
css

要素を上下左右中央に配置してフッターを下に固定する【CSS】

要素を上下左右中央に配置して、コンテンツ量が少ない時もフッターを画面の下に固定したい!ってことはよくあります。方法は色々ありますが、最近よく使っている手法をメモ。 実装したいレイアウトを確認する 実装したいレイアウトはこち...
スポンサーリンク
JavaScript

Reactのパフォーマンスを最適化する方法を調べました【React.memo/React.useCallback/React.useMemo】

Reactはコンポーネントを組み合わせて作っていきます。日頃あまり意識することはありませんが、一部に負荷の高いコンポーネントがあると、レンダリングの最適化を考える必要があります。Reactのレンダリングの仕組みと、パフォーマンスの最適化に...
JavaScript

useRefで値を更新したりDOMを参照する方法【React/useRef/useState/useEffect/TypeScript】

useRefは、主にDOMを参照したい時に使用しますが、改めて使い方を調べたのでメモしておきます! useRefとは useRefは、useStateと同じく値を保持できるフックです。useStateとの主な違いは、値を更新し...
css

gridレイアウトについて調べました【CSS/grid-template/auto-fit/auto-fill】

最近CSSのgridを使う機会がありました。最低限の仕組みを知っておく必要があると思い、基本的な並べ方を実装する方法をまとめました。 gridの基本的な使い方 gridは要素の表示形式を設定するdisplayプロパティの値にな...
WordPress

WordPressで記事一覧を固定ページに表示する【ショートコード/ページネーション】

WordPressで、記事一覧を特定の場所に表示したい!ってことがあると思います。そんな時に使えそうなショートコードを作成したのでメモ。 ページネーション付きで表示できるので、デフォルトで出力されるカテゴリーのURLを変えたい!...
WordPress

WordPressテーマCocoonでカスタム投稿タイプとカスタム分類を作成して一覧を表示させる【WordPress/PHP】

カスタム投稿タイプやカスタム分類を追加する際、今までプラグインを使っていましたが、コードで実装しました。将来の自分がコピペできるようにメモしておきます。 なお、使用しているテーマは無料で使えるCocoonというテーマです。テーマの機...
JavaScript

getRangeメソッドでセルの範囲を取得する【GAS/JavaScript】

Google Apps Script(GAS)は、Googleが提供しているプログラミング言語です。自分は主にGoogleスプレッドシートを操作する為に使いますが、GmailやGoogleカレンダー、Googleフォームなど、Google...
WordPress

Cocoonのヘッダーメニューをおしゃれにカスタマイズする【WordPress/Cocoon/PHP/Google Fonts】

WordPressのテーマ「Cocoon」。高機能なのに無料で使えるありがたいテーマです。今回、ヘッダーメニューをカスタマイズしたのでメモ。頑張ってオシャレにしました。 カスタマイズ内容 カスタマイズしたメニューはこんな感じに...
Linux

PHPのバージョンをアップする手順をまとめました【WordPress/さくらVPS/CentOS7】

WordPressのサイトヘルスで、PHPのバージョンアップをすすめられました。さくらのVPSを使っているので、バージョンアップは毎回手動で作業しています、、。毎回調べながらやっているので、今後の為に手順をメモしておきます。 Wor...
WordPress

WordPressのお引っ越し(データ移行)する手順をまとめました【ワードプレス/プラグイン】

WordPressのお引っ越し(データ移行)の方法を調べてまとめました。 今回試したのは、プラグインを使用して、かつ無料でお引っ越しできる方法です。プラグインでうまく移行できない場合、最終的には手動でやることになると思います、、。 ...
JavaScript

Reactの開発環境をコマンドで構築する方法【JavaScript/TypeScript】

開発環境の構築方法は忘れやすいのでメモするようにしています。今回はReactの開発環境について調べたのでメモ。 Reactの環境構築はコマンド1つで完了動して、以下コマンドを実 結論から言うと、プロジェクトを作成するディレクト...
JavaScript

Reactでページ遷移する方法を調べました【React/React Router/react-router-dom/v5】

Reactでページ遷移する方法を調べました。忘れそうなのでメモしておきます。TypeScriptで記述していますが、設定の方法は普通のJavaScriptとあまり変わらないと思います。 react-router-domとは R...
JavaScript

useStateを理解するためにサンプルを作って確認しました【React/useState】

ReactのuseStateがいまいち理解できなかったので、サンプルをいくつか作成して動きを確認しました。主にリアルタイムの動きに使えそうです。 useStateとは Reactにはコンポーネントに状態を保管、更新できるuse...
JavaScript

論理演算子「論理積(&&)」と「論理和(||)」「論理否定(!)」「Null 合体演算子(??)」について調べました【JavaScript】

JavaScriptの論理演算子について、分かっているようで分からなかったのでメモ。 論理演算子とは そもそも論理演算子とはなんぞや?ですが、主にif文で使います。下記のように「&&」「||」「!」を使って条件...
JavaScript

プラグインを使わずにTODOリストを作成しました【JavaScript】

JavaScriptの練習でTODOリストを作成しました。一応形になったので、作り方をメモしておきます。 TODOリストのサンプル こちらがサンプルです。完了したタスクはTODOリストから「完了」の領域に移動します。また、一度...
JavaScript

reduceを使って文字をアニメーションさせる方法【Javascript】

今回、javascriptのreduceについてまとめたのでメモ。reduceを使って文字のアニメーションを実装するサンプルも作成しました。 reduceはどんなことができるか reduceは配列の値を順番に処理するメソッ...
css

プラグインを使わずにモーダルウィンドウを作成しました【JavaScript/CSS】

JavaScriptの練習で簡単なモーダルウィンドウを作成しました。表示する要素にテキストや画像を指定できますが動画には対応しておりません、、。プラグインを使うほどではない時の実装に使えそうなのでメモ。 完成したモーダルウィンドウを...
css

プラグインを使わずにLightbox(ライトボックス)風ギャラリーを作りました【JavaScript】

Javascriptの練習でライトボックス風のギャラリーを作成しました。スマホでスワイプできると思いますが、Androidでは確認しておりません。。プラグインを使うほどではない!CDNを読み込みたくない!jQueryを使いたくない!場...