33 KiB

Raw Blame History Unescape Escape

Yeni Başlayanlar için Web Geliştirme - Bir Müfredat

Microsoft Bulut Savunucuları tarafından hazırlanan 12 haftalık kapsamlı kursumuzla web geliştirmeye dair temel bilgileri öğrenin. 24 dersin her biri terraryumlar, tarayıcı eklentileri ve uzay oyunları gibi pratik projelerle JavaScript, CSS ve HTML'i derinlemesine ele alır. Quizler, tartışmalar ve pratik ödevlerle etkileşim kurun. Becerilerinizi geliştirin ve etkili proje tabanlı pedagojimizle bilgi tutumunuzu optimize edin. Kodlama yolculuğunuza bugün başlayın!

Azure AI Foundry Discord Topluluğuna Katılın

Bu kaynakları kullanmaya başlamak için şu adımları izleyin:

Depoyu Çatallayın: Tıklayın
Depoyu Klonlayın: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Azure AI Foundry Discord'a Katılın ve uzmanlar ve diğer geliştiricilerle tanışın

🌐 Çok Dilli Destek

GitHub Action ile Desteklenir (Otomatik & Her Zaman Güncel)

Yerel Olarak Klonlamayı Tercih Ediyor musunuz?

Bu depo, indirilen dosya boyutunu önemli ölçüde artıran 50+ dil çevirisi içerir. Çeviri olmadan klonlamak için, sparse checkout kullanabilirsiniz:

Bash / macOS / Linux:
git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
CMD (Windows):
git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
Bu, kursu tamamlamak için ihtiyacınız olan her şeyi çok daha hızlı indirmenizi sağlar.

Desteklenmesini istediğiniz ek çeviri dilleri varsa, burada listelenmiştir

🧑‍🎓 Öğrenci misiniz?

Başlangıç kaynaklarını, Öğrenci paketlerini ve hatta ücretsiz sertifika kuponu almanın yollarını bulabileceğiniz Öğrenci Merkezi sayfasını ziyaret edin. İçerikleri aylık olarak değiştirdiğimiz için bu sayfayı yer imlerinize eklemenizi ve zaman zaman kontrol etmenizi öneririz.

📣 Duyuru - Tamamlanması gereken yeni GitHub Copilot Agent modu zorlukları!

Yeni bir zorluk eklendi, çoğu bölümde "GitHub Copilot Agent Challenge 🚀" arayın. Bu, GitHub Copilot ve Agent modu kullanarak tamamlayabileceğiniz yeni bir zorluk. Agent modunu daha önce kullanmadıysanız, sadece metin üretmekle kalmaz, aynı zamanda dosyalar oluşturabilir ve düzenleyebilir, komut çalıştırabilir ve daha fazlasını yapabilir.

📣 Duyuru - Generative AI kullanarak yeni Proje

Yeni AI Asistan projesi eklendi, inceleyin proje

📣 Duyuru - Generative AI için JavaScript Müfredatı yeni yayında

Yeni Generative AI müfredatımızı kaçırmayın!

Başlamak için ziyaret edin https://aka.ms/genai-js-course!

Temelden RAG’e kadar kapsamlı dersler.
Tarihi karakterlerle GenAI ve eşlik eden uygulamamız aracılığıyla etkileşim.
Eğlenceli ve sürükleyici anlatım, zamanda yolculuk yapacaksınız!

Her ders, tamamlama için bir ödev, bir bilgi kontrolü ve şu gibi konuları öğrenmenizde rehber olacak bir zorluk içerir:

İstek ve istek mühendisliği
Metin ve görüntü uygulama üretimi
Arama uygulamaları

Başlamak için ziyaret edin https://aka.ms/genai-js-course

🌱 Başlarken

Öğretmenler, bu müfredatı nasıl kullanacağınıza dair bazı önerilerimizi dahil ettik. Geri bildirimlerinizi tartışma forumumuzda bekleriz!

Öğrenciler, her ders için bir ön ders quiz'i ile başlayın, ardından ders materyalini okuyun, çeşitli etkinlikleri tamamlayın ve anlayışınızı ders sonrası quiz ile kontrol edin.

Öğrenme deneyiminizi geliştirmek için, projeler üzerinde beraber çalışmak üzere akranlarınızla bağlantı kurun! Tartışmalarımız tartışma forumumuzda teşvik edilir; moderatör ekibimiz sorularınızı yanıtlamak için hazırdır.

Eğitiminizi ilerletmek için ek çalışma materyalleri bulabileceğiniz Microsoft Learn’i keşfetmenizi şiddetle öneririz.

📋 Ortamınızı kurma

