GitHub Copilot CLI, Angular projesinde terminalde copilot komutuyla başlar; proje talimatlarını .github/copilot-instructions.md veya AGENTS.md dosyasından okur. Angular’ın güçlü kuralları sayesinde bileşen, servis, test ve refactor işlerini doğrudan kod tabanında yapar. Genel kurulum ve ilk adımlar için GitHub Copilot CLI sayfasına bakabilirsiniz.
Neden GitHub Copilot CLI Angular işine uygun
Angular projeleri TypeScript, katı klasör yapısı, standalone component desteği, dependency injection ve signals gibi net kurallara sahiptir. GitHub Copilot CLI bu kuralları tsconfig.json, angular.json ve ESLint konfigürasyonundan okur. Bu sayede ajan, ng generate component ile dosya oluşturmak yerine var olan yapıya uyumlu, standalone bir bileşen üretebilir; imports dizisini tamamlar, selector ve template dosyasını doğru yerleştirir. Servislerde providedIn: 'root' tercih eder, constructor yerine inject() kullanabilir ve RxJS akışlarını signal veya computed yapılarına dönüştürürken import’ları günceller. Angular’ın test altyapısı Jasmine veya Jest fark etmeksizin spec dosyalarını üretir ve ng test komutlarıyla doğrular.
Ajan ayrıca Angular CLI’yı doğrudan çalıştırabilir; ng generate service, ng add gibi komutlar projeye resmi schematic’lerle dosya eklerken kurallara uyumu garanti eder. Büyük refactorlarda TypeScript derleyicisi tarafından yakalanacak hataları önceden tahmin eder, özellikle strict template checking ve standalone migration senaryolarında ng update çıktısını yorumlayabilir. Bu, genel amaçlı bir kod üreticiden çok projeye özel bir Angular asistanı gibi çalışmasını sağlar.
Projeyi ajan için hazırlama
Ajanın Angular’a özgü davranması için repo köküne .github/copilot-instructions.md dosyası ekleyin; AGENTS.md de çalışır ancak GitHub Copilot CLI öncelikle .github/copilot-instructions.md dosyasını arar. Bu dosyada build, test, lint komutlarını, klasör kurallarını ve Angular’a özel kararları kısa maddeler halinde yazın. Talimat dosyası yazımında daha geniş bir rehber için CLAUDE.md nasıl yazılır? AGENTS.md ve GEMINI.md rehberi sayfasına göz atabilirsiniz.
Dosyayı oluştururken ajanın sıkça başvuracağı şu noktaları netleştirin: package manager (npm, pnpm veya yarn), çalıştırılacak test komutu (npm test -- --watch=false), lint komutu, build komutu ve ortam değişkenleri. Angular’a özel olarak standalone component kullanımı, signals mı RxJS mi, state yönetim yaklaşımı, hangi Angular sürümü ve strict mod ayarları önemlidir. Eğer projede Angular Material, Tailwind veya NgRx gibi kütüphaneler varsa bunları da belirtin.
Aşağıdaki örnek, gerçek bir Angular reposunda işe yarar:
# Angular Proje Talimatları
## Komutlar
- Bağımlılık kur: npm install
- Geliştirme sunucusu: npm start
- Build: npm run build
- Test: npm test -- --watch=false
- Lint: npm run lint
- Format: npm run format
## Klasör kuralları
- src/app/features altına her özellik için ayrı klasör aç
- src/app/shared altına ortak bileşenler, servisler ve directive'ler koy
- Standalone components kullan; NgModule yalnızca gerçekten gerekliyse kullan
- Her feature için `components`, `services`, `models` alt klasörleri oluştur
## Angular kuralları
- Yeni bileşenler `standalone: true` olmalı ve `imports` dizisini açıkça yazmalı
- Servisler `providedIn: 'root'` ile tanımlanmalı; constructor yerine `inject()` kullan
- State yönetimi için signals kullan; RxJS'i yalnızca HTTP ve async event akışlarında kullan
- `any` kullanma; TypeScript strict mode açık; `strictTemplates` etkin
- Her değişiklikte ilgili spec dosyasını güncelle ve `ng test --watch=false` çalıştır
- Angular Material veya taşıma bileşen kullanılıyorsa ilgili import'ları ekle
- Route tanımları lazy loading kullanmalı; `loadComponent` veya `loadChildren` ile yapılmalı
- Formlar için Reactive Forms kullan; template-driven forms tercih etmeBu dosyayı proje geliştikçe güncel tutun. Örneğin yeni bir ESLint kuralı eklediğinizde veya signals geçişi tamamlandığında talimatları yansıtın; böylece ajan gelecekteki değişikliklerde tutarlı kalır.
Çalışma döngüsü: planla, küçük adımlar, testleri çalıştır, diff’i incele
Ajanla tek seferde büyük bir refactor istemek yerine döngüyü şöyle kurun: önce yapılacak işi net bir prompt ile sınırlandırın, ajanın ürettiği değişiklikleri git diff ile inceleyin, ardından testleri çalıştırın. Hata varsa ajanın test çıktısını görmesini sağlayın; çoğu durumda kendi hatasını düzeltir. Her adımda değişiklikleri commit’lemek, geri dönüşü kolaylaştırır.
Prompt yazarken ajanın tam olarak ne yapacağını söyleyin: hangi dosyaları değiştireceği, hangi Angular özelliğini kullanacağı, test isteyip istemediğiniz. Örneğin “AuthService’i signals kullanacak şekilde refactor et, user signal’ini expose et, login metodunu async yap ve tüm kullanım yerlerini düzelt” demek yeterli değildir; “spec dosyalarını da güncelle, ng test --watch=false çalıştır ve çıktıyı göster” eklerseniz ajan kendi kendini doğrular.
Aşağıdaki promptlar Angular projelerinde tipik başlangıç noktalarıdır:
- Angular 17 standalone
UserCardComponentoluştur; @Input() user sinyali alsın, template’de ad ve e-posta göstersin, spec dosyasını da yaz. - Mevcut
AuthService’i signals kullanacak şekilde refactor et;usersignal’ini expose et,loginmetodunu async güncelle, tüm kullanım yerlerini düzelt ve ilgili spec’leri güncelle. DashboardComponentiçindekicombineLatestile birleştirilen üç observable’ıcomputedsinyale çevir; gereksiz subscription’ları kaldır ve testleri güncelle.TodoService’edeleteCompletedmetodu ekle, HTTP DELETE çağrısını yap, ilgili bileşende butona bağla, test yaz veng test --watch=falseçalıştır.- Angular CLI ile
ProductListComponent’i standalone oluştur,ProductService’i inject et, signal ile ürünleri yönet,AsyncPipeyerine@forbloğu kullan ve test ekle.
Bu tür spesifik promptlar ajanın odaklanmasını sağlar ve beklenmedik değişiklikleri azaltır.
Angular’da iyi çözdüğü işler ve dikkat edilmesi gerekenler
Ajan, tekrarlayan üretim işlerinde iyidir; ancak Angular’a özgü bazı tuzaklar vardır. Aşağıdaki tablo, hangi alanda nelere dikkat etmeniz gerektiğini özetler:
| Alan | Ajanın iyi olduğu durum | Dikkat edilmesi gereken |
|---|---|---|
| Standalone component | imports dizisini tamamlar, spec üretir | Yanlış modül import’u veya eksik standalone: true |
| DI ve servisler | providedIn: 'root' ile servis ekler, inject() kullanır | Injection context dışında inject() çağırabilir, özellikle route guard veya interceptor’larda |
| Signals ve RxJS | signal, computed dönüşümlerini yapar | toSignal / toObservable karışıklığı, subscription sızıntısı, effect içinde yanlış state değişimi olabilir |
| Angular CLI | ng generate komutlarını çalıştırır, schematic seçeneklerini bilir | Yanlış dosya adı üretebilir, --dry-run yapmadan değişiklik uygulayabilir |
| Testler | Jasmine veya Jest spec taslakları üretir, TestBed kurulumu yapar | async / fakeAsync kullanımı, fixture.detectChanges() eksik kalabilir, async pipe testlerinde tick yanlış olabilir |
| Routing ve lazy loading | loadComponent ile route tanımları ekler, path parametrelerini çözer | Wildcard route sırası, redirectTo kafa karışıklığı, guard eklemeyi unutabilir |
| Forms ve validation | Reactive forms builder ile form kontrolü oluşturur, validators ekler | Custom validator’larda this bağlamı, form array yönetimi, async validator’da hata mesajları |
| Change detection | OnPush bileşenlerde markForCheck eklemeyi önerir | Gereksiz ChangeDetectorRef kullanımı, signal’lerle değişim tespiti kurallarını karıştırabilir |
Özellikle büyük refactorlarda ajanın tüm kullanım yerlerini bulmasını isteyin; grep benzeri aramalar için Yapay zeka ajanları için kod haritası: grep’siz arama yazısındaki yaklaşımlar işe yarar. Ajanın önerdiği değişiklikleri git diff ile satır satır inceleyin; Angular’da yanlış bir import, uygulamanın derlenmesini engelleyebilir. Ayrıca ng build sırasında template tip hataları ortaya çıkabilir; ajan her zaman ng build çalıştırmayabilir, bu yüzden siz de doğrulayın.
Ajanın signal/RxJS geçişlerinde ürettiği kodda toSignal ile computed arasında karışıklık olabilir; bu yüzden karmaşık akışlarda testleri mutlaka çalıştırın ve subscription sızıntılarını kontrol edin.
Test ve doğrulama
Her değişiklikten sonra ajanın testleri çalıştırmasını sağlayın. Jasmine/Karma kullanan projelerde ng test --watch=false komutu yeterlidir; Jest kullanıyorsanız npm test -- --watch=false çalıştırın. Ajan, test çıktısındaki hataları okuyup düzeltebilir. Ayrıca npm run build ile production derlemesini doğrulayın çünkü testler geçse bile Angular şablon tip kontrolü veya eksik import derlemeyi bozabilir. ng lint ile kod stilini kontrol edin; ajan bazen import sıralamasını veya kullanılmayan değişkenleri atlayabilir.
Eğer projenizde tarayıcı testleri varsa Playwright veya Cypress gibi araçları devreye alabilirsiniz. Ajan, MCP sunucuları üzerinden tarayıcı otomasyonu da yönetebilir; kurulum için MCP sunucusu nedir? Kodlama ajanları için kurulum yazısına göz atabilirsiniz. Son olarak git diff --stat ile değişen dosya sayısını, git diff ile içeriği kontrol edin; Angular’da bir bileşenin template’i değiştiyse ilgili spec dosyasının da güncellendiğinden emin olun.
Birden fazla ajanı tek Angular projesinde çalıştırma: AgentVera
Angular projelerinde birden fazla ajanı paralel çalıştırmak isterseniz AgentVera masaüstü uygulaması, GitHub Copilot CLI dahil gerçek CLI araçlarını tek pencerede ayrı terminal panellerinde çalıştırır. Her ajan kendi git worktree’sinde ilerlediği için aynı dosyaları ezmez; bu, paralel refactor veya feature geliştirmede çakışmaları önler. Ajan bitince ikinci bir model kodu otomatik inceler ve bulguları file:line olarak gösterir; böylece Angular’a özgü hatalar (yanlış inject, eksik import) hızla yakalanır. Ayrıca checkpoint’ler sayesinde herhangi bir adım geri alınabilir; büyük refactor veya signal geçişlerinde hatalı bir değişikliği tek tıkla düzeltmeyi kolaylaştırır.
Sonuç
GitHub Copilot CLI, Angular projelerinde doğru talimatlar ve disiplinli bir döngüyle ciddi zaman kazandırır. Küçük adımlar, test çalıştırma ve diff inceleme alışkanlığını bırakmayın. Proje kurallarınızı net yazarsanız ajan, standalone component, DI, signals ve RxJS geçişlerinde Angular’ın kurallarına uyum sağlar. Komutları ve davranışı projenize göre şekillendirmek için CLAUDE.md nasıl yazılır? AGENTS.md ve GEMINI.md rehberi rehberini tekrar gözden geçirebilirsiniz; aynı prensipler GitHub Copilot CLI talimat dosyaları için de geçerlidir.