React Intro


1. Why React?
1-1. Webアプリケーションの開発
  • アプリケーションはますます大きくなり、従来の方法(DOM、JQuery)によるアプリケーションの開発とメンテナンスコードの開発はますます困難になっている
  • は、より大規模で複雑なアプリケーションを開発し、生産性を向上させ、大量のデータ管理とコードメンテナンスを簡素化し、
  • シリーズが誕生しました.
    1-2 Frontend FrameWorkタイプ
  • Angular
  • Vue
  • React
  • Library vs FrameWork : コメントブログ

    2. What is React?
    2-1. 反応の定義
  • Reactは ユーザーインタフェース(UI)を作成するJavaScriptライブラリ.
  • 反応  가상 돔(Virtual Dom)  UIをすばやく更新します.バーチャルドーム これは、以前のUIステータスをメモリに保持して、変更するUIの最小セットを計算する技術です.
  • 3.タスク優先パラメータの設定
    Node.js
  • Node.jsは、JavaScriptがブラウザの外(ex.サーバ)で実行できる環境
  • を許可する.
    node -v 
    npm
  • ノードベースのパッケージを使用するには、npm(node package manager)というパッケージツールが必要です.
  • npm -v
    CRA (create-react-app)
  • 応答プロジェクトを開始するために必要な開発環境を設定するためのツール(ツールチェーン)
  • 包装マネージャ-例)糸、npm.3番目のパッケージinstall、
  • の更新が容易
  • bundler-例)小包、webpack.複雑なJavaScriptモジュールと互換性があります.
  • コンパイラ-例)Babel.
  • 古いブラウザでの現代JavaScriptの使用を許可
    CRA - Settings
    // 1. Desktop - 원하는 파일 
    cd Desktop/react_practice
    
    //2. 리액트 프로젝트 설치
    npx create-react-app react_practice
    
    //3. 프로젝트 진입
    cd react_practice
    
    //4.로컬 서버 띄우기
    npm start
  • 2npm startを入力するとhttp://localhost:3000アドレスが得られます.
  • のようなWiFiを使用している場合は、導入前でも現在の作業を把握できるネットワーク上:(アドレス)を使用してください.
  • 1) node.modules
    構成
  • CRAのすべてのパケットソースコードを含むフォルダ
  • 2) package.json
  • ファイル
  • 基本パッケージを除く他のリポジトリ/パッケージ情報を記録する
  • すべてのプロジェクトをパッケージ化します.各jsonには
  • が存在する
    3) .gitIgnore
  • githubにアップロードしたくないフォルダとファイル
  • を作成できます.
  • を押しても.gitignoreファイルで作成したフォルダとファイルをアップロードしない
  • 4) public -index.html/imagesフォルダ
    5) src - index.js(作業フォルダとファイル!)