# opencode ile Angular projelerinde verimli çalışma rehberi

Adres: https://agentvera.dev/blog/opencode-ile-angular/ · Yayın: 2026-11-01

opencode’u Angular projelerinde nasıl kullanacağınızı öğrenin; AGENTS.md kurulumu, signal, RxJS, test ve paralel ajan çalışması ipuçları bu rehberde.

**Kısaca:**

- opencode, Angular proje klasöründe AGENTS.md talimatlarını okuyarak ng build, test ve lint komutlarını kendi başına çalıştırabilir.
- Standalone component, signal ve RxJS dönüşümlerinde küçük adımlarla ilerleyip diff’i incelemek hata riskini azaltır.
- Testleri ajanın çalıştırmasını sağlamak ve sonucu okumasına izin vermek, Angular’a özgü hataları hızlı çözer.

[opencode](/ajanlar/opencode/) Angular projelerinde doğrudan terminalde çalışan bir kodlama ajanıdır. Proje klasöründe `opencode` komutuyla başlattığınızda AGENTS.md dosyasındaki talimatları okur ve Angular CLI komutlarını, testleri ve lint’i çalıştırabilir. Aşağıda standalone component, signal, RxJS ve DI ağırlıklı bir Angular kod tabanında nasıl verimli kullanılacağını anlatıyorum.

## Neden opencode Angular işlerine uygun?
Angular projeleri kural ve yapı ağırlıklıdır: dosya isimleri, dekoratörler, DI, module yerine standalone importlar, test dosyaları. opencode terminalde yaşadığı için `ng generate`, `ng test`, `ng build` gibi komutları gerçekten çalıştırabilir ve TypeScript hatalarını okuyup düzeltebilir. Bu, yalnızca kod öneren bir asistan değil, projeyle etkileşime giren bir ajan olmasını sağlar. Angular’ın şablon ve sınıf arasındaki bağlamı koruması gerektiğinde, ajan dosya değişikliklerini kendisi yapıp derleyiciyi çalıştırarak doğrular. Özellikle signal geçişleri, RxJS zincirleri ve test güncellemeleri gibi mekanik ama dikkat gerektiren işlerde hız kazandırır. Daha fazla genel kullanım için [opencode nasıl kullanılır? Adım adım rehber](/blog/opencode-nasil-kullanilir/) sayfasına bakabilirsiniz.

## Projeyi ajana hazırlama
opencode’un Angular projenizde doğru kararlar vermesi için AGENTS.md dosyasını deponun köküne koyun. Bu dosyada build, test, lint komutları, klasör kuralları ve Angular’a özgü kısıtlar olsun. Ajan her oturumda bu dosyayı okur; ne kadar net olursa o kadar az düzeltme gerekir. Aşağıdaki örnek, standalone component ve signal kullanan bir proje için kısa ama yeterli bir başlangıç sunar.

```markdown
# AGENTS.md

## Komutlar
- Kurulum: `npm install`
- Geliştirme sunucusu: `ng serve`
- Build: `ng build --configuration production`
- Test: `ng test --watch=false`
- Lint: `ng lint`

## Klasör yapısı
- `src/app/features/` her özellik kendi klasöründe.
- `src/app/shared/` ortak component, pipe, directive'ler.
- `src/app/core/` servisler, guard'lar, interceptor'lar.

## Angular kuralları
- Yalnızca standalone component, directive ve pipe kullan.
- State için önce signal, karmaşık akışlarda RxJS kullan; ikisini gereksiz karıştırma.
- Component'lerde `changeDetection: ChangeDetectionStrategy.OnPush` varsayılan olsun.
- DI için constructor yerine `inject()` fonksiyonunu kullan.
- Tip güvenliğini bozan `any` kullanma; asla `@ts-ignore` ekleme.
- Yeni dosyalar Angular CLI ile üretilsin: `ng generate component ...` gibi.
- Testler mevcut çalıştırıcıya uygun olsun; her yeni özellik için birim testi güncelle.
```

