#1.React(学習理由、JSX、State)

開始します.
9月中旬からHTML、CSSを学び、現在ヴァニラJavaScriptを学ぶとともに、11月の誘導サマーキャンプ開講までにJavaScriptベースのフレームワークReactの基礎レベルが分かるはずなので勉強を始めます.もちろん、今の実力は客観的には劣っていますが、焦ることはなく、毎日たゆまず努力しなければなりません.
どうしてReactを勉強しますか.
どうしてReactを習うの?様々な資料とyoutubeで何のメリットがあるかを知りました.現在では多くのサービスが利用されており、リフレッシュせずに安定したモバイルアプリケーションを実行できるような「Webアプリケーション」を実現しています.
これは消費者に快適なUI/UXを提供し、最終的に企業の最も重要な「購買転化率」を高める.この説明を聞くと,私は納得した.
消費者としての私の経験を振り返っても、どんなに良い製品があっても使いづらいので、不器用でスピードの遅いモバイルネットワークがあれば信頼度が落ち、実際に購入した経験さえないからです.
また,Reactというライブラリを作成すると簡単に短いコードを記述できるので,学習の理由は何もない.
JSX
JSXはJavaScript eXtensionの略でHTMLに似ているように見えますが違います.したがって、JSXもJavaScriptであるため、classではなくclassNameを使用する.HTMLのように、JSXはどんなメリットがあるのでしょうか.
まず、今日勉強した内容の中で一番面白いのは「データをバインド」できることです.
例:

function App() {
  let posts = '~~~~~~~~';
  return (
    <div className="App">
      <div className="nav-bar">SeongJae Blog</div>
      <h4>{ posts }</h4>
    </div>
  );
}

h 4ラベルにブログ記事を追加したい場合は、
JavaScriptでドキュメントを作成します.getElementById().innerText=「~~」はこのように書かれているかもしれませんが、変数、HTML属性、さらにはダイナミック関数をカッコでバインドできます.これは、純粋なJavaScriptを使用するコードよりも書きやすく、可読性の面でも優れています.
State
サイトに必要なデータを保存し、変数としてデータバインディングに入れる方法もあるが、Stateという方法もあることが分かった.

let [a,b] = useState('햄버거 맛집');

上記のように、aとbは、それぞれ「ハンバーガーグルメ店」データを含むStateと、「ハンバーガーグルメ店」データの変更を支援する関数である変数を生じる.先ほどの変数のようにデータをバインドできます.StateにはString、Array、Objectのデータ型が含まれます.
では、Stateはどのように変数を利用しているのでしょうか.Stateは、変更が発生したときに関連するHTMLを自動的に再ロードします.つまり、リフレッシュはしません.
(たとえば、「いいね」ボタンを押すと、ページがリフレッシュされ、「いいね」が集計されます)
これを利用して、柔軟なWebアプリケーションを構成することができます.したがって,将来発生する可能性のあるデータの変更は,変数として指定するよりもStateとして指定すると考えられる.