Dersler · Kodlama · başlangıç · Tech With Tim

Cursor Vibe Coding Tutorial - For COMPLETE Beginners (No Experience Needed)

Tech With Tim kanalının “Cursor Vibe Coding Tutorial - For COMPLETE Beginners (No Experience Needed)” videosu 8 ders halinde: konunun anlatımı, ekrandaki kod, alıştırma terminalinde denenecek adımlar, çözümlü alıştırmalar ve cevabı videodaki ana götüren bir quiz.

8ders
3kod parçası
23alıştırma
27soru
66dk video
Derslere git →1. ders ücretsiz · Beyond Pass hepsini açar

Diğer dillerde: English · Español

Video İngilizce. YouTube oynatıcısında altyazıyı açıp Otomatik çevir → Türkçe seçebilirsin.

Cursor Vibe Coding Tutorial - For COMPLETE Beginners (No Experience Needed), video by Tech With Tim▶ 1:05:52 · Tech With Tim
12345678
0:00videonun tamamına yayılmış 8 ders1:05:52

Neler yapabileceksin

  • Cursor AI kod editörünü kurup ayarla ve bir proje klasörü aç
  • Cursor'da Agent, Ask ve model seçeneklerini kullanarak yapay zekâdan sade İngilizceyle kod iste
  • Yapay zekânın oluşturduğu değişiklikleri kabul et ya da reddet ve index.html'den basit bir tarayıcı oyunu çalıştır
  • Tarayıcı konsolunu okuyarak, hata mesajlarını paylaşarak ve bağlam olarak dokümantasyon ekleyerek hataları ayıkla
  • Git ile proje kontrol noktaları kaydet ve istemediğin yapay zekâ değişikliklerini geri alabil
  • Proje kuralları ve işine yarayan eklentilerle yapay zekânın davranışını yönlendir

Önce bilmen iyi olur

  • Bilgisayarına masaüstü yazılımı indirip kurabilme becerisi
  • Klasör ve dosya oluşturma konusunda temel bilgi
  • ChatGPT gibi ücretsiz bir yapay zekâ sohbet asistanına erişim

Müfredat

8 ders ve bir final projesi

  1. 1

    Vibe coding nedir ve neden bir yapay zekâ kod editörü işini kolaylaştırır Ücretsiz

    0:00–2:002 dk video

    Bu derste "vibe coding"in ne anlama geldiğini açıklıyoruz: kodun her satırını kendin yazmak yerine, istediğini sade İngilizceyle bir yapay zekâ modeline anlatarak yazılım geliştirmek. Ayrıca iyi sonuçlar almak istiyorsan neden bir kod editörünün ve temel bilgilerin hâlâ önemli olduğunu gösteriyoruz.

    3 alıştırma3 soru
  2. 2

    Installing Cursor and setting up your project folder Beyond Pass

    2:00–5:454 dk video

    You will learn what an AI code editor is and why Cursor is a good free place to start. You will also install Cursor and create a project folder that Cursor opens as your workspace.

    5 adım2 alıştırma3 soru
  3. 3

    Cursor'a Genel Bakış: Agent ve Ask modu ile model seçimi Beyond Pass

    5:45–12:006 dk video

    Cursor'un Ask ve Agent modlarının ne yaptığını ve projeni ne kadar değiştirebilmelerine göre nasıl farklılaştıklarını öğreneceksin. Ayrıca sohbet panelinde bir yapay zeka modelini nasıl seçeceğini ve Max modu ile Auto modu ne zaman kullanacağını da öğreneceksin.

    4 adım4 alıştırma4 soru
  4. 4

    Oyunu danışman bir yapay zekâyla planlamak ve bir çatı seçmek Beyond Pass

    12:00–17:255 dk video

    Kod editörüne dokunmadan önce, danışman bir yapay zekâdan net bir açıklama, bir teknoloji yığını ve bir öğrenme planı isteyerek ne yapmak istediğini planlarsın. Ayrıca programlama dili ile çatı (framework) arasındaki farkı öğrenir ve tarayıcı oyunu için Kaboom.js gibi yeni başlayanlara uygun bir çatının neden iyi bir seçim olduğunu anlarsın.

    5 adım3 alıştırma4 soru
  5. 5

    [31] Generating code, accepting changes, and running it for the first time Beyond Pass

    17:25–33:1016 dk video

    [32] You learn how an AI coding agent creates files in Cursor, how to review and accept or reject its changes, and how to open and run the result in a browser. You also learn that the first run usually shows errors, and how to read them and report them back to the agent.

    5 adım3 alıştırma3 soru
  6. 6

    [31] Konsol, Manuel Düzenlemeler ve Dokümantasyon Bağlamı ile Hata Ayıklama Beyond Pass

    33:10–45:2012 dk video

    [32] Yapay zekâ işe yaramadığında hata ayıklamayı katmanlar halinde öğrenirsin: tarayıcı konsolunda gerçek hatayı oku, küçük manuel değişiklikler yap ve modele resmi dokümantasyonu bağlam olarak ver. Bu ders, videodaki bozuk bir platform oyununun adım adım onarılmasını takip eder.

    1 kod5 adım2 alıştırma3 soru
  7. 7

    Git ile kontrol noktaları kaydetmek: commit, diff ve discard Beyond Pass

    45:20–54:109 dk video

    Git'in projenin kontrol noktalarını (commit'leri) nasıl kaydettiğini öğreneceksin; böylece neyin değiştiğini görebilir ve çalışan bir sürüme geri dönebilirsin. Bir depo (repository) başlatacak, dosyaları stage edip commit edecek, bir diff görüntüleyecek ve bir hatayı geri alacaksın.

    1 kod8 adım3 alıştırma3 soru
  8. 8

    Proje kuralları, eklentiler, arama ve daha iyi prompt'lar Beyond Pass

    54:10–1:05:5212 dk video

    Cursor'a her yanıtı şekillendiren kalıcı kurallar vermeyi, Prettier gibi editör eklentileri eklemeyi ve kodu kendin bulup değiştirmek için aramayı kullanmayı öğreneceksin. Ayrıca neden tek bir dev prompt yerine küçük, hedefli prompt'ların daha iyi olduğunu da göreceksin.

    1 kod6 adım3 alıştırma4 soru

