EXPLORING IONIC JAVASCRIPT BASICS, LAYOUTS, & NAVIGATION EĞİTİMİ

Ionic'te mantık, yerleşim ve gezinmeyi öğrenin

Ionic uygulamalarında JavaScript mantığı, ion-grid ile yerleşim ve router ile ekran gezinmesi

Exploring Ionic JavaScript Basics, Layouts, & Navigation Eğitimi, Ionic geliştirmenin üç temel direğini odağa alır: uygulama mantığı, yerleşim ve gezinme.

3 gün Temel Seviye Online / Yüz Yüze / Hibrit Sertifikalı

Eğitim Hakkında

Uygulama mantığından duyarlı yerleşime ve çok ekranlı gezinmeye Ionic temelleri

Exploring Ionic JavaScript Basics, Layouts, & Navigation Eğitimi, Ionic ile mobil uygulama geliştirmenin üç temel direğini odağa alır: uygulama mantığı, yerleşim ve gezinme. Katılımcılar Ionic sayfalarında JavaScript ve TypeScript ile veri ve olay yönetimini öğrenir. Program ion-grid ile duyarlı yerleşimi, ion-content yapısını ve bileşen dizilimini, ardından router ile çok ekranlı gezinmeyi, sekmeleri, parametre aktarımını ve sayfa yaşam döngüsü olaylarını kapsar.

Süre ve Format

3 Gün. Her gün dört modül; JavaScript mantığı, yerleşim ve gezinme çok ekranlı bir örnek uygulama üzerinde işlenir.

Seviye

Temel Seviye — Ionic uygulamalarında JavaScript temelleri, yerleşim sistemi ve ekranlar arası gezinme

Öğrenme Metodu

Çok ekranlı bir örnek uygulama üç gün boyunca geliştirilir; her modülde yeni bir mantık, yerleşim ya da gezinme konusu eklenir.

Neden Bu Eğitim?

🎯Sağlam temel

Uygulama mantığı, yerleşim ve gezinme gibi her Ionic projesinde gereken üç temel konuyu derinlemesine öğrenirsiniz.

🧩Duyarlı yerleşim

ion-grid ve esnek yerleşim araçlarıyla farklı ekran boyutlarına uyum sağlayan düzenli arayüzler kurmayı öğrenirsiniz.

🧭Çok ekranlı akış

Router, sekme ve parametre aktarımıyla kullanıcıyı ekranlar arasında akıcı biçimde yönlendiren bir uygulama kurarsınız.

Anahtar Konular

ionic javascript eğitimiionic layout eğitimiionic navigation kursuion-grid yerleşimionic router gezinmeionic sekme navigasyonhibrit mobil uygulamaionic temelleriduyarlı mobil tasarımionic geliştirme kursu
“Mantık, yerleşim ve gezinme bir araya geldiğinde uygulama akıcı bir deneyime dönüşür; bu eğitim o üçünü birlikte kurar.”

Ön Koşullar

Eğitimden verim almak için faydalı olacak bilgi ve ortam

1
Temel JavaScript

Değişken, fonksiyon, dizi ve olay gibi temel JavaScript kavramlarına aşinalık öğrenmeyi hızlandırır.

2
HTML ve CSS fikri

Etiketlerle sayfa kurma ve CSS ile stil verme konusunda genel bir fikir sahibi olmak faydalı olur.

3
Ionic temel aşinalık

Ionic ile basit bir proje açıp çalıştırmış olmak avantaj sağlar; temel kurulum eğitimde hatırlatılır.

4
Node.js ve ortam

Node.js, npm ve Ionic CLI kurulu ve proje çalıştırabilir bir geliştirme ortamı gereklidir.

Eğitim İçeriği

Programın gün gün akışı aşağıdadır. Bir güne tıklayarak o günün modüllerini ve içeriklerini görebilirsiniz.

Günün hedefiKatılımcı Ionic sayfalarında JavaScript ve TypeScript ile veri tutar, kullanıcı olaylarını yönetir, arayüze veri bağlar ve basit servislerle mantığı ayırmayı öğrenir.
Modül 1
Sayfa Mantığı ve TypeScript
  • Sayfa sınıfı ve bileşen mantığının kurulması
  • TypeScript ile değişken ve tip tanımı
  • Sayfa durumunun değişkenlerde tutulması
  • Fonksiyonlarla kullanıcı eylemi tanımlama
  • Dizi ve nesnelerle veri modelleme
  • Mantığın okunabilir biçimde düzenlenmesi
