{"id":50959409,"url":"https://github.com/poyrazavsever/poyraz-angular-journey","last_synced_at":"2026-06-18T11:33:08.483Z","repository":{"id":327652154,"uuid":"1110182907","full_name":"poyrazavsever/poyraz-angular-journey","owner":"poyrazavsever","description":"A curated collection of notes, mini tasks, and real-world projects documenting my journey of learning Angular from zero to production level.","archived":false,"fork":false,"pushed_at":"2026-02-07T21:40:29.000Z","size":3944,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2026-02-08T05:55:27.385Z","etag":null,"topics":["angular","angular-components","angular-learning","angular-projects","angular-routing","angular-services","angular-tutorial","dev-notes","frontend","learning-journey","rxjs","study-notes","typescript","web-development"],"latest_commit_sha":null,"homepage":"","language":"MDX","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/poyrazavsever.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-12-04T20:37:44.000Z","updated_at":"2026-02-07T21:40:33.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/poyrazavsever/poyraz-angular-journey","commit_stats":null,"previous_names":["poyrazavsever/poyraz-angular-journey"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/poyrazavsever/poyraz-angular-journey","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poyrazavsever%2Fpoyraz-angular-journey","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poyrazavsever%2Fpoyraz-angular-journey/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poyrazavsever%2Fpoyraz-angular-journey/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poyrazavsever%2Fpoyraz-angular-journey/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/poyrazavsever","download_url":"https://codeload.github.com/poyrazavsever/poyraz-angular-journey/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/poyrazavsever%2Fpoyraz-angular-journey/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34489169,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-18T02:00:06.871Z","response_time":128,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","angular-components","angular-learning","angular-projects","angular-routing","angular-services","angular-tutorial","dev-notes","frontend","learning-journey","rxjs","study-notes","typescript","web-development"],"created_at":"2026-06-18T11:33:07.617Z","updated_at":"2026-06-18T11:33:08.352Z","avatar_url":"https://github.com/poyrazavsever.png","language":"MDX","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"./public/logo.png\" alt=\"Angular Logo\" width=\"200\"/\u003e\n  \n  # Angular Öğrenme Günlüğü\n  \n  \u003cp\u003eBu repository, Angular öğrenme sürecimde tuttuğum notları, yaptığım uygulamaları ve öğrendiğim konuları içerir.\u003c/p\u003e\n  \n  [![Angular](https://img.shields.io/badge/Angular-DD0031?style=for-the-badge\u0026logo=angular\u0026logoColor=white)](https://angular.io/)\n  [![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge\u0026logo=typescript\u0026logoColor=white)](https://www.typescriptlang.org/)\n  [![Node.js](https://img.shields.io/badge/Node.js-43853D?style=for-the-badge\u0026logo=node.js\u0026logoColor=white)](https://nodejs.org/)\n\u003c/div\u003e\n\n---\n\n## İçindekiler\n\n- [Proje Hakkında](#proje-hakkında)\n- [Klasör Yapısı](#klasör-yapısı)\n- [Öğrenme Yol Haritası](#öğrenme-yol-haritası)\n- [Başlangıç](#başlangıç)\n- [Konu Başlıkları](#konu-başlıkları)\n  - [00 - Roadmap](#00---roadmap)\n  - [01 - Temel Konular](#01---temel-konular)\n  - [02 - Components](#02---components)\n  - [03 - Services \u0026 Dependency Injection](#03---services--dependency-injection)\n  - [04 - Routing](#04---routing)\n  - [05 - Forms](#05---forms)\n- [Gereksinimler](#gereksinimler)\n- [Kurulum](#kurulum)\n- [Katkıda Bulunma](#katkıda-bulunma)\n- [İletişim](#iletişim)\n\n---\n\n## Proje Hakkında\n\nBu repository, Angular framework'ünü sıfırdan öğrenme sürecimde tuttuğum kişisel bir öğrenme günlüğüdür. Her konu için detaylı notlar aldım ve pratik yapmak için küçük uygulamalar geliştirdim.\n\n**Amaç:**\n\n- Angular'ın temel ve ileri seviye özelliklerini öğrenmek\n- Her konu için anlaşılır notlar ve örnekler oluşturmak\n- Öğrenilen konuları pratik uygulamalarla pekiştirmek\n- İleride referans olarak kullanılabilecek bir kaynak oluşturmak\n\n**Kitlesi:**\n\n- Angular öğrenmeye yeni başlayanlar\n- Konuları tekrar etmek isteyenler\n- Hızlıca Angular kavramlarına göz atmak isteyenler\n\n---\n\n## Klasör Yapısı\n\n```\nangular-learning/\n├── 00 - roadmap/              # Angular öğrenme yol haritası\n├── 01 - basics/               # Temel kavramlar ve ilk uygulama\n│   ├── 00 - spa.mdx          # Single Page Application kavramı\n│   ├── 01 - typescript.mdx   # TypeScript temelleri\n│   ├── 02 - node.mdx         # Node.js ve npm\n│   ├── 03 - angular.mdx      # Angular'a giriş\n│   ├── 04 - binding.mdx      # Data binding türleri\n│   └── first-app/            # İlk Angular uygulaması\n├── 02-components/             # Component yapısı ve kullanımı\n├── 03-services-di/            # Services ve Dependency Injection\n├── 04-routing/                # Angular Routing\n├── 05-forms/                  # Template-driven ve Reactive Forms\n└── public/                    # Statik dosyalar (görseller vb.)\n```\n\n---\n\n## Öğrenme Yol Haritası\n\nBu repository, aşağıdaki öğrenme yol haritasını takip eder:\n\n1. **Temel Kavramlar** - Web geliştirme ve Angular'a hazırlık\n2. **Angular Temelleri** - Framework'e giriş ve ilk uygulama\n3. **Components** - Bileşen tabanlı mimari\n4. **Services \u0026 DI** - Servisler ve bağımlılık enjeksiyonu\n5. **Routing** - Sayfa yönlendirme ve navigasyon\n6. **Forms** - Kullanıcı form işlemleri\n\n---\n\n## Başlangıç\n\nBu repository'deki notları ve uygulamaları incelemek için aşağıdaki adımları takip edebilirsiniz.\n\n### Gereksinimler\n\n- **Node.js** (v18 veya üzeri)\n- **npm** (v9 veya üzeri)\n- **Angular CLI** (v18 veya üzeri)\n- Bir kod editörü (VS Code önerilir)\n\n### Kurulum\n\n1. Repository'yi klonlayın:\n\n```bash\ngit clone https://github.com/poyrazavsever/poyraz-angular-journey.git\ncd angular-learning\n```\n\n2. Angular CLI'yi global olarak yükleyin (eğer yüklü değilse):\n\n```bash\nnpm install -g @angular/cli\n```\n\n3. Herhangi bir projeye gitmek için:\n\n```bash\ncd \"01 - basics/first-app\"\nnpm install\nng serve\n```\n\n4. Uygulamayı tarayıcıda açın:\n\n```\nhttp://localhost:4200\n```\n\n---\n\n## Konu Başlıkları\n\n### 00 - Roadmap\n\nAngular öğrenme sürecinde takip edilecek yol haritası ve planlama.\n\n**İçerik:**\n\n- Öğrenme planı\n- Hedefler ve kilometre taşları\n- Kaynak önerileri\n\n---\n\n### 01 - Temel Konular\n\nAngular'a başlamadan önce bilmesi gereken temel kavramlar ve ilk uygulama.\n\n**İçerik:**\n\n#### SPA (Single Page Application)\n\n- SPA nedir ve nasıl çalışır?\n- Geleneksel web uygulamaları ile farkları\n- Avantajları ve dezavantajları\n\n#### TypeScript\n\n- TypeScript'e giriş\n- JavaScript'ten farkları\n- Tip sistemleri ve arayüzler\n- Modern JavaScript özellikleri\n\n#### Node.js \u0026 npm\n\n- Node.js nedir?\n- npm paket yöneticisi\n- package.json yapısı\n- Bağımlılık yönetimi\n\n#### Angular\n\n- Angular nedir?\n- Angular CLI kurulumu\n- İlk Angular projesi oluşturma\n- Proje yapısı ve dosyalar\n\n#### Data Binding\n\n- Binding türleri:\n  - **Interpolation** - Veriyi şablonda gösterme\n  - **Property Binding** - HTML özelliklerine veri bağlama\n  - **Event Binding** - Kullanıcı olaylarını yakalama\n  - **Two-Way Binding** - Çift yönlü veri bağlama\n\n**Proje:**\n\n- `first-app/` - İlk Angular uygulaması\n  - Component yapısı\n  - Data binding örnekleri\n  - Basit navigasyon\n\n---\n\n### 02 - Components\n\nAngular'ın temel yapı taşı olan component'ler.\n\n**Planlanmış İçerik:**\n\n- Component oluşturma ve kullanma\n- Component lifecycle hooks\n- Component iletişimi (Input/Output)\n- ViewChild ve ContentChild\n- Dynamic components\n\n---\n\n### 03 - Services \u0026 Dependency Injection\n\nUygulama mantığını paylaşmak ve yönetmek için servisler.\n\n**Planlanmış İçerik:**\n\n- Service nedir?\n- Dependency Injection kavramı\n- Service oluşturma ve kullanma\n- Providerslar ve scope'lar\n- HTTP servisleri\n\n---\n\n### 04 - Routing\n\nAngular uygulamalarında sayfa yönlendirme.\n\n**Planlanmış İçerik:**\n\n- Router yapılandırması\n- Route parametreleri\n- Child routes\n- Route guards\n- Lazy loading\n\n---\n\n### 05 - Forms\n\nKullanıcı girişlerini yönetme.\n\n**Planlanmış İçerik:**\n\n- Template-driven forms\n- Reactive forms\n- Form validasyonu\n- Custom validators\n- Dynamic forms\n\n---\n\n## Notlar Hakkında\n\nTüm notlar `.mdx` formatında yazılmıştır ve aşağıdaki yapıya sahiptir:\n\n```mdx\n---\ntitle: \"Konu Başlığı\"\ndescription: \"Konu açıklaması\"\ndate: \"2025-12-05\"\nauthor: \"Poyraz Avsever\"\nlevel: \"beginner|intermediate|advanced\"\ncategory: \"Kategori\"\ntags:\n  - etiket1\n  - etiket2\n---\n\n### İçerik\n\n...\n```\n\nBu yapı sayesinde notlar:\n\n- Organize ve düzenli\n- Kolayca filtrelenebilir\n- Tarihsel olarak takip edilebilir\n- Seviye bazında gruplanabilir\n\n---\n\n## Katkıda Bulunma\n\nBu bir kişisel öğrenme repository'si olsa da, önerilerinize ve katkılarınıza açığım!\n\n1. Hata bildirimi için issue açabilirsiniz\n2. Düzeltme önerileri için pull request gönderebilirsiniz\n3. Yeni konu önerileri sunabilirsiniz\n\n**Dikkat:** Lütfen katkılarınızda şu kurallara uyun:\n\n- Türkçe dil kurallarına dikkat edin\n- Kod örneklerini test edin\n- Anlaşılır ve açıklayıcı olun\n- Mevcut yapıyı koruyun\n\n---\n\n## İletişim\n\n**Yazar:** Poyraz Avsever\n\n- GitHub: [@poyrazavsever](https://github.com/poyrazavsever)\n- Repository: [poyraz-angular-journey](https://github.com/poyrazavsever/poyraz-angular-journey)\n\n---\n\n\u003cdiv align=\"center\"\u003e\n  \u003cp\u003eBu repository ile birlikte Angular öğrenme yolculuğuma devam ediyorum!\u003c/p\u003e\n  \u003cp\u003eBaşarılı kodlamalar!\u003c/p\u003e\n\u003c/div\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpoyrazavsever%2Fpoyraz-angular-journey","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpoyrazavsever%2Fpoyraz-angular-journey","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpoyrazavsever%2Fpoyraz-angular-journey/lists"}