サーバーサイドのNode.jsで動くウェブフレームワーク。https://nestjs.com/[TypeScript]に対応していて、[GraphQL]やWebSocketもサポートされている。ExpressやFastifyのウェブサーバーシステムをサポートしている[** なぜ学びたい？]

[*** Notify]本ScrapboxはNotionに移設しています。申し訳ありませんがこのNotionのページは公開していません。Yuzulia-ProgBuilder（読み：ユズリア プログビルダー）はプログラミングや技術を勉強する上で何かしらのアウトプットをするためのScrapboxです。その他の内容は[/yuzulia]へごちゃごちゃと載っけていますのでそちらをご参照ください。[** Writer / Maintainer]

[JavaScript] / [TypeScript]一応読めるしある程度書けるけど、クオリティはまだ高くないのでちゃんと書けるようにしたい。特にフロントエンド[Angular]JavaScript、TypeScriptで書くフロントエンドフレームワーク。

コンポーネントはデータの受け渡しを重点としているため、直接データの取得や保存を行うのはAngularでは望ましくない。そこで、データの取得や保存に適したAngularの機能、サービスがあるお互いを知らないクラス間で情報を共有するときや、バックエンドなどのデータ取得先の実装変更などに最適であるコンポーネントと同じようにコマンドでサービス用のファイルを作成する`ng generate service [サービス名]`

コンポーネントにはプロパティを追加することができ、柔軟な表示などをすることができる単方向データバインディング(`[]`)を用いるコンポーネントのスクリプトに設定すると、プロパティを追加することができるこのプロパティはhtml内で今まで通り使うことができる#Angular

ある条件が揃えば指定したクラスを付与するバインディング。条件はリアルタイムで行われ、条件が変わるとクラスが付いたり消えたりする`[class.クラス名]="[条件文]"`#Angular

`*ngIf`をhtml内の要素につけるとその条件に合う時に表示されたりするディレクティブそのディレクティブ内に条件文を入れれば表示される#Angular

`(click)`とか、何かしたら何かをする仕組みを作るためのディレクティブ#Angular

プロパティに`*ngFor`を入れると繰り返しになる[* 最初に入ってるアスタリスクも構文に含まれるので忘れないように]これが実行されると以下のような出力になる（あくまでわかりやすく表した例えであり、実際の出力とは異なる場合がある）#Angular

アプリケーションの部品がどのように合わさるか、アプリが必要なライブラリやファイルなど（メタデータ）を知るため、`@NgModule`というデコレータ内に格納されていたりするそれらを取り入れるためのシステムがAngularには搭載されているコンポーネントもモジュールの一種で、どこかで使うように宣言しなければいけない#Angular

[**** 双方向]例として、`[(ngModel)]`というものがある指定したプロパティからテキストボックス、テキストボックスからプロパティと双方向でデータを流すことができるちなみに`ngModel`を使うには`FormsModule`をインポートする必要がある（モジュールについては他で記述する）#Angular

HTML内に値を代入するにはtsファイル内（`[名前].component.ts`）に変数を代入する中括弧2つで囲むことを[* 補間バインディング]というらしい補間バインディング内のパイプというものが使用でき、専用の演算子(`|`)と組み合わせて使う例えば`{{title | uppercase}}`とすると変数`title`がすべて大文字になるこれらは通貨金額、日付、その他の表示データの書式設定をするのに適してる

Angular CLIを通じてコンポーネントを作ることができる。`ng generate component [コンポーネント名]`作成するとこんな感じのファイルが出てくる`@component`内の`selector`はCSS要素セレクター（HTML要素名）、`templateUrl`はテンプレートファイルの場所、`styleUrls`はコンポーネント用のCSSスタイルファイルというプロパティになっている

Angularのコンポーネントには以下の3つのファイルがある※`[名前]`には生成時に指定したコンポーネント名などが入る（例: `app`）`[名前].component.ts`コンポーネントクラスのコード。`[名前].component.html`

Angularのプロジェクトを作る前に、Angular CLIを入れる必要がある。npmで入れられる。`npm install -g @angular/cli`入れ終わったら以下のコマンドを実行する。`ng new [プロジェクト名]`※プロジェクト名は半角英数字とハイフン（`-`）が使える。

[JavaScript]のaltJS(いわゆる方言)の一つ[JavaScript]に型を付けられるようになった言語。https://ja.wikipedia.org/wiki/TypeScript[** なぜ学びたい？][JavaScript]も学びたいが、こっちも学んでおいたほうがいいと思ったため

デスクトップアプリを作るためのフレームワークバックエンドに[Rust]が使われていて、フロントエンドにウェブ系の言語（HTML、CSS、JavaScript）が使える[Electron]と似ているところが多い[** なぜ学びたい？][Electron]より軽量で、動作が軽快だから

フロントエンドのWebフレームワークの一つReact Nativeってのを使うとスマホアプリも作れる、らしいhttps://ja.reactjs.org/[** なぜ学びたい？]ウェブアプリを作ってみたいから

JavaScriptフレームワークの一つ。仮想DOMを使わないのがこのフレームワークの特徴https://svelte.dev/[** なぜ学びたい？][Stack Overflow Developer Survey 2021 https://insights.stackoverflow.com/survey/2021#technology-most-loved-dreaded-and-wanted]のWebフレームワークで最も愛されているから

安定と信頼のGitHubが開発しているフレームワークChromiumのレンダリングとNode.jsのランタイムを組み合わせてWebの技術(HTMLやJavaScript)でデスクトップアプリを作ることができるクロスプラットフォームでの開発もしやすいVSCodeやAtomなどもこれを使って開発されているhttps://ja.wikipedia.org/wiki/Electron_(ソフトウェア)[** なぜ学びたい？]