2021年6月7日 星期一

Angular Install

前言

Angular 是什麼呢？

是一個基於 TypeScript 的 開源 Web 應用框架，
由 Google 的 Angular 團隊以及社群共同領導

Angular vs AngularJS

AngularJS 是 Angular 之前出的版本

整體架構差別相當多，為了區別兩者從 2.0 開始將 JS 移除，市面上所指的純前端皆是 Anuglar，目前也推出了 11.0，Angular更新也相當快。

基礎底層也是由 2.0 出發，雖然更新幅度都沒有很大，小編都很猶豫要不要學

下面將介紹小編使用的步驟

步驟

  1. 安裝 Node.js
  2. 安裝Angular Cli，開啟 cmd 輸入以下指令
    npm install -g @angular/cli

    enter image description here
  3. 安裝完成
    enter image description here
  4. 再次確認 Node.js 版本與 npm 版本
    node -v
    
npm -v

    enter image description here
  5. 建立 AngularApp 資料夾
    進入 AngularApp 資料夾
    輸入新增 MyApp 專案
    命令模式會問你是否加入Angular專案，輸入 y
    mkdir AngularApp
    
cd AngularApp
    
ng new MyApp
    enter image description here
  6. 小編選用 CSS，按下 Enter
    enter image description here
  7. 等待專案完成
    enter image description here
  8. 新增專案完成
    enter image description here
  9. 進入專案資料夾 MyApp
    啟動專案
    cd MyApp
    
ng serve --open

    enter image description here
  10. 預設瀏覽器會自動啟動，Angular 預設 http://localhost:4200
    enter image description here
  11. ctrl + c 並輸入 y 可以停止服務
    enter image description here

總結

小編一向都以全端自居，也曾試過寫 AngularJS，
當時 AngularJS 剛出，練習過幾個小 Project，但一直對它印象沒有很好，忽然它更新為「純前端」
有種很不習慣感!!!
除了每次都要 Build 很久以外，對 SEO 也不太友善畢竟是 Client Side Random，也讓學習成本也變高，或許開發速度可能變快，但小編 Debug 速度反而變慢，說不定小編…
喔!!!小編承認自己很不擅長前端
但是小編的 JQuery 還可以阿
希望未來純前端能寫得越來越順。

張貼者： 於
標籤：

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)