フロントエンドを学ぶために何を確認したのか？〜フロントエンド入門〜

JSについて学ぶ

上記記事を1.5倍速で確認して思ったことをまとめていきます 

JavaScriptの歴史

• 過去依存関係起因のバグが発生した。解決するために

  • 名前空間（命名が被る問題）

    • モジュールが解決

      • モジュールは1ファイル単位で構成されファイル内の変数や関数は外部に影響を及ぼさない
        

  • 依存関係

    • パッケージ管理(nmp)が解決

      • パッケージとは、package.jsonで記述されたファイルやディレクトリのこと

• モジュール

  • モジュールは1ファイル単位で構成されファイル内の変数や関数は外部に影響を及ぼさない

  • モジュールによって機能分割が可能に

    • aというモジュールでは計算機能

    • bというモジュールでは関数作成

  • それぞれの形式が存在する

    • CommonJS形式

    • ES Modules形式

• パッケージ

  • package.jsonで記述されたファイルやディレクトリのこと

  • 共有したい機能の単位

• パッケージ管理システム（nmp/yarn）

  • リポジトリの購読

  • パッケージのインストール・削除

  • 依存関係の解決

  • 設定管理

export / importについて

• export（公開する）

  • export const hoge = "abc";

  • export function log(value) {};

  • export { hoge };

  • esxport defalut hoge;

    • 各ファイル内で一箇所でしか利用できない

    • import時に{}は記載しない

      • import hoge from "./hoge.js"

• import（読み込む）

  • import { hoge } from "./hoge.js";

nmpとpackage.jsonの関係性は下記を参照

そろそろ適当に npm install するのを卒業する