Bu müfredat için hazır bir geliştirme ortamı mevcut! Başlarken, müfredatı bir Codespace (tarayıcı tabanlı, kurulum gerektirmeyen bir ortam) içinde veya bilgisayarınızda bir metin düzenleyici kullanarak yerel olarak çalıştırmayı seçebilirsiniz, örneğin Visual Studio Code.

Depoyu oluşturun

Çalışmanızı kolayca kaydedebilmeniz için, bu deponun kendi kopyanızı oluşturmanız önerilir. Bunu yapmak için sayfanın üstündeki Use this template düğmesine tıklayın. Bu, GitHub hesabınızda müfredatın bir kopyası ile yeni bir depo oluşturacaktır.

Şu adımları izleyin:

Depoyu Çatallayın: Bu sayfanın sağ üst köşesindeki "Fork" butonuna tıklayın.
Depoyu Klonlayın: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Müfredatı Codespace içinde çalıştırma

Oluşturduğunuz bu deponun kopyasında, Code butonuna tıklayıp Open with Codespaces seçeneğini seçin. Bu, sizin için yeni bir Codespace oluşturacaktır.

Müfredatı bilgisayarınızda yerel olarak çalıştırma

Bu müfredatı bilgisayarınızda yerel olarak çalıştırmak için bir metin düzenleyici, bir tarayıcı ve bir komut satırı aracına ihtiyacınız olacak. İlk dersimiz, Programlama Dilleri ve Ticaret Araçlarına Giriş, her biri için çeşitli seçenekleri size tanıtacak, böylece size en uygun olanı seçebilirsiniz.

Bizim önerimiz Visual Studio Code editörünü kullanmanızdır; bu editörde yerleşik bir Terminal da mevcuttur. Visual Studio Code’u buradan indirebilirsiniz.

Depozitonuzu bilgisayarınıza klonlayın. Bunu Code butonuna tıklayıp URL'yi kopyalayarak yapabilirsiniz:

CodeSpace

Ardından, Visual Studio Code içinde Terminal uygulamasını açın ve aşağıdaki komutu, <your-repository-url> yerine az önce kopyaladığınız URL'yi yazarak çalıştırın:
```
git clone <your-repository-url>
```
Klasörü Visual Studio Code'da açın. Bunu File > Open Folder seçeneğine tıklayarak ve az önce klonladığınız klasörü seçerek yapabilirsiniz.

Önerilen Visual Studio Code uzantıları:

Live Server - Visual Studio Code içinde HTML sayfalarını önizlemek için

Copilot - kod yazmayı hızlandırmak için

📂 Her ders şunları içerir:

isteğe bağlı sketchnote (not çizimi)
isteğe bağlı ek video
dersten önce ısınma testi
yazılı ders
proje tabanlı dersler için, projeyi nasıl oluşturacağınıza dair adım adım rehberler
bilgi kontrolü
bir meydan okuma
ek okuma materyali
görev
dersten sonra quiz

Quizler hakkında not: Tüm quizler Quiz-app klasöründe bulunur, toplamda 48 quiz ve her biri 3 sorudan oluşmaktadır. Bunlara buradan erişilebilir; quiz uygulaması yerel olarak çalıştırılabilir veya Azure’a dağıtılabilir; quiz-app klasöründeki talimatları takip edin.

🗃️ Dersler

	Proje Adı	Öğretilen Kavramlar	Öğrenme Hedefleri	İlgili Ders	Yazar
