プログラムメモ
Category
React
AI
TypeScript
PHPプログラムメモ
PHPフレームワークLaravel
Stripe / Laravel Cashier
JavaScript
jQuery
Node.js / Bun / pnpm / npm
WEB制作（html, css)
cssスタイルシート
Tailwind CSS
Bootstrap
サーバ構築・管理
Mac / Linux / FreeBSD シェルコマンドメモ
KUSANAGI
Pleskサーバ管理
Amazon AWS クラウド
Mac OSX おすすめフリーソフト
Karabiner-Elements
Auto Hot Key
MySQL
SQL Server（MS-SQL）
React
Vue3
Next.js
Vue.js
postgreSQL
Go
gulp(タスク自動化ツール)
デザイン関連（Photoshop・Illustrator）
Figma / Adobe XD / Sketch
フリー素材（写真、アイコン、フォント）
iPhone / iPad
WEBサービス / API
SQLite
エディタ・WEB開発環境 / Cursor / Web Storm / VS Code
Windows WEB開発（ASP.NET Core / C#）
WEBアクセシビリティ / Google Lighthouse / W3C Markup Validation
クラウド/VPS/レンタルサーバ/専用サーバ
リッチテキストエディタ / TinyMCE / Summer note
git
PHPフレームワークCodeIgniter
最近のメモ
nextjs / vite でも使用されている Node.js向けの軽量で美しいユーザーインターフェースのプロンプトライブラリ
biome , oxlint
Playwright パラレル
Claude Code のはじめ方
npm パッケージのアップグレードを楽にする ncu コマンド
typescript の widening と「const と readonly と as const satisfies」の違い
as const satisfies の使い所
Typescript の ユーティリティータイプ
Claude Code 便利集
ブラウザのリフレッシュレート
MacのコマンドラインでPNG画像を圧縮する方法8選
git log をカラフルにする git plog
pnpm をインストールする
macで markdownファイルを見やすくする
Laravel で 実際にデータベースを見に行った上でTypeScriptの型を生成するパッケージ
cssグリットで要素を上下左右中央にセンタリング表示
KUSANAGI9 の 初期設定とドメイン作成（プロビジョン）方法
laravelで データベースのIDの開始を1001からにしたい
next.js standalone
Laravel (PHP) で Redis を使用する
KUSANAGI に redis を入れる
KUSANAGI に nextjs アプリをデプロイする
git-worktree-runner
LaravelのモデルにDBに存在しない独自のカラム（プロパティ）を追加する
laravel-ide-helper を使用してVS CodeやPhpStormでコード補完させる
検索
React
トップに戻る
新規投稿
tags
TypeScript
[1]
next.js
[1]
フロントエンド開発といえば。
react アプリの初期化( npm init vite@latest ＜アプリ名＞ )
クイックリンク
nextjs / vite でも使用されている Node.js向けの軽量で美しいユーザーインターフェースのプロンプトライブラリ
biome , oxlint
Playwright パラレル
Tailwind css を依存に関係にもたないUIコンポーネント
RTK Query の infiniteQuery
React19 における React.ReactElement と React.JSX.Element の違い
npm install を 30 〜 50% 高速化する? 。flash-install
react i18n の break
Redux使うなら知っておいてほしい selector とは
RTK Query での効率的な初期データ管理とレンダリング最適化
reactでvideo.js
Redux の 作り方
Emotion から goober へ乗り換える
fetch と axios のざっくりとした違い
ts-auto-guardの使い方
webアプリ開発時のCORS対応に必ず登場する HAR の使い方
Goのvs code でのデバッグ方法
eslint で 現在の設定値を確認する
RTK Query
react で svg を import して扱う
husky+lint-staged からの引っ越し先 → lefthook
npm init vite@latest で 作成したreactアプリで purgecss したい
React hooksの概要 useContext による Provider
アプリが bun で 動いているのか node.js で動いているのかを判別する
react で i18n
Redux のフック
react + typescript で GoogleMap
React Hook Form で Input argument is not an HTMLInputElement エラーが出る場合
zodで最大文字数チェックの時に「現在 xx文字です」を表示させる
jest実行時に @/ のパスを解決する
zodで userName の値が正しい場合に、ユニークであるかをさらに検証する
Cypressより早いE2Eテストフレームワーク Playwright
jest で 描画されたコンポーネントをブラウザで確認する jest-preview
Drizzle ORM 次世代 データベース O/R マッパー
React で Signals を 軽量グローバルストアとして使用する
scaffdog
初期化変数の変更に追従する useState → useSyncedState
ビューポートの高さと特定の要素のビューポート上端からの相対的なY座標の両方を返すカスタムフックを作成する
マウント時には実行しない useUpdateEffect
shadcn コンポーネントを使用する
コンポーネント開発速度を加速させるStorybookをReact に 追加する
Reactなのに EventEmitter 使うパターン
React の jest で x秒待つ
mswでreactアプリのモック
style-dictionary の設定
ジェネレーター（自動生成）好きにぴったりのパッケージ hygen
new hooks in React 18
再レンダリングデバッグの時に有用なコンポーネント
zod の string または null または undefined 、 「number または NaN」定義
React Hook Form で使用できるコンポーネントを作成する
CSSだけのUI フレームワーク daisyui
graphql-codegen を使って、フックを自動生成し tanstack query + graphql クエリを実行する
React Hook Form + zod
react , graphql の Colocated Fragments
apollo client で graphqlからの query の戻り値に型をつける
React18 並列レンダリング Concurrent Rendering(Suspense) のまとめ
vite-plugin-pwa を使って PWA 対応する
react で scss(sass) を使用する
Vite で react-app を初期化した後の eslint@8 , prettier インストール方法
フロントエンド側で画像圧縮する
Amazon S3 へ 署名付きURLを使ってブラウザのみでファイルアップロードする
tanstack query ( react query ) の使い方
firestore で 各ユーザー配下のサブコレクション を横断して検索する
typescript の jest を swc で高速化する
React Suspenseのシンプルな形
MUI の 複数行TextField 入力時に 「Command ( Control )」＋「Enter」のショートカットキーでフォーム送信をする
Firestoreで createdAt , upcatedAt を追加する
Firestoreのデータ作成方法 (addDoc , setDoc)
Firestoreのデータ取得方法まとめ
react や nextjs アプリを vscode .devcontainer（Docker） に対応にする
Remix
dayjs (day.js) + typescript で 日付を扱う
react で テストを jest or vitest で比較してみる
live templates for react
How to use async and await inside a React fc?
ReactNode や ReactChild の別の型との関係性
MUI Autocomplete サンプル
Nextjs , TypeORM , MySQL
React jsx の if文、for文、console.log in JSX
jest
Next.js で クライアントサイドfetch を サーバーサイドへ移す ( pages router / SSR )
Next.js で ホットリロードが聞かない時の変更箇所
Reactで各種lint ( eslint , stylelint , husky + lint-staged )
環境変数を dotenv-cli で変更する
mui
React Hook Form ( + Yup + schema-to-yup )で バリデーションの設定をjsonで書いてフォームを作成する
Reactで有用なデコレーター
Recoil
Next.jsで作成したサイト に sitemap.xml を追加する
react で スマホ / pc を判別する react-device-detect
React で イベント実行関数（メソッド）に引数を渡す。間違えて渡す。
React で DOM オブジェクトを取得する
Next.js ( pages router ) で メソッドからページ移動する
React のステート管理「Redux」のミニマルな形
react で styled-components を使用する
useReducer を理解しやすくする
Next.js で 静的サイトとしてエクスポートする（next export）
React で ページの先頭へスムーススクロール
react swiper を使用する
Next.js で 独自の 404エラーページを作成する
Next.js サイトに読み込みローディングバー（プログレスバー）を表示させる
Next.js で scss (sass) を使用する（サイト全体css / ページ単位css）
react-datepicker を使用する
JSONからTypeScriptの type を作成する
MUIを使用する
React のグリッド、データテーブル
React Bootstrap を TypeScript で使用する
Next.js での SEO施策
react-router の useRoutes() フックを使うミニマルな形 (TypeScript)
Reactの関数コンポーネントで親コンポーネントから子コンポーネントの関数を実行する
Next.js の ビルド先ディレクトリ「.next」を変更する / ビルド先ディレクトリをシェルから変更する
Next.js を nginx にデプロイする
Next.js で 任意のdivの高さを 100% にする （ height:100% ）
Next.js で GraphQL クライアント Apolloクライアントを使用する
ReactのJSX内で string の style を扱う
Next.js で YAMLファイルを使用する
VS Code の「F5」キーで Next.js のデバッグを行う
Next.js で import の相対パスのルートディレクトリを変更（固定）してルートからの絶対パスで記述する
React Hook Formでフォームを作成する ( + Yup )
React で登場する ... （3点リーダー）（ドット3つ）の使い方
Next.jsで改行コードを改行タグに変換（nl2br）する
Next.js で日付をフォーマットする
Next.js で font awesomeなどのアイコンフォントを使用する
Next.js で Axios , fetcher の非同期通信を便利にする SWR を使用する
React に Tailwind CSS を導入する
React hooksの概要 / useState / useEffect / useContext / useReducer / useMemo / useCallback / useRef
Next.js + Firebase で Googleログインのテスト
プロセスマネージャー pm2で next.js を動作させる
nextjs / vite でも使用されている Node.js向けの軽量で美しいユーザーインターフェースのプロンプトライブラリ
● terkelg/prompts
https://github.com/terkelg/prompts
No.2703
01/06 14:06
edit
edit
delete