React 【エラー/TypeScript×React】inputが使えない。inputが入ったコンポーネントを返すと読み込まれなくなる。
はまったエラーがあったので記録です！ エラーが出たコード <input></input>という形で文字列を囲んでいます。 うまくいった例 これを<input value="" />とすると、うまくいきました！ 結論：<input></inp...
開発
React 
基礎知識 【Web基礎】HTTPとHTTPS、DNS、リクエストとレスポンスの一気まとめ
HTTP（Hyper Text Transfer Protocol） Webサーバーとクライアントが、WWW(World Wide Web)上で情報をやり取りする際の通信手順・規約（プロトコル）のこと。原則的には前回の状態は保持されないため...
React 【エラーログ/React】Node Sass version 5.0.0 is incompatible with ^4.0.0.
エラー内容 Reactを立ち上げて、ディレクトリを整理しているときに、以下のエラーが起きました。 ./src/styles/style.scss (./node_modules/css-loader/dist/cjs.js??ref--5-...
基礎知識 SPA（Single Page Application）とは
SPAとは Single Page Application（シングルページアプリケーション）の略称。 単一のWebページで機能するアプリケーションそのものや、その設計構造のこと。 SPAの特徴 別箇所に移動してもページ自体がリロード（再読み...
HTML/CSS/Sass 【Sass保存版】便利なmixin4選
Sass使用するなかでも便利で、転用する場面が多そうなmixinを4つ集めました！ linkのcolor指定 mixin @mixin links ($link, $visited, $hover, $active) { & { color...
HTML/CSS/Sass 【初心者向け・CSS】2つ以上の指定するClass名をもつ要素にスタイルを適用する方法（AND条件、かつ）
先日、クラスをAND条件で指定してスタイルを適用する際に少し躓いたので記事にしました。 sample1とsample2というクラスがあると仮定して、説明します。 「sample1」と「sample2」のどちらのクラスも持つ要素にスタイルを指...
Git/Github 【Git/Github】【初心者向け】Git・Githubの基本用語
リポジトリ ファイルやディレクトリの保存場所のこと。 リモートリポジトリ：複数の人が利用できるサーバに配置しているリポジトリ。ローカルリポジトリ：自分のPCに配置するリポジトリ。 クローン リモートリポジトリを複製・ダウンロードし、自身のロ...
React 【React】index.jsxにしたらエラーになる
Reactをインストールして、いざ開発スタート！…となった矢先のあるあるエラーです。 エラー詳細 もともとあったファイル「index.js」を「index.jsx」に変更したら、以下のようなエラーが出て何も表示されなくなりました。 解決方法...
React 【React】【初心者向け】Reactの始め方・インストール方法
Reactの始め方を説明していきます。 目次にも書いてある4工程でスタートできます。 Node.jsをインストール まずは、Node.jsをインストールしましょう。 Node.jsをインストールするといっても、Node.jsの管理ツールであ...
開発 nodistのインストール方法(Windows)
nodistとは、Node.jsのバージョンを簡単に管理できるツールです。 Mac、Linux環境では「Homebrew」を使用するのでご注意ください。 nodistをインストールする こちらのnodistのページからインストーラーをダウン...
JavaScript 【JavaScript】getElementsByClassNameでうまくクラスを取得できないとき
クラス名に基づいて要素を取得したいときに用いられるgetElementsByClassNameですが、うまくいかないときに注意したい点があります。 それは、idなどとは異なり、複数の要素を取得してしまうことです。 そもそもid は1ドキュメ...
DB 【mySQL】基本コマンドまとめ
起動させるときログインするときログアウトするとき停止させるとき現在あるデータベースを表示させるときデータベース作成データベースを選択するデータベースの中身を見るテーブルを作成テーブル構造を表示テーブルを削除データベースを削除取得（挿入前確認...
JavaScript 【JavaScript】var, let, const の違い・使い分け
理解に必要な前知識 ①再宣言・再代入 >>>>> 「【JavaScript】再宣言・再代入とは？」 ②スコープ >>>>> 「【JavaScript】スコープとは？スコープの種類と違い」 var 再宣言できる再代入もできる関数スコープは持つ...
JavaScript 【JavaScript】再宣言・再代入とは？
再宣言・再代入とはどういうことかお伝えします。 基本的な内容ですが、理解しておかないと「var, let, const の違い」が判りづらいです。 再宣言・再代入とは 簡単な例を挙げます。 まず、以下のコードは、「 a という変数を宣言して...
JavaScript 【JavaScript】スコープとは？スコープの種類と違い
スコープとは？ スコープとは、変数の適用範囲（使える範囲）を示す概念です。 大きく分けて２種類のスコープがあります。 グローバルスコープローカルスコープ（ブロックスコープ・関数スコープ） 以下がざっくりとした図解です。1つ1つ説明していきま...