01	Başlarken	Programlama ve Araçlarına Giriş	Çoğu programlama dilinin temel prensipleri ve profesyonel geliştiricilerin işlerini yapmalarına yardımcı olan yazılım hakkında bilgi edinin	Programlama Dilleri ve Araçlarına Giriş	Jasmine
02	Başlarken	GitHub Temelleri, takım çalışması	Projenizde GitHub’ı nasıl kullanacağınızı, kod tabanında başkalarıyla nasıl iş birliği yapacağınızı öğrenin	GitHub’a Giriş	Floor
03	Başlarken	Erişilebilirlik	Web erişilebilirliğinin temellerini öğrenin	Erişilebilirlik Temelleri	Christopher
04	JS Temelleri	JavaScript Veri Türleri	JavaScript veri türlerinin temellerini öğrenin	Veri Türleri	Jasmine
05	JS Temelleri	Fonksiyonlar ve Metotlar	Uygulamanın mantık akışını yönetmek için fonksiyonlar ve metotlar hakkında bilgi edinin	Fonksiyonlar ve Metotlar	Jasmine ve Christopher
06	JS Temelleri	JS ile Karar Verme	Kodunuzda karar yöntemlerini kullanarak koşullar nasıl oluşturulur öğrenin	Karar Verme	Jasmine
07	JS Temelleri	Diziler ve Döngüler	JavaScript’te diziler ve döngülerle veri işleme	Diziler ve Döngüler	Jasmine
08	Terrarium	HTML Uygulamada	Çevrimiçi bir terrarium oluşturmak için HTML yazın, düzen yaratmaya odaklanın	HTML’e Giriş	Jen
09	Terrarium	CSS Uygulamada	Çevrimiçi terrariumun stilini oluşturmak için CSS yazın, temel CSS ve sayfanın duyarlı hale getirilmesine odaklanın	CSS’e Giriş	Jen
10	Terrarium	JavaScript Closures, DOM Manipülasyonu	Sürükle/bırak arayüzü işlevleri için JavaScript yazın, closures ve DOM manipulasyonuna odaklanın	JavaScript Closures ve DOM Manipülasyonu	Jen
11	Yazma Oyunu	Yazma Oyunu Oluşturma	JavaScript uygulamanızı klavye olaylarıyla nasıl yönlendireceğinizi öğrenin	Olay Tabanlı Programlama	Christopher
12	Yeşil Tarayıcı Eklentisi	Tarayıcılarla Çalışma	Tarayıcıların nasıl çalıştığını, tarihini ve tarayıcı eklentisinin ilk öğelerini nasıl oluşturacağınızı öğrenin	Tarayıcılar Hakkında	Jen
13	Yeşil Tarayıcı Eklentisi	Form Oluşturma, API Çağrısı ve Yerel Depolamada Değişken	Tarayıcı eklentinizde yerel depolamada tutulan değişkenleri kullanan bir API çağrısı için JavaScript öğelerini oluşturun	API’lar, Formlar ve Yerel Depolama	Jen
14	Yeşil Tarayıcı Eklentisi	Tarayıcı arkaplan işlemleri, web performansı	Eklentinin simgesini yönetmek için tarayıcı arkaplan işlemlerini kullanın; web performansı ve bazı optimizasyonlar hakkında bilgi edinin	Arkaplan Görevleri ve Performans	Jen
15	Uzay Oyunu	JavaScript ile Daha Gelişmiş Oyun Geliştirme	Sınıflar ve Kompozisyon kullanarak Miras (Inheritance) ve Yayınla/Abone Ol (Pub/Sub) kalıplarını öğrenin, bir oyun geliştirmek için hazırlanın	Gelişmiş Oyun Geliştirmeye Giriş	Chris
16	Uzay Oyunu	Canvas’a Çizim	Ekrana öğe çizmek için kullanılan Canvas API'si hakkında bilgi edinin	Canvasa Çizim	Chris
17	Uzay Oyunu	Ekrandaki Öğeleri Hareket Ettirme	Öğelerin hareket kazanmasını kartezyen koordinatlar ve Canvas API kullanarak keşfedin	Öğeleri Hareket Ettirme	Chris
18	Uzay Oyunu	Çarpışma Algılama	Öğeleri çarpıştırın ve birbirlerine tuş vuruşlarıyla tepki vermelerini sağlayın; oyunun performansını korumak için cooldown fonksiyonu ekleyin	Çarpışma Algılama	Chris
19	Uzay Oyunu	Skoru Tutma	Oyun durumu ve performansına bağlı matematiksel hesaplamalar yapın	Skoru Tutma	Chris
20	Uzay Oyunu	Oyunu Bitirme ve Yeniden Başlatma	Oyunu bitirme ve yeniden başlatma hakkında bilgi edinin, kaynak temizleme ve değişkenleri sıfırlama dahil	Bitiş Koşulu	Chris
21	Bankacılık Uygulaması	Web Uygulamasında HTML Şablonları ve Yönlendirmeler	Çok sayfalı bir web sitesinin mimarisini yönlendirme ve HTML şablonları kullanarak nasıl oluşturacağınızı öğrenin	HTML Şablonları ve Yönlendirmeler	Yohan
22	Bankacılık Uygulaması	Giriş ve Kayıt Formu Oluşturma	Formlar oluşturma ve doğrulama süreçlerini öğrenin	Formlar	Yohan
23	Bankacılık Uygulaması	Veri Alma ve Kullanma Yöntemleri	Uygulamanızda verinin nasıl aktığını, nasıl alındığını, depolandığını ve imha edildiğini öğrenin	Veri	Yohan
24	Bankacılık Uygulaması	Durum Yönetimi Kavramları	Uygulamanızın durumu nasıl koruduğunu ve programatik olarak bunu nasıl yöneteceğinizi öğrenin	Durum Yönetimi	Yohan
25	Tarayıcı/VScode Kodu	VScode ile Çalışma	Bir kod editörü kullanmayı öğrenin	VScode Kod Editörü Kullanımı	Chris
26	AI Asistanları	AI ile Çalışma	Kendi AI asistanınızı nasıl oluşturabileceğinizi öğrenin	AI Asistan Projesi	Chris