Bu dosyayı kısa tutun; çelişen kurallar ajanı yavaşlatır.

## Çalışma döngüsü
opencode ile Angular’da tek seferde büyük refactor istemek yerine küçük adımlarla ilerleyin. Her adımda önce plan isteyin, sonra değişikliği yapmasını, ardından ilgili testleri çalıştırmasını ve en son diff’i incelemeniz için özetlemesini söyleyin. Bu döngü, template bağlamalarının bozulmasını ve DI hatalarını erken yakalar.

Aşağıdaki tablo tipik görevler için net prompt örneklerini gösterir:

| Görev | Sağlam opencode promptu |
|-------|------------------------|
| Mevcut bileşeni signal API’sine geçirmek | "ProductListComponent’i OnPush bırakarak signal tabanlı state’e çevir; product.service’teki BehaviorSubject yerine signal kullan, testleri güncelle ve `ng test --watch=false` çalıştır." |
| RxJS zincirini sadeleştirmek | "OrderService’teki getOrderDetails akışını switchMap ve catchError kullanacak şekilde yeniden düzenle; hata durumunda boş dizi dön, ilgili spec dosyasını güncelle." |
| Yeni standalone pipe eklemek | "CurrencyPipe’i saran ve locale göre kur simgesi ekleyen 'formatPrice' adında standalone pipe oluştur, ProductList template’inde kullan ve pipe için birim testi yaz." |
| Test hatasını çözmek | "Çalışan testlerden biri ExpressionChangedAfterItHasBeenChecked hatası veriyor; önce ilgili testi çalıştır, hatayı analiz et, sonra component veya testte düzeltmeyi öner." |

## Angular’da güçlü olduğu yerler ve dikkat edilecekler
opencode, Angular CLI komutlarını ve dosya üretimini iyi yönetir. Özellikle şu işlerde başarılıdır: standalone component veya pipe oluşturma, mevcut servisi `inject()` ile DI’a çevirme, RxJS pipe zincirlerini sadeleştirme, `@if` ve `@for` gibi yeni kontrol akışı sözdizimine geçiş, test dosyalarını güncelleme. Yine de her çıktıyı gözden geçirin. Angular’a özgü tuzaklar şunlardır:

- Ajan bazen standalone import eklemeyi unutabilir; component’i oluşturur ama `imports` dizisine yeni pipe veya directive’i eklemez, runtime’da şablon hatası alırsınız.
- Signal ve RxJS birlikte kullanılırken gereksiz `toSignal` veya `toObservable` dönüşümleri üretebilir; state kaynağını tek yerde tutmak daha iyidir.
- `OnPush` kullanırken ajan, mutable veri güncellemesi yaparsa view güncellenmez; bu yüzden signal veya yeni referans döndüren RxJS operator’lerini tercih etmesini isteyin.
- Testlerde async/await ile `fixture.whenStable()` veya `fakeAsync`/`tick` kullanımını karıştırabilir; hata mesajını ajanla paylaşarak düzeltmesini sağlayın.
- Angular sürümüne özgü API farkları önemlidir; ajan bazen yeni sözdizimini eski bir projeye uygulayabilir, bu yüzden `ng build` ve mevcut testler mutlaka çalıştırılmalıdır.

## Test ve doğrulama
opencode’a bir değişiklik yaptırdıktan sonra doğrulamayı hep ajan üzerinden yürütün. Şu sırayı izleyin: değişiklik sonrası `ng test --watch=false` çalıştırın, ardından `ng lint` ve `ng build --configuration production` komutlarını çalıştırmasını isteyin. Test çıktısındaki hataları ajan okusun ve kendi önerdiği düzeltmeyi uygulasın. Angular testleri çoğu zaman template bağlama hatalarını derleme aşamasında değil, test çalışırken ortaya çıkarır; bu yüzden yalnızca build yeterli olmaz. Karmaşık bir RxJS akışında test yazarken, ajanın `fakeAsync` ve `tick` kullanmasını isteyin ve `fixture.detectChanges()` çağrılarını açıkça belirtin. Böylece testler yalnızca çalışmakla kalmaz, gerçek davranışı doğrular. Ajan testin başarısız olduğu noktada durup çıktıyı analiz edebiliyorsa, hata çözüm süresi kısalır.