Modül 2
Veri Bağlama ve Gösterim
  • Değişkenlerin arayüzde gösterilmesi
  • Koşullu gösterim ile öğe gizleme
  • Liste verisini döngüyle ekrana yazma
  • Girdi alanının veriyle çift yönlü bağı
  • Hesaplanan değerlerin ekrana yansıması
  • Veri değişiminde arayüzün güncellenmesi
Modül 3
Olay Yönetimi ve Tepkiler
  • Buton tıklama olayının bağlanması
  • Girdi değişimi ve odak olayları
  • Olay nesnesinden değer ve veri okuma
  • Kaydırma ve dokunma olaylarına tepki
  • ion-refresher ile yenileme olayı
  • Olaylarla sayfa durumunu güncelleme
Modül 4
Servisler ve Veri Paylaşımı
  • Basit bir servis sınıfı oluşturma
  • Servisle ortak veri ve mantık paylaşımı
  • Sayfalar arası veriyi serviste tutma
  • HttpClient ile basit veri çekme girişi
  • Eşzamansız veri ve bekleme yönetimi
  • Mantığı sayfadan servise taşımanın yararı
Günün hedefiKatılımcı ion-content yapısını kavrar, ion-grid ile satır ve sütun yerleşimi kurar, esnek yerleşim araçlarını kullanır ve farklı ekranlara duyarlı tasarım yapar.
Modül 1
ion-content ve Sayfa Yapısı
  • ion-header, ion-content ve ion-footer düzeni
  • Kaydırılabilir içerik alanının kurulması
  • Sabit üst bar ve kayan içerik ayrımı
  • Padding ve fullscreen seçeneklerinin etkisi
  • ion-toolbar ile başlık ve eylem alanı
  • Güvenli alan ve çentik uyumunun sağlanması
Modül 2
ion-grid ile Izgara
  • ion-grid, ion-row ve ion-col yapısı
  • On iki sütunlu ızgara sisteminin mantığı
  • size ile sütun genişliği belirleme
  • Kırılma noktalarıyla duyarlı sütunlar
  • offset ile sütun kaydırma ve boşluk
  • Izgarayla kart ve içerik hizalama
Modül 3
Esnek Yerleşim Araçları
  • Flexbox yardımcı sınıflarının kullanımı
  • İçerik hizalama ve dağıtım ayarları
  • Dikey ve yatay ortalama teknikleri
  • Boşluk ve dolgu yardımcı sınıfları
  • Sarmalı yerleşimle öğelerin akışı
  • Yerleşim için doğru aracı seçme
Modül 4
Duyarlı Tasarım İlkeleri
  • Telefon ve tablet için farklı düzen
  • Kırılma noktalarına göre gösterim
  • Yön değişiminde yerleşimin uyumu
  • Göreli birimlerle ölçeklenebilir tasarım
  • Büyük ekranda içerik genişliği sınırlama
  • Tutarlı deneyim için tasarım ilkeleri
Günün hedefiKatılımcı router ile ekranlar arası gezinmeyi kurar, sekmeli yapıyı tasarlar, sayfalar arası parametre aktarır ve sayfa yaşam döngüsü olaylarını doğru kullanır.
Modül 1
Router ile Gezinme
  • Rota tanımı ve sayfa eşleştirmesi
  • routerLink ile sayfalar arası geçiş
  • Programatik olarak gezinme yapma
  • Geri gezinme ve yığın davranışı
  • Varsayılan ve yönlendirme rotaları
  • Bulunamayan sayfa rotası yönetimi
Modül 2
Sekmeli Gezinme Yapısı
  • ion-tabs ile sekmeli yapı kurulumu
  • Her sekmeye ayrı sayfa atanması
  • Sekme ikonu ve etiket tasarımı
  • Sekmeler arası durumun korunması
  • Sekme içinde ayrı gezinme yığını
  • Aktif sekmenin görsel olarak vurgusu