🏫 Pedagoji

Müfredatımız iki temel pedagojik ilke göz önünde bulundurularak tasarlanmıştır:

proje tabanlı öğrenme
sık quiz uygulamaları

Program JavaScript, HTML ve CSS temel bilgilerini ve günümüz web geliştiricileri tarafından kullanılan en son araçlar ve teknikleri öğretir. Öğrenciler, yazma oyunu, sanal terrarium, çevre dostu tarayıcı uzantısı, space-invader tarzı oyun ve işletmeler için bankacılık uygulaması yaparak pratik deneyim kazanma fırsatı bulacaklar. Serinin sonunda öğrenciler web geliştirme konusunda sağlam bir anlayışa sahip olacaklar.

🎓 Bu müfredatın ilk birkaç dersini Microsoft Learn üzerinden bir Öğrenme Yolu olarak alabilirsiniz!

İçeriğin projelerle uyumlu olmasını sağlayarak süreç öğrenciler için daha ilgi çekici hale getirilir ve kavramların kalıcılığı artırılır. Ayrıca, JavaScript temellerini tanıtmak için birkaç başlangıç dersi yazdık ve “JavaScript’e Başlayanlar Serisi” video koleksiyonundan bazı videolarla eşleştirdik, bazı yazarlar bu müfredata katkıda bulundu.

Ayrıca, sınıftan önce yapılan düşük riskli bir quiz öğrencinin konu öğrenme niyetini belirlerken, sınıftan sonra yapılan ikinci quiz kalıcılığı sağlar. Bu müfredat esnek ve eğlenceli olacak şekilde tasarlanmıştır ve tamamen veya kısmen alınabilir. Projeler küçük başlar ve 12 haftalık döngünün sonunda giderek daha karmaşık hale gelir.

Amacımız, temel becerilere odaklanmak için JavaScript çerçevelerinden kaçınmak olsa da, bu müfredatı tamamlamak için bir sonraki iyi adım, başka bir video koleksiyonu aracılığıyla Node.js öğrenmek olacaktır: “Node.js’e Başlayanlar Serisi”.

Davranış Kurallarımız ve Katkıda Bulunma yönergelerimizi inceleyin. Yapıcı geri bildiriminizi bekliyoruz!

🧭 Çevrimdışı erişim

Bu dökümantasyonu çevrimdışı çalıştırmak için Docsify kullanabilirsiniz. Bu repoyu fork edin, yerel bilgisayarınıza Docsify kurulumunu yapın ve ardından bu repoda kök klasörde docsify serve komutunu çalıştırın. Web sitesi localhost’ta 3000 portunda çalışacaktır: localhost:3000.

📘 PDF

Tüm derslerin PDF'sine buradan ulaşabilirsiniz.

🎒 Diğer Kurslar

Ekibimiz başka kurslar da üretiyor! İnceleyin:

LangChain

Azure / Edge / MCP / Agents

Üretken AI Serisi

Temel Öğrenme

Copilot Serisi

Yardım Alma

Tıkanırsanız veya AI uygulamaları geliştirme konusunda herhangi bir sorunuz olursa MCP hakkında diğer öğrenenlerle ve deneyimli geliştiricilerle tartışmalara katılın. Soruların hoş karşılandığı ve bilginin özgürce paylaşıldığı destekleyici bir topluluktur.

Ürün geri bildirimi veya geliştirme sırasında oluşan hatalar için ziyaret edin:

Lisans

Bu depo MIT lisansı ile lisanslanmıştır. Daha fazla bilgi için LICENSE dosyasına bakınız.

Feragatname:
Bu belge, AI çeviri hizmeti Co-op Translator kullanılarak çevrilmiştir. Doğruluk için çaba göstersek de, otomatik çevirilerin hatalar veya yanlışlıklar içerebileceğini lütfen unutmayın. Orijinal belge, kendi ana dilinde yetkili kaynak olarak kabul edilmelidir. Kritik bilgiler için profesyonel insan çevirisi tavsiye edilir. Bu çevirinin kullanılması sonucu ortaya çıkabilecek yanlış anlamalar veya yorum hatalarından sorumlu değiliz.

33 KiB Raw Blame History Unescape Escape