Eğitim Programı

Web Tasarıma Giriş

• Web Tasarım nedir?
• Web Tasarım Tarihi ve Gelişimi
• Web Tasarımın Önemi ve Uygulama Alanları
• Internet ve World Wide Web Tarihçesi
• Domain Nedir? Nasıl Satın Alınır? Projeye Uygun Hosting Seçimi
• Hosting Nedir? Nasıl Alınır?
• FTP Nedir?
• Modern Web Tasarım Trendleri
• Front-end ve Back-end Farkları
• Front-end & Back-end Kullanım Alanları
• Web Sitesi Yapısını İnceleyim
• Web-Grafik Tasarım Araçları (Photoshop, Illustrator)
• Temel Prototipleme Araçları (Figma, Adobe XD)
• Web Geliştirme Ortamları (IDE) ve Editörler (VS Code, Note ++, Sublime Text)
• Proje Planlama ve İhtiyaç Analizi
• Kullanıcı Araştırması ve Hedef Kitle Analizi
• Web Projesi Yönetim Araçları (Jira, Trello, Asana)
• FrameWork Nedir? Front-end Frameworklerini İnceleyelim

UI, UX ve Web Tasarım

• UI (Kullanıcı Arayüzü) Nedir?
• Temel UI İlkeleri ve Bileşenleri
• Web Tasarımda Renk Teorisi ve Tipografi
• Web Tasarımda İkonografi ve Görsel Hiyerarşi
• UX Araştırma Yöntemleri
• Kullanıcı Persona ve Senaryoları
• Web Tasarımda Wireframe ve Prototipleme Araçları
• Kullanılabilirlik Testleri, Unit Test ve Geri Bildirim Alma
• Responsive Öncelikli Tasarım Prensipleri
• Medya Sorguları ve Breakpoint’ler
• Responsive Web Tasarım Uygulaması

HTML (Hypertext Markup Language)

• Temel HTML Etiketleri
• HTML Etiketi Anatomisi
• HTML ve HTML5 Farklılıkları
• HTML Sürümlerini Tanıyalım
• HTML Etiketleri Uygulaması
• Kod Editörleri ile Çalışmak
• Tarayıcı Geliştirici Kullanımı (Developer Tools)
• HTML5 Semantik Etiket Kullanımı
• Tek Sayfalık Web Sayfası Oluşturma
• İnternette Web Sitesi Yayınlama
• Dosya Transfer Yöntemleri (FTP)

CSS (Cascading Style Sheets)

• CSS Nedir?
• Yerel, Genel ve Harici CSS
• Temel CSS Özellikleri
• Web Sayfasına Stiller Eklemek
• HTML Etiketlerine Stil Verme ve Yönetme
• CSS Seçicileri ve Özellikleri
• CSS Basamaklandırma (Cascading)
• CSS Özelleştirme (Specification)
• CSS Kalıtsallaştırma (Inheritance)
• CSS Box Styles (Padding, Margin, Box-Sizing Kullanımı)
• CSS Renk ve Kenarlık Uygulamaları
• CSS Font Stilleri ve Metin Uygulamaları
• CSS Çocuk ve Torun Seçiciler (nth-child Kullanımı)
• CSS Display ve Position Özellikleri
• Gelişmiş CSS Teknikleri
• Tarayıcı Uyumlu CSS Yazımı (Cross-browser)
• CSS Flexbox ve Grid Layout Uygulamaları
• CSS Transition Özelliği
• CSS Animasyonlar ve Geçişler
• CSS Medya Sorguları ve Responsive Tasarım (Media Query Kullanımı)
• CSS Tasarım Trendleri
• Responsive Web Sitesi Kodlama
• Custom Properties
• Web Sitesi Projesi Hazırlama

Bootstrap Framework

• Bootstrap Framework Nedir? Ne İşe Yarar?
• Bootstrap Kurulumu ve Yapısı
• Grid Sistem ve Esnek Düzenler
• Temel Bileşenler (Butonlar, Kartlar, Modal vb.)
• Gelişmiş Bootstrap Kullanımı
• Bootstrap ile Responsive Tasarım
• Özelleştirilmiş Temalar ve CSS Entegrasyonu
• Bootstrap Formlar ve Doğrulama
• Bootstrap Framework ile Proje Geliştirme

JavaScript (JS)

