Reactにおけるコンポーネントの基本原則の解説と、初心者に役立つReactコンポーネントライブラリの紹介を提供します
今回は、JavaScriptのテストフレームワークとコンポーネントをテストするためのReactユーティリティの組み合わせとして人気の高い、JestとReact Testing Libraryを使ってReactアプリケーションをテストする方法について説明します。 テストとは ユニットテス…
ChatGPTの印象的なレスポンシブ アルゴリズムにより、このAIテクノロジーは世界中で注目を浴びています。ニュース記事でもChatGPTが頻繁に取り上げられています。 一部の人々は、ChatGPTがソフトウェア開発者を完全に取って代わる可能性があると懸念していま…
Reactのプロジェクトを実行するには、開発モードと Production buildの2つのモードを使用できます。 開発段階では、Reactがアプリコードの問題を簡単に検出して修正し、バグを排除するための多くの役立つ警告とツールを提供する開発モードを使用して、コード…
初心者向けのWebpack基本構成ファイルのセットアップ手順を詳しく解説致します。
事前準備 Vercelとは Git Hubと連携 Vercel アカウントの作成 まとめと機能 今回は、Next.jsプロジェクトをデプロイする方法について解説します。 デプロイ先には多くの選択肢がありますが、代表的なものに「Cloudflare Pages」や「Netlify」があります。 こ…
React開発者になるには欠かせない、Webpack&Babelについて、なるべくざっくりと解説致します。 まずはなぜ必要なのかを理解していきましょう。
前回の記事では、「 React.js専用の便利ツール」を紹介しましたが、それではReactや開発者以外の方にとっては役に立たないものでした。 また、さらに以前は「Googleでの検索方法」、「Google Chrome拡張機能」を紹介しましたが、本日はさらに幅広い範囲でお…
Reactに関連する効率的なUI構築とデバッグのための必須ツールを紹介します。
はじめに ライブラリ フレームワーク 最後に はじめに Web開発を学ぶ際、必ずと言っていいほど出くわす用語が「ライブラリ」と「フレームワーク」です。 しかし、これらの用語の違いについて理解することは簡単ではありません。 多くの人はGoogleで検索して…
Webアプリ開発エンジニアが個人的に紹介するChromeの拡張機能になります！
Reactを学習中の方や、SPAの開発を手軽に始めたい方には、Create-React-App（CRA）というCLIツールがおすすめです。 このツールは、Reactプロジェクトの雛形を提供し、初期設定を自動的に行ってくれます。 CRAを使用すると、ディレクトリ構成が自動的に作成…
Google検索演算子を使う 中点を使用する 関連ページ 検索時に修飾子を使用する ORを使用する Google検索を効率的に行うためには、キーワードの組み合わせと検索クエリの正しい使い方が重要です。プログラマーやエンジニアが検索する場合、以下のように検索キ…
Webフロントエンド開発では、パッケージ管理ツールである「npm」または「yarn」を使用することが必須となっています。 この記事では、Node.jsがすでにインストールされていることを前提に、「npm」または「yarn」の使い方をできるだけわかりやすく解説してい…
マウスからは卒業しよう！ VS Codeの個人的にオススメなショートカットキーのご紹介。
HTMLファイルの作成 Firebaseプロジェクトの作成 サイトをdeployする リリース履歴の管理 公開したのを非公開 ドメイン名は変えられない？ firebaseを使いこなしていこう 本日はGoogleが提供しているクラウドサービスmBassであるFirebaseを使用して、既存のH…
Visual Studio Codeのプラグイン Visual Studio Codeのプラグイン indent-rainbow Auto Rename Tag Color Highlight Draw.io Integration Live Sass Compiler peacock Git Lens Visual Studio IntelliCode Open in browser Error Lens Prettier 久々に拡張機…
React-Tabs コマンドインストール React Particles-js コマンドインストール 3d-react-carousal コマンドインストール react-responsiv React-Router コマンドインストール material-ui コマンドインストール create-react-app コマンドインストール Reactで…
この記事は、筆記が長年使い続けた経験からFirebase by Googleのメリットとデメリットをまとめたものです。 Firebaseとは？ 容量制限は？ Firebase向けのGoogle アナリティクス DatabaseとFirestore 動的リンク(Dynamic Links) セキュリティ デメリットも… …