Final projesi

Mini bir tarayıcı oyununu vibe-code ile yaz, ayıkla ve yayımla

Yalnızca Cursor'un yapay zekâsını, bir danışman yapay zekânın planını ve Git kontrol noktalarını kullanarak sıfırdan küçük bir tarayıcı oyunu yap. Tam iş akışını çalışacaksın: planla, üret, çalıştır, ayıkla, kaydet ve kuralları kullanarak yapay zekâyı yönlendir. Hedef, çalışan bir oyun ile nasıl oraya ulaştığını gösteren bir commit geçmişi.

8 görev Beyond Pass ile açılır.

Ücretsiz önizleme · 1. dersin tamamı

Vibe coding nedir ve neden bir yapay zekâ kod editörü işini kolaylaştırır

Bu derste "vibe coding"in ne anlama geldiğini açıklıyoruz: kodun her satırını kendin yazmak yerine, istediğini sade İngilizceyle bir yapay zekâ modeline anlatarak yazılım geliştirmek. Ayrıca iyi sonuçlar almak istiyorsan neden bir kod editörünün ve temel bilgilerin hâlâ önemli olduğunu gösteriyoruz.

0:00 videoda 2:00 anına kadar

Fikir

Vibe coding, GPT veya Claude gibi büyük dil modellerine (LLM) ağırlıklı olarak dayandığın bir yazılım geliştirme yöntemidir. Her satırı kendin yazmak ve bir programlama dilinin sözdizimini ezberlemek yerine, istediğini günlük İngilizceyle anlatırsın ve yapay zekâ kodu senin için yazar.

Bu yaklaşım, şeyler inşa etmenin önündeki engeli düşürdüğü için önemli. Yeni başlayan biri, önce her komutu ve kuralı öğrenmeden çalışan bir uygulama isteyebilir. Mutlak yeni başlayanlar için videonun odağı, yapay zekânın yazdığı kod satırları değil; araçlar: kod editörünü nasıl kullanacağın, yapay zekâ modelini nasıl kullanacağın ve bunların hepsini gerçekten çalışan bir uygulamaya nasıl dönüştüreceğin.

