プログラムメモ
Category
React
TypeScript
PHPプログラムメモ
PHPフレームワークLaravel
Stripe / Laravel Cashier
PHPフレームワークCodeIgniter
JavaScript
jQuery
node.js
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
Ionic / Angular フロントエンド
postgreSQL
gulp(タスク自動化ツール)
デザイン関連(Photoshop・Illustrator)
Figma / Adobe XD / Sketch
Mac OSX用 VST AU RTAS プラグイン
フリー素材(写真、アイコン、フォント)
iPhone / iPad
WEBサービス / API
SQLite
エディタ・WEB開発環境 /VS Code / Sublime Text
Flash / ActionScript
PHP Zend Framework
Windows WEB開発(ASP.NET Core / C#)
Visual Studio for Mac (Xamarin.Mac)
WEBアクセシビリティ / Google Lighthouse / W3C Markup Validation
クラウド/VPS/レンタルサーバ/専用サーバ
リッチテキストエディタ / TinyMCE / Summer note
git
最近のメモ
CSSだけのUI フレームワーク daisyui
nestjs graphql のテストを書く
aws CDK
AWS をコマンドから操作する AWS CLI
EC2 のやりがちな Elastic IP address not attached による請求に対応する
Google Chromeでローカルにあるcssファイルを直接編集し保存する
graphql-codegen を使って、フックを自動生成し tanstack query + graphql クエリを実行する
zustand
WebStorm で graphql のクエリでエラーが出る場合の対応
schema.prisma から graphql の コード を自動生成する便利なジェネレータ prisma-nestjs-graphql
gitignore を globalで設置する
Prisma で 1対1( One to One ) 1対多( One to Many )リレーションの定義
サーバのポート状態を外部から検索(確認)する(ポートスキャンコマンド)
tanstack query ( react query ) の使い方
Next.js で emotion
next.js で .envにtypescript 型定義をつける
Next.js で 環境ごとに 設定ファイル(.env.development , .env.production)をわける
AWS CLI を aws-vault を使って安全に使用する
Prisma で 多対多( Many to Many )リレーションの定義
apollo client で graphqlからの query の戻り値に型をつける
jest のMultiple configurations found エラーの対応
unixのシェル( bash )の便利な設定(1文字ショートカットとヒストリ)。gitブランチ表示
graphqlリクエストが「This operation has been blocked as a potential Cross-Site Request Forgery (CSRF).」になる現象の対策
NestJS + Prisma
npm script で ブラウザを開く
検索
React
トップに戻る
新規投稿
tags
TypeScript
[1]
next.js
[1]
フロントエンド開発といえば。
react アプリの初期化( npm init vite@latest <アプリ名> )
クイックリンク
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 , 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 の if文、for文、console.log in JSX
jest
Next.js で クライアントサイドfetch を サーバーサイドへ移す
Next.js で ホットリロードが聞かない時の変更箇所
Reactで各種lint ( eslint , stylelint , husky + lint-staged )
環境変数を dotenv-cli で変更する
mui
frourio
React Hook Form ( + Yup + schema-to-yup )で バリデーションの設定をjsonで書いてフォームを作成する
Reactで有用なデコレーター
Recoil
Next.jsで作成したサイト に sitemap.xml を追加する
React で スマホ / pc 判別
React で イベント実行関数(メソッド)に引数を渡す。間違えて渡す。
React で DOM オブジェクトを取得する
Next.js で メソッドからページ移動する
React のステート管理「Redux」のミニマルな形
React で Firebase の Google Auth
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 を動作させる
CSSだけのUI フレームワーク daisyui
https://daisyui.com/
No.2355
05/25 16:50
edit
edit
delete