BLOG
-
Next.js14でMSWを使う
Next.js14のCSRでMSWを使ってみました。結論としては Chrome では使えたのですが、Safari では使えませんでした。 APIレスポンスをモックできるMSW（Mock Service Worker）ですが、Next.jsとは相性がよくないことで知られています。 https://github.com/ms... -
Reactで親子関係のあるセレクトボックスを filter, map を使ってシンプルに作る。
はじめに 管理画面とかで親子関係のあるセレクトボックスを実装しなくてはいけないこと、ありますよね？そう。１つ目のセレクトボックスを選択したら、２つ目のセレクトボックスの中身が変わる、アレです。 今回はReactで親子関係のあるセレクトボックスUI... -
プロプラ！を持続可能なコンテンツにするために
こんにちは。はこだてたろうです。GWも最終日となりました。東京は昨日と打って変わって曇り空です。 さて、プラプラ！シリーズへのモチベーションがふつふつと湧いてきています。とはいえ、あんまり気合いを入れてやりすぎるとまた続かなくなってしまいま... -
自分らしく力を発揮できたら、嬉しいし楽しいよね
こんにちは。迷走がとまらない、はこだてたろうです。 前回、私にとって水を入れたペットボトルを持ち上げる程度の行動、つまりは物事を続けていくためのスモールステップとなる行動はなんだろう？という投稿をしました。DailyUIに挑戦したもののあまり楽... -
水を入れたペットボトルを持ち上げたい
こんにちは。はこだてたろうです。「久しぶりに何か作りたいな」と漠然と考えています。とはいっても、誰かの〇〇な悩みを解決したいだとかそんなビジョンはまだないのですが。 今はお休み中ですが、連載「プロプラ！」では「できるを増やせばやりたいが見... -
DailyUI#003 まだまだ技量が足りないと感じた３日目。タイル状？なレイアウトをトリビュート。
こんにちは。はこだてたろうです。DailyUIチャレンジ３日目にして、早速１日空けてしまいました。１日２時間弱をコンスタントに確保するのにはやはり無理がありました(^_^; 最近のブームというと少し軽く聞こえてしまうかもしれませんが、最近は書籍「世界... -
DailyUI#002 背景の切り抜きをしたかったが断念。グラデーションが素敵なクレカ決済画面をトリビュート
こんにちは。はこだてたろうです。今日の東京は暑かったです。夏日になるところもあったのだとか。私は寒暖差にあまりやられないタイプですが、苦手な方はどうぞお体にお気をつけください。 #002 Credit Card Checkout DailyUIチャレンジ２日目は、クレジ... -
DailyUI#001 Next.jsのImageコンポーネントで画面いっぱいに画像表示。MUIコンポーネントのカスタマイズ。イラスト背景にモーダルライクな入力欄が素敵なデザインをトリビュート
こんにちは。ハコラトリ管理人のはこだてたろうです。ハコラトリでは、React初心者向けの技術記事「プロプラ！」シリーズを不定期で連載していましたが、この度色々と思うところがあり、連載を一時停止させていただきますm(_ _)m DailyUIチャレンジ、はじ... -
#3 React.js でプロプラ！Vol.2「Border 7」：コンポーネントの実装1
前回は、コンポーネントのインポートとエクスポート、レンダーについて学びました。そして、App.tsx の実装も行いました。 https://hakoratory.com/propla/border7/import-and-render/ 今回は、テキストやトランプのカードを画面に表示するためのコンポー... -
#2 React.js でプロプラ！Vol.2「Border 7」：コンポーネントのインポートとエクスポート、レンダー
第２回 コンポーネントのインポートとエクスポート、レンダー 前回は、Border7アプリケーションとプログラムの概要についてお話ししました。 https://hakoratory.com/propla/border7/overview/ 今回から、いよいよ実際にBorder7アプリケーションの開発を...