• JavaScript Nedir ve Nasıl Kullanılır?
• Kullanım Alanları ve Uygulamalı Örnekler
• Web Sayfasına JavaScript Entegre Etme
• JavaScript Çıktı Yöntemleri
• HelloWorld Örneği
• Farklı Çıktı Yöntemleri ile HelloWorld Örneği
• Statements Nedir? JavaScript Statements Örnekleri
• Expression Nedir?
• Expression ve Statemens Arasındaki Farklar
• Javascript Değişken (Variable) Deklarasyonu
• Değişken (Variable) Başlatma
• JavaScript’in Tarihçesi ve Sürümleri
• NPM ve Babel ile Modern JavaScript Kullanımı
• JavaScript Değişken Tipleri (Primitive ve Referenced)
• Mutability ve Referenced Data Types
• Variable Scope (Lexical Scope)
• Scope Kavramı
• Lexical Scope
• JavaScript Dizileri (Arrays)
• Gelişmiş JavaScript Array Metotları
• JavaScript Objeleri (Objects)
• Gelişmiş Object Kullanımı
• JavaScript Fonksiyon Tanımlama ve Çağırma
• Fonksiyon Parametreleri ve Default Değerler
• Değer Döndürme ve Return
• Pure Functions
• Hoisting Kavramı
• JavaScript Koşullu İfade Kullanımı
• if, else, if else Yapıları
• Switch-case
• JavaScript Döngüler (for, while, do-while)
• For Döngüsü
• While ve do-while Döngüleri
• Document Object Model (DOM) ile Çalışma
• Dom Nedir? Dom Olayları ve Dinleyiciler
• JavaScript Modülleri (ES6 Modules)
• CommonJS ve AMD Modülleri
• Asenkron JavaScript (setInterval, setTimeout, Promises)
• Zamanlayıcı Fonksiyonlar
• Promises ile Asenkron Programlama
• Fetch API ile Veri Alımı ve Gönderimi
• Fetch API ile JSON İşleme
• Hata Yönetimi (Error Handling)
• JavaScript Hata Türleri
• Özel Hata Nesneleri Oluşturma
• Web Storage API
• Service Workers ve PWA (Progressive Web Apps)
• GraphQL ile Veri İşleme
• TypeScript ile JavaScript Geliştirme
• Web Sockets ile Gerçek Zamanlı İletişim

JQuery

• JQuery Nedir? Neden Kullanılır?
• JQuery Kurulumu ve Kullanımı
• JQuery Seçiciler
• JQuery Olay Yönetimi
• JQuery Animasyonlar ve Efektler
• Ajax ve Dinamik içerik Yükleme
• Ajax Nedir ve Neden Kullanılır?
• JQuery AJAX Metotları
• Dinamik İçerik Yükleme
• JQuery UI Bileşenleri
• JQuery UI Temalar ve Özelleştirme
• Popüler jQuery Eklentileri
• JQuery ile Proje Geliştirme Örnekleri
• JQuery ile Performans Optimizasyonu
• JQuery ve SEO Optimizasyonu
• JQuery ile Form Yönetimi
• JQuery ile Grafik ve Görselleştirme
• JQuery ve JSONP ile Çapraz Domain İstekleri
• “UI Tasarımda Responsive Design Konulu Workshop” – Cengiz Ceylan

Git

• Git ve Versiyon Kontrol Temelleri
• Git Kurulumu ve Yapılandırma
• Temel Git Komutları
• Depo (Repository) Yönetimi
• Gelişmiş Git Kullanımı
• Branch ve Merge İşlemleri
• GitHub ile Proje Yönetimi
• Git Workflow ve İş Akışları
• Çatışma (Conflict) Çözümü ve Geri Alma İşlemleri

React JS

• React Nedir? Neden Kullanılır?
• Kütüphaneleri ve Frameworklerin Karşılaştırılması
• React Kurulumu ve Yapılandırma
• Visual Studio Code ile React Geliştirme Ortamı Hazırlama
• React Komponentlerinin Temelleri
• JSX: JavaScript ve HTML Birleşimi
• React Bileşenleri ve Prop’ların Kullanımı
• Koşullu Render: Durumlara Göre İçerik Gösterme
• Liste Öğelerinin Render Edilmesi
• React Komponentlerinin Durum Yönetimi
• Uygulamalarınıza İnteraktivite Ekleme
• Komponent Hafızası ve Durum Yönetimi
• Render ve Commit Süreçleri
• Single Page Web Site Kodlaması ve Geliştirme

Angular JS