Video ayrıca dürüst bir noktaya değiniyor: Vibe coding'i başarıyla yapan insanların genellikle en azından bir editörde çalışmaya dair biraz deneyimi olur. Farklı yapay zekâ modellerinin ne olduğunu, hangisini ne zaman kullanacaklarını, önerilen tamamlamaları nasıl kabul edeceklerini ve çeşitli araçların ne işe yaradığını kabaca bilirler. Profesyonel olman gerekmez, ama bu temel bilgileri öğrenmek seni çoğu insanın önüne geçirir.

Bu kursun planı basit: Bir yapay zekâ kod editöründe çalışmayı öğren, yapay zekâ modeliyle net biçimde konuşmayı öğren ve her şeyi kolaylaştıran küçük bilgi parçalarını öğren. Yapay zekânın ürettiği her satırı anlamak zorunda değilsin; nelerin nerede durduğunu ve ne istediğini nasıl soracağını bilmen yeterli.

Ana noktalar

  • Vibe coding, sade İngilizce açıklamalardan kod yazmak için büyük ölçüde GPT veya Claude gibi yapay zekâ modellerine dayanmak demektir. 1:01
  • Bir dilin sözdizimini ezberlemek zorunda değilsin; odak noktası araçlar: kod editörü ve yapay zekâ modeli. 1:24
  • Başarılı vibe coder'lar genellikle bir editörde biraz deneyime sahip olur ve hangi durumda hangi yapay zekâ modelini kullanacaklarını bilir. 0:40
  • Amaç profesyonel bir mühendis olmak değil; işini kolaylaştıran bilgi parçalarını öğrenmek. 0:16

Bilmen gereken kelimeler

Vibe coding
İstediğin şeyi sade İngilizceyle anlatıp yapay zekâ modelinin kodun büyük kısmını yazmasına izin vererek yazılım geliştirme.
Büyük dil modeli (LLM)
Metin ve bilgisayar kodu okuyup üretebilen, GPT veya Claude gibi bir yapay zekâ modeli.
Kod editörü
Kod dosyalarını görüntülediğin, yazdığın ve değiştirdiğin program.
Sözdizimi (syntax)
Bir programlama dilinin gerektirdiği tam kelimeler, semboller ve kurallar.
Tamamlama (completion)
Yapay zekânın ya da editörün bir sonraki kod parçası için yaptığı öneri; bunu kabul edebilir ya da reddedebilirsin.

Dikkat

  • Vibe coding her şeyi görmezden gelebileceğin anlamına gelmez. Editörün ve yapay zekâ modelinin nasıl çalıştığını bilmek sonuçlarını çok daha iyi yapar. 0:40
  • Bu aşamada yapay zekânın yazdığı her satırı anlamasını bekleme; araçlara ve net soru sormaya odaklan. 1:48
  • Yapay zekâyla bir şey inşa edebilmek seni profesyonel bir mühendis yapmaz; amaç pratik beceri, unvan değil. 0:16

Alıştırma

Açıkla Çözümü kontrol edildi

Kendi cümlelerinle vibe coding'in ne olduğunu açıkla ve iyi yapmak için bir yeni başlayanın hâlâ öğrenmesi gereken bir şeyi söyle.

İpucu

Kodu kimin yazdığını ve ona bunu hangi dilde söylediğini düşün.

Çözüm
  1. Vibe coding, istediğini sade İngilizceyle bir yapay zekâ modeline anlatmak ve onun kodu senin yerine yazmasıdır.
  2. Yeni başlayan biri hâlâ bir kod editöründe temel deneyim kazanmalı, hangi yapay zekâ modelini ne zaman kullanacağını anlamalı ve önerileri nasıl kabul edeceğini bilmelidir.

Örnek cevap: Vibe coding, bir yapay zekâ modelinden sade İngilizceyle kodu yazmasını isteyerek yazılım geliştirmektir. Yeni başlayan biri hâlâ bir kod editörünü kullanmayı ve yapay zekâ önerilerini kabul etmek gibi yapay zekâ araçlarıyla çalışmayı öğrenmelidir.

Yap Çözümü kontrol edildi

Kendine uygun küçük bir uygulama seç (örneğin bir yapılacaklar listesi ya da bir bilgi yarışması oyunu). Bunu bir yapay zekâ modeline yazar gibi, iki üç sade İngilizce cümleyle iste.

