フロントエンド– tag –

Reactで状態を扱う場面では、useStateやuseEffectの他に、再描画を伴わずに値を保持したいケースがあります。そのようなときに使われるのが、useRefです。 今回は、あるシステムで見られた「constで定義したuseRefに対して値を代入してもエラーにならない...

CSVファイルの文字コードは環境によって異なり、特に日本国内ではShift-JISが一般的に使用されます。しかし、WebアプリケーションやAPIの多くはUTF-8を前提としているため、文字コードの変換が必要になります。本記事では、ReactでShift-JISのCSVを読み取...

Reactを使ったWebサイトの開発中、ブラウザの翻訳機能を使用した場合に、以下のようなエラーが出力されることがあります。 [crayon-6873648a94e98516819209/] この問題は、ブラウザの翻訳機能が原因でReactが管理するDOMと実際のDOMに不一致が生じることで...

ReactとMUI（Material-UI）を活用して、ここではユーザーを選択するセレクトボックスを実装する際に直面する課題と、その解決方法を解説します。特に、編集モードで前回選択したユーザーを初期値として表示しつつ、すべてのユーザーを一覧に含める方法を具...

テーブル内のデータを簡単にソートする機能は、ユーザーエクスペリエンスの向上に大きく貢献します。この記事では、ReactとMaterial-UIを使用して、テーブル内の任意のカラムをクリックして昇順・降順でソートする方法を紹介します。 必要なもの Node.jsと...

ウェブデザインにおいて、コンテンツの配置は見た目と使いやすさに大きな影響を与えます。今回は、画面の左下に追従するブロックを作成する手法を紹介します。このスタイリッシュなデザインは、ブログやウェブサイトのアクセントとして素晴らしいものにな...

今回で「Ubuntuで自宅サーバーを構築」連載の最後を飾る、Zabbixサーバー6.0を構築していきます。せっかくZabbix公式の認定資格まで取ったので、公式の手順に則って丁寧に解説していきます！ Zabbixのインストール要件 公式サイトに掲載されているZabbixを...

CSSのみで実現する背景グラデーションは既に世の中に知れ渡っていて作成ツールまでありますが、その色を次々と変化させることもできます。CSS詳しい方なら想像できると思いますが、グラデーションにアニメーションをミックスします。 背景グラデーションと...

あまりない状況かもしれませんが、画面の縦と横の比率（アスペクト比）を変えずに、拡大・縮小したいことがありました。よく考えてみると、画像の幅を100%で表示すると似たような動きになりますよね？しかし、画像だけではなく、コンテンツ領域全体のアス...

どこかの技術系サイトのソースを利用したい場合、当然エディタにコピペしてから編集していますが、WEBサイト上に掲載されているコンテンツをその場で書き換えることができるのが、HTML5のcontentEditable属性です。もちろん表面上の話で、データそのものを...