## AgentVera ile paralel Angular çalışması
Angular projelerinde birden fazla işi aynı anda yürütmek istiyorsanız AgentVera kullanışlıdır. Her ajan ayrı bir git worktree içinde çalışabildiği için biri signal geçişi yaparken diğeri form modülünü refactor edebilir ve dosyalar çakışmaz. Ajanın sırası bittiğinde ikinci bir model kod incelemesi yapar ve bulgular file:line olarak gösterilir; bu, Angular’a özgü kaçan import veya OnPush hatalarını yakalar. Checkpoint’ler sayesinde yanlış bir DI değişikliği tek tıkla geri alınabilir ve oturum adım adım tekrar izlenebilir. Token bütçeleri ise uzun refactor sırasında ajanın kontrolden çıkmasını engeller. Paralel ajan kurulumlarıyla ilgili daha fazla bilgi için [paralel kodlama ajanları için en iyi araçlar](/blog/paralel-yapay-zeka-kodlama-ajani-araclari/) sayfasına bakın.

## Sonuç
opencode’u Angular projenizde iyi bir AGENTS.md ile beslediğinizde; standalone component, signal, RxJS ve DI dönüşümlerini hızlı, test edilebilir adımlarla yöneten pratik bir terminal ajanına dönüşür. Önemli olan büyük refactor’ları küçük parçalara bölmek, testleri sürekli çalıştırmak ve Angular’a özgü tuzakları gözden geçirmektir. Bu disiplinle opencode, günlük Angular iş akışının doğal bir parçası olur.

## Sık sorulanlar

**opencode Angular projelerinde nasıl kullanılır?** Proje klasöründe terminalden opencode komutunu çalıştırın; ajan AGENTS.md dosyasını okur. Sonra yapmak istediğiniz değişikliği doğal dille yazın; örneğin bir bileşeni signal tabanlı hale getirmesini veya RxJS zincirini düzenlemesini isteyin.

**opencode Angular testlerini çalıştırabilir mi?** Evet, ng test --watch=false gibi Angular CLI komutlarını çalıştırabilir ve çıktıyı okuyup hataları analiz edebilir. Bu sayede test başarısızlıklarını kendi önerdiği düzeltmelerle giderebilir.

**opencode için AGENTS.md dosyasına neler yazılmalı?** Build, test, lint komutları, klasör yapısı ve Angular kuralları yazılmalıdır. Özellikle standalone component zorunluluğu, signal/RxJS tercihi, OnPush kullanımı ve inject() DI kuralı ajanın doğru kod üretmesini sağlar.

**opencode Angular’da signal ve RxJS dönüşümünde güvenilir midir?** Küçük adımlarla ve test doğrulamasıyla oldukça etkilidir; ancak gereksiz toSignal/toObservable dönüşümleri üretebilir. Bu yüzden state kaynağını tek yerde tutmasını isteyip diff’i incelemeniz önerilir.

---

**AgentVera hakkında.** AgentVera, Solviera Teknoloji tarafından geliştirilen macOS, Windows ve Linux masaüstü uygulamasıdır. 18 yapay zeka kodlama ajanını (Claude Code, Codex, Gemini CLI, Copilot, Cursor, Antigravity, opencode, Hermes, Qwen Code, Kimi Code, Kiro, Amp, Droid, Goose, Vibe, Crush, Aider, Cline) proje bazında, gerçek terminallerde ve kullanıcının kendi CLI kurulum ve girişleriyle yan yana çalıştırır. Ücretsiz planda sınırsız ajan vardır. İndir: https://agentvera.dev/indir/ · Fiyatlar: https://agentvera.dev/fiyatlar/