İpucu

Uygulamanın ne yapması gerektiğini ve kullanıcının ne gördüğünü anlat. Kod ya da özel terimlere ihtiyacın yok.

Çözüm
  1. Küçük bir uygulama fikri seç.
  2. Ne yapması gerektiğini basit cümlelerle yaz, örneğin: 'Bir yapılacaklar listesi uygulaması yap. Bir görev yazıp Ekle'ye basabileyim. Her görevin yanında, tamamlandığında işaretleyebileceğim bir onay kutusu olsun.'
  3. Tekrar oku ve fikrini hiç görmemiş biri anlayabilecek mi diye kontrol et.

Fikrin kısa, sade bir açıklaması, örneğin: 'Bir yapılacaklar listesi uygulaması yap. Bir görev yazıp Ekle'ye basabileyim. Her görevin yanında, tamamlandığında işaretleyebileceğim bir onay kutusu olsun.' Kod kullanmaz, yalnızca açık cümlelerden oluşur.

Yap Çözümü kontrol edildi

Şu üç şeye bak: (a) programın her satırını kendin yazıp sözdizimini ezberlemek, (b) GPT ya da Claude'dan sade İngilizceyle bir program yazmasını istemek, (c) dosyaları görüntülemek ve değiştirmek için bir kod editörü kullanmak. Hangisi vibe coding, hangisi sonucu görmek için kullanacağın araç?

İpucu

Vibe coding, kodu kimin yazdığıyla ilgilidir. Editör ise kodun durduğu yerdir.

Çözüm
  1. (a) geleneksel kodlamadır: her şeyi kendin yazarsın.
  2. (b) vibe coding'dir: bir yapay zekâ modeli, sade İngilizce isteğinden kodu yazar.
  3. (c) kod editörüdür: yapay zekânın oluşturduğu dosyaları görüntüleyip değiştirdiğin yerdir.

(b) vibe coding'dir; (c) kod editörü ise sonucu gördüğün ve yönettiğin araçtır.

Test

  1. Videoya göre 'vibe coding' temelde ne anlama gelir?

    1. Düz bir metin dosyasında kodun her satırını elle yazmak
    2. İstekleri sade İngilizceyle yazıp kodu büyük ölçüde yapay zekâ modellerine yazdırmak
    3. Sadece müzik dinlerken kod yazmak
    4. Hiç bilgisayar kullanmadan web siteleri yapmak
    Cevabı göster

    B. İstekleri sade İngilizceyle yazıp kodu büyük ölçüde yapay zekâ modellerine yazdırmak · At 1:01 the speaker says vibe coding means heavily relying on AI models such as GPT or Claude, which generate code when you ask in normal English.

    1:01 o anı izle

  2. What does the video say people who vibe code successfully usually have?

    1. A professional software engineering job
    2. A little experience working in a code editor, and knowledge of the AI models and tools
    3. A memorised list of every programming keyword
    4. A paid subscription to every AI tool
    Cevabı göster

    B. A little experience working in a code editor, and knowledge of the AI models and tools · At 0:31 the speaker says successful vibe coders have a little experience at least working in an editor, and understand the models and tools.

    0:31 o anı izle

  3. What is the main focus of this course for absolute beginners?

    1. Explaining every line the AI generates
    2. The tools: the code editor, the AI model, and how to get a usable application
    3. Learning the full syntax of Python first
    4. Comparing hardware for gaming computers
    Cevabı göster

    B. The tools: the code editor, the AI model, and how to get a usable application · At 1:48 the speaker says the focus is on the tools: how to use a code editor, the AI model, and how to get a usable application.

    1:48 o anı izle

1. dersi videoyla aç →

2–8. dersler ve final projesi

Beyond Pass ile açılırlar: her kursun her dersi, eksiksiz. Tek ödeme: 90 gün için $14.99 ya da bir yıl için $29. Abonelik yok.

Beyond Pass al →1. derse ücretsiz başla

Beyond, Tech With Tim kanalının “Cursor Vibe Coding Tutorial - For COMPLETE Beginners (No Experience Needed)” videosundan yaptı. Video YouTube’un kendi oynatıcısında oynar. YouTube’da izle · Bütün dersler