Cài đặt angular x thông qua composer

Medium – 14 Nov 17

How to Install a Node.js Project Within Composer – Myplanet Musings – Medium

Written by: Erin Marchak

Reading time: 5 min read

Cám ơn nhé. Tại mình muốn công nghệ nào ra công nghệ đó, tự nhiên ông nội angular này front end mà đòi node js … Quái

Hầu hết các frontend libs đều được quản lý thông qua NPM, bản chất đều là JS.
Bạn thấy quái ở điểm nào?
Composer chủ yếu dùng cho PHP, cài đặt JS bằng cái đó mới là không bình thường.

giả sử mình không cài node js mình có chạy được angular x không?

Node chỉ là môi trường phát triển. Trong trường hợp frontend thì nó chỉ là công cụ để quản lý các js libs.
Khi bạn chạy local, nó có thể giúp mình chạy 1 local server để test mà không cần setup gì thêm.
Khi deploy thì nó sẽ có các tính năng đóng gói tất cả những gì liên quan đến dự án của bạn thành 1 hay 1 vài file js.
Đẩy lên server thì trên server không cần dùng node mà vẫn chạy được, vì đó chỉ là các static files.

thế mình muốn chạy angular 2 trên wamp thì làm thế nào?

Thông thường đối với Angular 2, nó thiết kế để chạy riêng (SPA) vì phải config khá lằng nhằng mới chạy được.
Nếu đã là SPA thì nó độc lập với cái wamp server của bạn.

vậy là cái node js , npm, angular cli chỉ là một cái công cụ để mình gen một cái angular x app???

Có thể hiểu như vậy, đó là môi trường dev

Cám ơn bạn nhé. Mình xoay đầu máy làm thử cái này, cũng thấy dễ hiểu hix
https://angular.io/guide/quickstart

Cá nhân mình khi xưa dùng Angular 1, giờ làm cty vẫn Angular 1 rất nhiều.
Từ khi Angular 2 ra thì rất là háo hức, dùng thử từ bản beta.
Nhưng lúc đó mình ko thích typescript lắm do phải học lại từ đầu. Có nghĩa là không thể tận dụng được kiến thức của A1.
Sau đó 1 thời gian ngắn thì thằng A2 nó nâng version liên tục, mỗi lần nâng là có breaking changes.
Nản quá mình theo React luôn, tới giờ vẫn ko thấy hối hận khi theo React.

Dành cho ai mới bắt đầu…share!!!

Phải cập nhật node js và npm

Verify that you are running at least Node.js version 8.x or greater and npm version 5.x or greater by running
node -v and npm -v in a terminal/console window. Older versions produce errors, but newer versions are fine

Vào cái wamp của bạn tạo angular5
Check một cái

PS G:\wamp64\www\angular5> node -v
v8.11.2
PS G:\wamp64\www\angular5> npm -v
6.1.0
PS G:\wamp64\www\angular5> npm version
PS G:\wamp64\www\angular5> npm install -g typings
PS G:\wamp64\www\angular5> npm install -g @angular/cli
PS G:\wamp64\www\angular5> ng new my-app

Kết quả một fonder my-app xuất hiện

PS G:\wamp64\www\angular5> ng serve --open

Chuyển vào thư mục my-app

PS G:\wamp64\www\angular6\my-app> ng serve --open
http://localhost:4200/   ---> sẽ thấy kết quả

Cái trên là chạy trong môi trường node js còn trên wamp thì sao, làm thế này

PS G:\wamp64\www\angular6\my-app> ng build --prod

Xuất hiện fonder dist trong fonder my-app
Chạy cái link để xem

http://localhost/angular5/my-app/dist/my-app/

Xem thử version angular

PS G:\wamp64\www\angular5> cd "my-app"
PS G:\wamp64\www\angular5\my-app> ng -v
     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 6.0.8
Node: 8.11.2
OS: win32 x64
Angular: 6.0.4
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.8
@angular-devkit/build-angular     0.6.8
@angular-devkit/build-optimizer   0.6.8
@angular-devkit/core              0.6.8
@angular-devkit/schematics        0.6.8
@angular/cli                      6.0.8
@ngtools/webpack                  6.0.8
@schematics/angular               0.6.8
@schematics/update                0.6.8
rxjs                              6.2.0
typescript                        2.7.2
webpack                           4.8.3

PS G:\wamp64\www\angular5\my-app>

Chu choa angular 6 luôn…
Nếu có x người làm bài này tui sẽ được x * 1 phút công đức…
Cám ơn đã xem