|
|
1 month ago | |
|---|---|---|
| .. | ||
| 1-getting-started-lessons | 1 month ago | |
| 2-js-basics | 1 month ago | |
| 3-terrarium | 1 month ago | |
| 4-typing-game | 1 month ago | |
| 5-browser-extension | 1 month ago | |
| 6-space-game | 1 month ago | |
| 7-bank-project | 1 month ago | |
| 8-code-editor/1-using-a-code-editor | 1 month ago | |
| 9-chat-project | 1 month ago | |
| 10-ai-framework-project | 1 month ago | |
| Git-Basics | 2 months ago | |
| docs | 3 months ago | |
| lesson-template | 3 months ago | |
| memory-game | 2 months ago | |
| quiz-app | 3 months ago | |
| AGENTS.md | 2 months ago | |
| CODE_OF_CONDUCT.md | 3 months ago | |
| CONTRIBUTING.md | 3 months ago | |
| README.md | 1 month ago | |
| SECURITY.md | 3 months ago | |
| SUPPORT.md | 3 months ago | |
| _404.md | 3 months ago | |
| for-teachers.md | 2 months ago | |
README.md
Yeni Başlayanlar için Web Geliştirme - Bir Müfredat
Microsoft Cloud Advocates tarafından hazırlanan 12 haftalık kapsamlı kursumuzla web geliştirme temellerini öğrenin. 24 dersin her biri, teraryumlar, tarayıcı eklentileri ve uzay oyunları gibi uygulamalı projeler aracılığıyla JavaScript, CSS ve HTML konularına dalıyor. Testler, tartışmalar ve pratik ödevlerle etkileşimde bulunun. Becerilerinizi geliştirin ve etkili proje tabanlı pedagojimizle bilgi birikiminizi 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:
bağlantısına 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 uzmanlarla ve diğer geliştiricilerle tanışın
🌐 Çok Dilli Destek
GitHub Action ile desteklenmektedir (Otomatik ve Her Zaman Güncel)
Arabic | Bengali | Bulgarian | Burmese (Myanmar) | Chinese (Simplified) | Chinese (Traditional, Hong Kong) | Chinese (Traditional, Macau) | Chinese (Traditional, Taiwan) | Croatian | Czech | Danish | Dutch | Estonian | Finnish | French | German | Greek | Hebrew | Hindi | Hungarian | Indonesian | Italian | Japanese | Korean | Lithuanian | Malay | Marathi | Nepali | Norwegian | Persian (Farsi) | Polish | Portuguese (Brazil) | Portuguese (Portugal) | Punjabi (Gurmukhi) | Romanian | Russian | Serbian (Cyrillic) | Slovak | Slovenian | Spanish | Swahili | Swedish | Tagalog (Filipino) | Tamil | Thai | Turkish | Ukrainian | Urdu | Vietnamese
Ek dil çevirileri eklemek isterseniz, desteklenen diller burada listelenmiştir.
🧑🎓 Öğrenci misiniz?
Öğrenci Merkezi sayfasını ziyaret edin; burada başlangıç kaynakları, öğrenci paketleri ve hatta ücretsiz sertifika kuponu alma yollarını bulabilirsiniz. Bu sayfayı yer imlerine ekleyin ve içeriğin aylık olarak değiştiği için zaman zaman kontrol edin.
📣 Duyuru - Tamamlanacak Yeni GitHub Copilot Agent modu zorlukları!
Yeni bir zorluk eklendi, çoğu bölümde "GitHub Copilot Agent Challenge 🚀" başlığını arayın. Bu, GitHub Copilot ve Agent modunu kullanarak tamamlamanız için yeni bir zorluk. Daha önce Agent modunu kullanmadıysanız, bu mod yalnızca metin oluşturmakla kalmaz, aynı zamanda dosyalar oluşturabilir ve düzenleyebilir, komutlar çalıştırabilir ve daha fazlasını yapabilir.
📣 Duyuru - Yeni Proje Generative AI kullanarak oluşturulacak
Yeni AI Asistan projesi eklendi, projeye göz atın.
📣 Duyuru - Yeni Müfredat JavaScript için Generative AI hakkında yayınlandı
Yeni Generative AI müfredatımızı kaçırmayın!
Başlamak için https://aka.ms/genai-js-course adresini ziyaret edin!
- Temellerden RAG'ye kadar her şeyi kapsayan dersler.
- GenAI ve yardımcı uygulamamızla tarihi karakterlerle etkileşimde bulunun.
- Eğlenceli ve ilgi çekici bir anlatım, zamanda yolculuk yapacaksınız!
Her ders, tamamlanacak bir ödev, bilgi kontrolü ve aşağıdaki konuları öğrenmenize rehberlik edecek bir zorluk içerir:
- İstek oluşturma ve istek mühendisliği
- Metin ve görsel uygulama oluşturma
- Arama uygulamaları
Başlamak için https://aka.ms/genai-js-course adresini ziyaret edin!
🌱 Başlarken
Öğretmenler, bu müfredatı nasıl kullanabileceğinizle ilgili bazı öneriler ekledik. Geri bildirimlerinizi tartışma forumumuzda duymaktan mutluluk duyarız!
Öğrenciler, her ders için bir ön ders sınavı ile başlayın ve ders materyalini okuyarak, çeşitli etkinlikleri tamamlayarak ve ders sonrası sınavla anlayışınızı kontrol ederek devam edin.
Öğrenme deneyiminizi geliştirmek için projeler üzerinde birlikte çalışmak üzere arkadaşlarınızla bağlantı kurun! Tartışmalar, tartışma forumumuzda teşvik edilir; burada moderatör ekibimiz sorularınızı yanıtlamak için hazır olacaktır.
Eğitiminizi daha da ileriye taşımak için Microsoft Learn adresini ziyaret ederek ek çalışma materyallerini keşfetmenizi şiddetle tavsiye ederiz.
📋 Ortamınızı Ayarlama
Bu müfredat, kullanıma hazır bir geliştirme ortamına sahiptir! Başlarken, müfredatı Codespace (tarayıcı tabanlı, kurulum gerektirmeyen bir ortam) veya Visual Studio Code gibi bir metin editörü kullanarak bilgisayarınızda yerel olarak çalıştırmayı seçebilirsiniz.
Depo oluşturun
Çalışmanızı kolayca kaydedebilmeniz için bu depodan kendi kopyanızı oluşturmanız önerilir. Bunu, sayfanın üst kısmındaki Bu şablonu kullan düğmesine tıklayarak yapabilirsiniz. Bu, GitHub hesabınızda müfredatın bir kopyasıyla yeni bir depo oluşturacaktır.
Şu adımları izleyin:
- Depoyu Çatallayın: Bu sayfanın sağ üst köşesindeki "Fork" düğmesine tıklayın.
- Depoyu Klonlayın:
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Müfredatı Codespace'te çalıştırma
Oluşturduğunuz bu depo kopyasında, Kod düğmesine tıklayın ve Codespaces ile Aç seçeneğini seçin. Bu, çalışmanız 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 editörüne, bir tarayıcıya ve bir komut satırı aracına ihtiyacınız olacak. İlk dersimiz, Programlama Dillerine ve Ticaret Araçlarına Giriş, bu araçların her biri için en uygun olanı seçmenize yardımcı olacaktır.
Önerimiz, Visual Studio Code adlı editörü kullanmanızdır; bu editör aynı zamanda yerleşik bir Terminal içerir. Visual Studio Code'u buradan indirebilirsiniz.
-
Depoyu bilgisayarınıza klonlayın. Bunu, Kod düğmesine tıklayıp URL'yi kopyalayarak yapabilirsiniz:
Ardından, Visual Studio Code içindeki Terminali açın ve az önce kopyaladığınız URL'yi
<your-repository-url>ile değiştirerek aşağıdaki komutu çalıştırın:git clone <your-repository-url> -
Klasörü Visual Studio Code'da açın. Bunu, Dosya > Klasör Aç seçeneğine tıklayarak ve az önce klonladığınız klasörü seçerek yapabilirsiniz.
Önerilen Visual Studio Code eklentileri:
- Live Server - HTML sayfalarını Visual Studio Code içinde önizlemek için
- Copilot - kod yazmayı hızlandırmanıza yardımcı olmak için
📂 Her ders şunları içerir:
- isteğe bağlı çizim notları
- isteğe bağlı ek video
- ders öncesi ısınma testi
- yazılı ders
- proje tabanlı dersler için, projeyi nasıl oluşturacağınızı adım adım anlatan rehberler
- bilgi kontrolü
- bir meydan okuma
- ek okumalar
- ödev
- ders sonrası test
Testler hakkında bir not: Tüm testler Quiz-app klasöründe yer alır, her biri üç sorudan oluşan toplam 48 test bulunmaktadır. Testlere buradan ulaşabilirsiniz. Test uygulaması yerel olarak çalıştırılabilir veya Azure'a dağıtılabilir;
quiz-appklasöründeki talimatları takip edin.
🗃️ Dersler
| Proje Adı | Öğretilen Kavramlar | Öğrenme Hedefleri | Bağlantılı Ders | Yazar | |
|---|---|---|---|---|---|
| 01 | Başlangıç | Programlamaya Giriş ve Kullanılan Araçlar | Çoğu programlama dilinin temel prensiplerini ve profesyonel geliştiricilerin işlerini yapmalarına yardımcı olan yazılımları öğrenin | Programlama Dillerine ve Araçlarına Giriş | Jasmine |
| 02 | Başlangıç | GitHub Temelleri, ekip çalışması dahil | Projenizde GitHub'ı nasıl kullanacağınızı, bir kod tabanında başkalarıyla nasıl iş birliği yapacağınızı öğrenin | GitHub'a Giriş | Floor |
| 03 | Başlangıç | 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 | Bir 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 verme yöntemlerini kullanarak koşullar oluşturmayı öğrenin | Karar Verme | Jasmine |
| 07 | JS Temelleri | Diziler ve Döngüler | JavaScript'te diziler ve döngüler kullanarak veriyle çalışın | Diziler ve Döngüler | Jasmine |
| 08 | Terrarium | HTML Uygulamada | Çevrimiçi bir terrarium oluşturmak için HTML yapısını oluşturun, düzen oluşturmaya odaklanın | HTML'ye Giriş | Jen |
| 09 | Terrarium | CSS Uygulamada | Çevrimiçi terrarium'u stilize etmek için CSS oluşturun, CSS'in temellerine ve sayfayı duyarlı hale getirmeye odaklanın | CSS'ye Giriş | Jen |
| 10 | Terrarium | JavaScript Kapsamlar, DOM Manipülasyonu | Terrarium'u bir sürükle/bırak arayüzü olarak çalıştırmak için JavaScript oluşturun, kapsamlara ve DOM manipülasyonuna odaklanın | JavaScript Kapsamlar, DOM Manipülasyonu | Jen |
| 11 | Yazma Oyunu | Yazma Oyunu Oluşturma | JavaScript uygulamanızın mantığını yönlendirmek için klavye olaylarını nasıl kullanacağınızı öğ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ı, tarihçesini ve bir 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, bir API çağırma ve yerel depolamada değişkenleri saklama | Yerel depolamada saklanan değişkenleri kullanarak bir API çağırmak için tarayıcı eklentinizin JavaScript öğelerini oluşturun | API'ler, Formlar ve Yerel Depolama | Jen |
| 14 | Yeşil Tarayıcı Eklentisi | Tarayıcıda Arka Plan İşlemleri, Web Performansı | Tarayıcının arka plan işlemlerini kullanarak eklentinin simgesini yönetin; web performansı ve bazı optimizasyonlar hakkında bilgi edinin | Arka Plan Görevleri ve Performans | Jen |
| 15 | Uzay Oyunu | JavaScript ile Daha İleri Seviye Oyun Geliştirme | Bir oyun oluşturma hazırlığında Sınıflar ve Kompozisyon kullanarak Kalıtım ve Yayın/Abonelik modelini öğrenin | İleri Seviye Oyun Geliştirmeye Giriş | Chris |
| 16 | Uzay Oyunu | Tuval Üzerine Çizim | Ekrana öğeler çizmek için kullanılan Canvas API'sini öğrenin | Tuval Üzerine Çizim | Chris |
| 17 | Uzay Oyunu | Ekranda öğeleri hareket ettirme | Öğelerin Kartezyen koordinatları ve Canvas API'si kullanılarak nasıl hareket edebileceğini keşfedin | Ekranda Öğeleri Hareket Ettirme | Chris |
| 18 | Uzay Oyunu | Çarpışma Algılama | Öğelerin birbirleriyle çarpışmasını ve tepki vermesini sağlayın, tuş vuruşlarını kullanarak performansı artırmak için bir soğuma fonksiyonu ekleyin | Çarpışma Algılama | Chris |
| 19 | Uzay Oyunu | Puan Tutma | Oyunun durumu ve performansına dayalı matematiksel hesaplamalar yapın | Puan Tutma | Chris |
| 20 | Uzay Oyunu | Oyunu Bitirme ve Yeniden Başlatma | Oyunu bitirme ve yeniden başlatma hakkında bilgi edinin, varlıkları temizleme ve değişken değerlerini sıfırlama dahil | Bitirme Koşulu | Chris |
| 21 | Banka Uygulaması | HTML Şablonları ve Web Uygulamasında Yönlendirme | Çok sayfalı bir web sitesinin mimarisini yönlendirme ve HTML şablonları kullanarak nasıl oluşturacağınızı öğrenin | HTML Şablonları ve Yönlendirme | Yohan |
| 22 | Banka Uygulaması | Giriş ve Kayıt Formu Oluşturma | Formlar oluşturma ve doğrulama rutinlerini yönetme hakkında bilgi edinin | Formlar | Yohan |
| 23 | Banka Uygulaması | Veri Alma ve Kullanma Yöntemleri | Verilerin uygulamanıza nasıl girip çıktığını, nasıl alınacağını, saklanacağını ve işleneceğini öğrenin | Veri | Yohan |
| 24 | Banka Uygulaması | Durum Yönetimi Kavramları | Uygulamanızın durumunu nasıl koruyacağınızı ve bunu programlı bir şekilde nasıl yöneteceğinizi öğrenin | Durum Yönetimi | Yohan |
| 25 | Tarayıcı/VScode Kod | VScode ile Çalışma | Bir kod editörü kullanmayı öğrenin | VScode Kod Editörünü Kullanma | Chris |
| 26 | AI Asistanları | AI ile Çalışma | Kendi AI asistanınızı nasıl oluşturacağınızı öğrenin | AI Asistanı Projesi | Chris |
🏫 Pedagoji
Müfredatımız iki temel pedagojik ilkeye dayalı olarak tasarlanmıştır:
- proje tabanlı öğrenme
- sık yapılan testler
Program, JavaScript, HTML ve CSS'in temellerini, ayrıca günümüz web geliştiricilerinin kullandığı en son araçları ve teknikleri öğretir. Öğrenciler, yazma oyunu, sanal terrarium, çevre dostu tarayıcı eklentisi, uzay istilacı tarzı oyun ve işletmeler için bir banka uygulaması oluşturarak pratik deneyim kazanma fırsatına sahip olacaklar. Serinin sonunda öğrenciler web geliştirme konusunda sağlam bir anlayış kazanmış olacaklar.
🎓 Bu müfredattaki ilk birkaç dersi Microsoft Learn'de 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 öğrenilmesi artırılır. Ayrıca, JavaScript temelleri üzerine birkaç başlangıç dersi yazdık ve bunları "JavaScript'e Başlangıç Serisi" video eğitim koleksiyonundan bir video ile eşleştirdik. Bu koleksiyonun bazı yazarları bu müfredata katkıda bulunmuştur.
Ek olarak, bir sınıftan önce yapılan düşük riskli bir test, öğrencinin bir konuyu öğrenmeye yönelik niyetini belirlerken, sınıf sonrası yapılan ikinci bir test daha fazla öğrenmeyi sağlar. Bu müfredat esnek ve eğlenceli olacak şekilde tasarlanmıştır ve tamamı veya bir kısmı alınabilir. Projeler küçük başlar ve 12 haftalık döngünün sonunda giderek daha karmaşık hale gelir.
JavaScript çerçevelerini tanıtmaktan özellikle kaçınarak, bir çerçeve benimsemeden önce bir web geliştirici olarak ihtiyaç duyulan temel becerilere odaklandık. Bu müfredatı tamamladıktan sonra bir sonraki iyi adım, başka bir video koleksiyonu aracılığıyla Node.js hakkında bilgi edinmek olabilir: "Node.js'ye Başlangıç Serisi".
Davranış Kuralları ve Katkı Sağlama yönergelerimizi ziyaret edin. Yapıcı geri bildirimlerinizi memnuniyetle karşılıyoruz!
🧭 Çevrimdışı erişim
Bu dokümantasyonu Docsify kullanarak çevrimdışı çalıştırabilirsiniz. Bu depoyu çatallayın, Docsify'i yükleyin ve ardından bu deponun kök klasöründe docsify serve yazın. Web sitesi localhost'unuzda 3000 portunda hizmet verecektir: localhost:3000.
Tüm derslerin PDF'sini burada bulabilirsiniz.
🎒 Diğer Kurslar
Ekibimiz başka kurslar da üretiyor! Şunlara göz atabilirsiniz:
- MCP for Beginners
- Edge AI for Beginners
- AI Agents for Beginners
- Generative AI for Beginners .NET
- Generative AI with JavaScript
- Java ile Üretken Yapay Zeka
- Yeni Başlayanlar için Yapay Zeka
- Yeni Başlayanlar için Veri Bilimi
- Yeni Başlayanlar için Makine Öğrenimi
- Yeni Başlayanlar için Siber Güvenlik
- Yeni Başlayanlar için Web Geliştirme
- Yeni Başlayanlar için IoT
- Yeni Başlayanlar için XR Geliştirme
- GitHub Copilot'u Etkili Kullanma Sanatı
- C#/.NET Geliştiricileri için GitHub Copilot'u Etkili Kullanma Sanatı
- Kendi Copilot Maceranı Seç
Yardım Alma
Eğer takılırsanız veya yapay zeka uygulamaları oluşturma konusunda sorularınız olursa, katılabilirsiniz:
Eğer ürünle ilgili geri bildirimde bulunmak veya oluşturma sırasında hatalarla karşılaşırsanız, ziyaret edin:
Lisans
Bu depo MIT lisansı altında lisanslanmıştır. Daha fazla bilgi için LICENSE dosyasına bakabilirsiniz.
Feragatname:
Bu belge, AI çeviri hizmeti Co-op Translator kullanılarak çevrilmiştir. Doğruluk için çaba göstersek de, otomatik çeviriler hata veya yanlışlıklar içerebilir. Belgenin orijinal dili, yetkili kaynak olarak kabul edilmelidir. Kritik bilgiler için profesyonel insan çevirisi önerilir. Bu çevirinin kullanımından kaynaklanan yanlış anlamalar veya yanlış yorumlamalardan sorumlu değiliz.