Modül 3
Parametre Aktarımı
  • Rota parametresiyle veri taşıma
  • Hedef sayfada parametreyi okuma
  • Sorgu parametreleriyle isteğe bağlı veri
  • Liste öğesinden detay sayfasına geçiş
  • Servisle büyük veriyi paylaşma tercihi
  • Parametre doğrulama ve güvenli kullanım
Modül 4
Sayfa Yaşam Döngüsü
  • ionViewWillEnter ile girişte hazırlık
  • ionViewDidEnter ile görünür anı yakalama
  • ionViewWillLeave ile çıkışta temizlik
  • Sayfa önbellekleme davranışının kavranması
  • Veriyi doğru yaşam döngüsü anında yükleme
  • Yaşam döngüsüyle performansı iyileştirme

Eğitim Kazanımları

Program sonunda katılımcılar:

✅
Sayfa mantığı

Ionic sayfalarında TypeScript ile veri tutar, kullanıcı eylemlerini fonksiyonlarla yönetir ve mantığı düzenli kurarsınız.

✅
Veri bağlama

Değişkenleri arayüzde gösterir, listeleri döngüyle yazar ve girdi alanlarını veriyle çift yönlü bağlayabilirsiniz.

✅
Olay yönetimi

Tıklama, girdi ve kaydırma gibi olayları bağlar ve bu olaylara göre sayfa durumunu doğru biçimde güncellersiniz.

✅
Servislerle paylaşım

Basit servislerle mantığı sayfadan ayırır, sayfalar arası ortak veri ve işlevleri temiz biçimde paylaşabilirsiniz.

✅
Izgara yerleşimi

ion-grid ile satır ve sütun yerleşimi kurar, kırılma noktalarıyla duyarlı ve hizalı düzenler tasarlayabilirsiniz.

✅
Duyarlı tasarım

Esnek yerleşim araçlarıyla telefon ve tablet için uyumlu, farklı yönlere ve ekranlara duyarlı arayüzler oluşturursunuz.

✅
Çok ekranlı gezinme

Router ve sekmelerle ekran akışı kurar, parametre aktarımıyla liste ve detay ekranları arasında geçiş sağlarsınız.

✅
Yaşam döngüsü

Sayfa yaşam döngüsü olaylarını kavrar, veriyi doğru anda yükleyerek daha akıcı ve verimli ekranlar tasarlarsınız.

Kimler İçin Uygundur?

  • Temel web ve JavaScript bilgisi olup Ionic uygulamalarında veri
  • yerleşim ve ekran akışını kurmayı öğrenmek isteyen web geliştiricileri
  • yeni başlayan mobil geliştiriciler
  • öğrenciler için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?
Temel web ve JavaScript bilgisi olup Ionic uygulamalarında veri, yerleşim ve ekran akışını kurmayı öğrenmek isteyen web geliştiricileri, yeni başlayan mobil geliştiriciler ve öğrenciler için uygundur. İleri düzey çerçeve bilgisi gerekmez; temeller eğitimde ele alınır.
Bu eğitim hangi konulara odaklanıyor?
Eğitim özellikle Ionic'te JavaScript ve TypeScript ile uygulama mantığı, ion-grid ve esnek araçlarla duyarlı yerleşim ve router ile çok ekranlı gezinme konularına odaklanır. Her Ionic projesinde gereken bu üç temel beceri çok ekranlı bir örnek uygulamada pekiştirilir.
Ionic framework fundamentals eğitiminden farkı nedir?
Fundamentals eğitimi hibrit kavramı, bileşen kütüphanesi, tema ve Capacitor girişine odaklanır. Bu eğitim ise uygulama mantığı, yerleşim sistemi ve gezinme üzerine derinleşir. İki eğitim birbirini tamamlar; bu program özellikle ekran akışı ve düzen kurmayı güçlendirir.
Eğitimin süresi ve formatı nedir?
Eğitim üç gün sürer ve her gün dört modülden oluşur. Çok ekranlı bir örnek uygulama üç gün boyunca adım adım geliştirilir. Yüz yüze veya online yapılabilir ve kurumun ihtiyaçlarına göre örnekler uyarlanabilir.
Eğitim sonunda sertifika veriliyor mu?
Programı tamamlayan katılımcılar Digital Vizyon Akademi Katılım ve Başarı Sertifikası alır. Sertifika tamamlanan modülleri ve geliştirilen örnek uygulamayı belgeler; eğitim yüz yüze veya online verilebilir ve kurumsal gruplara özel uyarlanabilir.