• Angular JS Nedir? Neden Kullanılır?
• Angular Kurulumu ve Yapılandırma
• Angular Bileşenler, Direktifler ve Filtreler
• Veri Bağlama ve Dependency Injection
• Router ve SPA Geliştirme
• Formlar ve Validasyon
• RxJS ve Reactive Programming
• Angular ile Proje Geliştirme Örnekleri

Kazanımlar

• Web Tasarım Temellerini Detaylı Öğrenip, Profesyonel Web Sitesi Geliştirirsiniz.
• Web Projesi Yönetim Araçlarını Öğrenirsiniz.
• UI ve UX Kavramlarının Web Tasarım ile Olan Bağını Öğrenirsiniz.
• Hazır Bir Prototipi Nasıl Koda Dökeceğinizi Öğrenirsiniz.
• Web’in Temeli HTML ve Stil Dökümanlarını Öğrenirsiniz.
• CSS ile İleri Seviye Stiller Yazabilirsiniz.
• Responsive Design Öğrenerek Desktop, Tablet ve Mobil Uyumlu Web Sayfaları Yapmayı Öğrenirsiniz.
• JavaScript ile İnteraktif Uygulamalar Geliştirebilirsiniz.
• Web Sitenizi HTML ile Yapabilir, CSS ile Görsel Stillerini Verebilir, JavaScript ile Dinamik Hale Getirebilirsiniz.
• SEO Uyumlu Kod Yazmayı ve Uygulamayı Öğrenirsiniz.
• Versiyon Kontrol Temellerini Öğrenirsiniz.
• Kalabalık Ekipler ile Uyum Halinde Çalışmayı Öğrenirsiniz.
• Popüler Front-end Yazılımlarını Uygulamalı Olarak Öğrenirsiniz.
• Web Tasarım Uygulamaları Yapabilir, Front-end Yazılım Geliştirme Alanında Çalışabilirsiniz.
• Mevcut Bir Web Sitesi Projesinin Kodunu Okuyabilir, Sayfaları Revize Edebilirsiniz.
• Front-end Geliştirme Teknolojilerine Hakim Olursunuz.
• Front-end ve Back-end Kavramlarını Öğrenir, 2 Disiplin Arasındaki Farkları Uygulamalarla Öğrenirsiniz.
• Web Tasarım Araçları ile Çalışabilir, Optimizasyonları Kullanabilirsiniz.
• React JS ve Angular JS ile
• Popüler Yazılım Dillerinin Kullanımı ve Fonksiyonları Hakkında Fikir Sahibi Olursunuz.

Kimler Katılabilir?

• Grafik tasarım ve web tasarım alanlarına ilgisi olan ve kariyerini bu alanlarda geliştirmek isteyen marka ve sayfa sahipleri, tasarımcılar, yazılımcılar, arayüz tasarımcıları, proje yöneticileri, ürün yöneticileri, girişimciler, araştırmacılar, reklamcılar ve yazılım alanında kariyer yapma planı olanlar. Katılım için herhangi bir ön program bilgisine ihtiyaç yoktur.

Ders Kayıtları ve Materyaller

Eğitimler Zoom üzerinden gerçekleşir ve tüm dersler kayda alınır. Katılımcılar eğitimlerinin bitiminden 90 gün sonrasına kadar video kayıtlarını öğrenci panelinden izleyebilirler. Aynı zamanda katılımcıların eğitim sürecini desteklemek adına ekstra materyaller de paylaşılmaktadır.

Sertifika

Eğitim programının sonunda katılımcılar 169 ülkede geçerli olan uluslararası sertifika almaya hak kazanırlar. Sertifikalar İngilizce ve Türkçe dilinde düzenlenir. Sertifikalarınız Linkedin ve sosyal medya mecraları ile uyumludur ve dijitalde görüntülenip paylaşılabilir. Üzerindeki QR kod ile Ulusal Sertifika Merkezinde sorgulanıp doğrulanabilir. Aşağıdaki görsel örnek niteliğindedir. Kişiye özeldir, basılamaz, çoğaltılamaz.

Sertifika Koşulları

• Programa en az %80 oranında katılım sağlamak.
• Sınıf içi yapılan ortak çalışmalara dahil olmak ve projeleri tamamlamak.
• Not:Kontenjan sınırlıdır.

Bilgi ve Kayıt için0 212 259 55 05arayabilir, 
0532 659 02 88 WhatsApp Destek hattımıza yazabilirsiniz.