Angular CLI - Linux'ta Yeni Bir Angular Proje Nasıl Oluşturulur


Angular, TypeScript/JavaScript kullanarak mobil ve web uygulamaları oluşturmak için kullanılan, açık kaynaklı, popüler ve oldukça genişletilebilir bir ön uç uygulama geliştirme çerçevesidir. Strong> ve diğer yaygın diller.

Angular, Angular 2 de dahil olmak üzere AngularJS'den (veya Angular sürüm 1.0) sonra gelen tüm Angular sürümleri için kullanılan bir şemsiye terimdir. ve Angular 4.

Angular, küçük ve büyük ölçekli uygulamaları sıfırdan oluşturmak için çok uygundur. Angular platformunun uygulama geliştirmeye yardımcı olan temel bileşenlerinden biri Angular CLI yardımcı programıdır; uygulama oluşturmak için kullanılan basit ve kullanımı kolay bir komut satırı aracıdır. Angular uygulamalarını yönetin, oluşturun ve test edin.

Bu yazımızda Angular komut satırı aracının Linux sistemine nasıl kurulacağını açıklayacağız ve bu aracın bazı temel örneklerini öğreneceğiz.

Node.js'nin Linux'a Kurulumu

Angular CLI'yi yüklemek için Linux sisteminizde Node.js ve NPM'nin en son sürümünün yüklü olması gerekir.

Node.js'yi Ubuntu'ya yükleyin

------------- For Node.js v19.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_19.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v18.x -------------
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v16.x -------------
curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v14.x -------------
curl -fsSL https://deb.nodesource.com/setup_14.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

Node.js'yi Debian'a yükleyin

------------- For Node.js v19.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_19.x | bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v18.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_18.x | bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v16.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_16.x | bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v14.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_14.x | bash - &&\
sudo apt-get install -y nodejs

Node.js'yi RHEL, CentOS, Fedora, Rocky ve Alma Linux'a yükleyin

------------- For Node.js v19.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_19.x | sudo bash -
sudo yum install -y nodejs

------------- For Node.js v18.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_18.x | sudo bash -
sudo yum install -y nodejs

------------- For Node.js v16.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_16.x | sudo bash -
sudo yum install -y nodejs

------------- For Node.js v14.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_14.x | sudo bash -
sudo yum install -y nodejs

Ayrıca NPM'den yerel eklentileri derleyip yüklemek için aşağıdaki gibi geliştirme araçlarını sisteminize yüklemeniz gerekebilir.

sudo apt install -y build-essential  [On Debian/Ubuntu]
sudo yum install gcc-c++ make        [On RHEL Systems]

Linux'ta Angular CLI Kurulumu

Yukarıda gösterildiği gibi Node.js ve NPM'yi yükledikten sonra, npm paket yöneticisinikullanarak Angular CLI'yi yükleyebilirsiniz. Strong>'i aşağıdaki gibi kullanın (-g bayrağı, aracın tüm sistem kullanıcıları tarafından kullanılacak şekilde sistem çapında kurulması anlamına gelir).

npm install -g @angular/cli
OR
sudo npm install -g @angular/cli

Şimdi sisteminize yüklenmesi gereken ng yürütülebilir dosyasını kullanarak Angular CLI'yi başlatabilirsiniz. Yüklü Angular CLI sürümünü kontrol etmek için aşağıdaki komutu çalıştırın.

ng version
OR
ng --version

Angular CLI Kullanarak Angular Proje Oluşturma

Bu bölümde yeni, temel bir Angular projesinin nasıl oluşturulacağını, inşa edileceğini ve sunulacağını göstereceğiz. Öncelikle sunucunuzun webroot dizinine gidin, ardından aşağıdaki gibi yeni bir Angular uygulamasını başlatın (istemleri takip etmeyi unutmayın):

cd /var/www/html/
ng new tecmint-app			#as root
OR
sudo ng new tecmint-app		#non-root user

Daha sonra yeni oluşturduğunuz uygulama dizinine geçin ve uygulamayı gösterildiği gibi servis edin.

cd tecmint-app
ls 			#list project files
ng serve

Yeni uygulamanıza bir web tarayıcısından erişmeden önce, çalışan bir güvenlik duvarı hizmetiniz varsa, güvenlik duvarı yapılandırmasında gösterildiği gibi 4200 bağlantı noktasını açmanız gerekir.

---------- On Firewalld ---------- 
firewall-cmd --permanent --zone=public --add-port=4200/tcp 
firewall-cmd --reload

---------- On UFW ----------
sudo ufw allow 4200/tcp
sudo ufw reload

Artık bir web tarayıcısı açabilir ve aşağıdaki ekran görüntüsünde gösterildiği gibi yeni uygulamanın çalışmasını görmek için aşağıdaki adresi kullanarak gezinebilirsiniz.

http://localhost:4200/ 
or 
http://SERVER_IP:4200 

Not: Bir uygulama oluşturmak ve onu yerel olarak sunmak için yukarıda gösterildiği gibi ng serve komutunu kullanırsanız, sunucu uygulamayı otomatik olarak yeniden oluşturur. ve kaynak dosyalardan herhangi birini değiştirdiğinizde web sayfalarını yeniden yükler.

ng aracı hakkında daha fazla bilgi için aşağıdaki komutu çalıştırın.

ng help

Angular CLI Ana Sayfası: https://angular.io/cli

Bu makalede, farklı Linux dağıtımlarına Angular CLI'nin nasıl kurulacağını gösterdik. Ayrıca bir geliştirme sunucusunda temel bir Angular uygulamasının nasıl oluşturulacağını, derleneceğini ve sunulacağını da ele aldık. Bizimle paylaşmak istediğiniz soru veya düşünceleriniz için aşağıdaki geri bildirim formunu kullanın.