Sertifikalandırma

Bu eğitim Digital Vizyon Akademi Başarı Sertifikası ile tamamlanır.

Eğitim başında “Ön Test”, bitiminde “Son Test” uygulanarak gelişim ölçümlenir. Değerlendirme formunu dolduran katılımcılar sertifikalarını alır. Sertifikanızın geçerliliğini Sertifika Sorgulama sayfasından doğrulayabilirsiniz.

Örnek Sertifika d Digital Vizyon AKADEMİ KATILIM SERTİFİKASI Bu sertifika [Katılımcı Adı Soyadı] adlı katılımcının aşağıdaki eğitim programını başarıyla tamamladığını belgeler. Exploring Ionic JavaScript Basics, Layouts, & Navigation Eği Sertifika Kodu DV-2026XX00 Tarih 15.10.2026 Yetkili İmza DV AKADEMİ

Eğitim Bilgileri

Süre3 gün
SeviyeTemel Seviye
FormatOnline / Yüz Yüze / Hibrit
Sertifika✓ Var
Hemen Bilgi Al
İlgili Eğitimler

Bu Eğitimle Birlikte Tercih Edilenler

Çapraz Platform GeliştirmeReact ile Mobil Uygulama Geliştirme (React Native) Eğitimi
Mobil Uygulama Geliştirme Eğitimleri

React ile Mobil Uygulama Geliştirme (React Native) Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

React Native, hooks, React Navigation ve Redux Toolkit ile tek kod tabanından iOS ve Android uygulaması geliştirmeyi öğreten eğitim.

Detayları Gör →
Çapraz Platform Geliştirme.Net MAUI Eğitimi
Mobil Uygulama Geliştirme Eğitimleri

.Net MAUI Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

.NET MAUI, XAML, MVVM ve Shell ile tek projeden Android, iOS ve masaüstü uygulaması geliştirmeyi öğreten uygulamalı kurumsal eğitim.

Detayları Gör →
Çapraz Platform Geliştirme.NET MAUI Temel Kavramları Eğitimi
Mobil Uygulama Geliştirme Eğitimleri

.NET MAUI Temel Kavramları Eğitimi

3 günTemelOnline / Yüz Yüze / Hibrit

.NET MAUI proje yapısı, XAML, temel bileşenler ve veri bağlama ile ilk çapraz platform uygulamanızı geliştirmeyi öğreten temel eğitim.

Detayları Gör →
Çapraz Platform GeliştirmeAdvanced Features of Ionic JavaScript & CLI Eğitimi
Mobil Uygulama Geliştirme Eğitimleri

Advanced Features of Ionic JavaScript & CLI Eğitimi

5 günİleriOnline / Yüz Yüze / Hibrit

Gelişmiş Ionic CLI, Capacitor native entegrasyonu, Stencil bileşenleri, performans ve CI/CD ile üretim düzeyinde hibrit uygulama geliştirmeyi öğreten eğitim.

Detayları Gör →
Çapraz Platform GeliştirmeCross-Platform Solutions in Visual Studio Eğitimi
Mobil Uygulama Geliştirme Eğitimleri

Cross-Platform Solutions in Visual Studio Eğitimi

4 günOrtaOnline / Yüz Yüze / Hibrit

Visual Studio ve .NET MAUI ile tek projeden iOS ve Android uygulaması geliştirmeyi XAML, MVVM ve API erişimiyle öğreten uygulamalı kurumsal eğitim.

Detayları Gör →
Çapraz Platform GeliştirmeFundamentals of the Ionic Framework Eğitimi
Mobil Uygulama Geliştirme Eğitimleri

Fundamentals of the Ionic Framework Eğitimi

3 günTemelOnline / Yüz Yüze / Hibrit

Web teknolojileriyle Ionic çerçevesinin temellerini, bileşen kütüphanesini, tema sistemini ve Capacitor köprüsünü öğreten uygulamalı temel eğitim.

Detayları Gör →
+90 (501) 369 40 14 WhatsApp [email protected] LinkedIn