Angular Komutları ile Proje Oluşturma ve Çalıştırma

Merhaba! Bugünkü yazımızda Angular komutları kullanarak nasıl proje oluşturacağınızı, çalıştıracağınızı ve yönetebileceğinizi adım adım anlatacağız. ߚ€

Angular CLI Nedir?

Angular CLI, Angular projelerini doğrudan komut satırından oluşturmak, geliştirmek ve yönetmek için kullanılan güçlü bir araçtır. Angular projelerinizi hızla başlatmak ve yönetmek için Angular CLI komutlarını bilmek oldukça önemlidir.

 

Adım 1: Angular CLI Nasıl Yüklenir?

Angular CLI'yi yüklemek için terminalinize aşağıdaki komutu girin:

npm install -g @angular/cli

npm install veya npm i: Paket yüklemek için kullanılır.

-g: Global yükleme yapar, yani CLI'yi tüm projelerde kullanabilirsiniz.

CLI'nin yüklendiğini doğrulamak için şu komutu çalıştırabilirsiniz:

ng version

 

Adım 2: Angular Projesi Oluşturma ve Çalıştırma

Yeni bir Angular projesi oluşturmak için:

ng new my-first-project

Proje klasörüne geçin:

cd my-first-project

Projeyi başlatmak ve çalıştırmak için:

ng serve

Tarayıcınızda projeyi görmek için:

http://localhost:4200 adresine gidin.

Aşağıdaki komut, projeyi otomatik olarak tarayıcıda açar:

ng serve -o

-o veya --open: Projeyi tarayıcıda açar.

--port: Port numarasını değiştirmek için kullanılır.

ng serve --port 4300

 

Adım 3: Angular Projesini Derleme

Üretime hazır bir proje oluşturmak için:

ng build --prod

dist klasörüne derlenmiş dosyaları yerleştirir.

--prod: Üretim ortamı için optimize eder.

 

Adım 4: Angular Güncelleme ve Kaldırma

Mevcut Angular sürümünü kaldırıp yeniden yüklemek için:

npm uninstall -g @angular/cli

npm cache clean

npm install -g @angular/cli@latest

npm uninstall: Angular CLI’yi kaldırır.

npm cache clean: Önbelleği temizler.

@latest: En son sürümü yükler.

 

Adım 5: Angular'ın Sık Kullanılan Komutları

KomutAçıklama
ng addProjeye yeni özellikler ekler.
ng analyticsAnalitik verileri yönetir.
ng buildProjeyi derler.
ng configYapılandırmaları günceller.
ng deployProjeyi dağıtır.
ng docAngular belgelerine ulaşır.
ng e2eUçtan uca test çalıştırır.
ng generateBileşen, servis, modül oluşturur.
ng helpKomutlar hakkında yardım alır.
ng lintKod kalitesini denetler.
ng newYeni proje oluşturur.
ng runÖzel betikleri çalıştırır.
ng serveProjeyi çalıştırır.
ng testTestleri çalıştırır.
ng updateAngular'ı günceller.
ng versionAngular sürümünü gösterir.
ng xi18nÇeviri dosyalarını oluşturur.

 

Adım 6: Angular generate Komutu

Bileşen ve diğer yapı taşlarını oluşturmak için kullanılır:

ng generate component my-component

Sık kullanılanlar:

application: Yeni bir uygulama oluşturur.

class: Sınıf oluşturur.

component: Bileşen oluşturur.

directive: Direktif oluşturur.

module: Modül oluşturur.

service: Servis oluşturur.

 

Adım 7: Angular build Komutu

Projeyi derlemek için kullanılır:

ng build --prod

--prod: Üretim ortamına hazırlar.

dist klasöründe optimize edilmiş dosyalar yer alır.

 

Adım 8: Angular doc Komutu

Resmi dokümantasyona hızlıca ulaşmak için:

ng doc component

Belirttiğiniz parametre hakkında Angular belgelerine yönlendirir.

 

Adım 9: Angular xi18n Komutu

Çok dilli uygulamalar için çeviri dosyalarını çıkartır:

ng xi18n

 

Adım 10: Angular update Komutu

Angular sürümünüzü güncellemek için:

ng update @angular/cli

Projenizi mevcut en son sürüme yükseltir.

 

Sonuç

Bu yazımızda Angular CLI komutlarını adım adım inceledik. Proje oluşturma, çalıştırma, derleme ve güncelleme gibi temel işlemleri öğrendik. Angular projelerinizi kolayca yönetmek için bu komutları kullanabilirsiniz.

Daha fazla bilgi ve güncel içerikler için latestsoftwaredevelopers.com adresini ziyaret etmeyi unutmayın! ߚ€

 

İyi çalışmalar ve bol kodlu günler! 

 

Beğendiysen bir çay ısmarlayabilirsin ☕

Bana çay ısmarla

FrontEnd ile ilgili yorumlar

Yorum Paylaş

EMail Zorunlu alanlar * *