Dosya gezgini

Promake'in kod editöründeki Dosya Gezgini, web sitenizi oluşturan tüm dosyalar arasında gezinmenizi sağlar. Bu yapıyı anlamak, doğru dosyaları bulmanıza ve düzenlemenize yardımcı olur.

Promake'in kod editöründeki Dosya Gezgini, web sitenizi oluşturan tüm dosyalar arasında gezinmenizi sağlar. Bu yapıyı anlamak, doğru dosyaları bulmanıza ve düzenlemenize yardımcı olur.

Dosya Gezginine Erişim

  1. Kod Editörü görünümünü açın
  2. Dosya Gezgini sol tarafta
  3. Projenizin klasör yapısını gösterir

Dosya Yapısını Anlama

Tipik bir Promake projesi şunları içerir:

proje/
├── src/
│   ├── components/    # Yeniden kullanılabilir componentler
│   ├── pages/         # Web sitesi sayfaları
│   ├── styles/        # CSS ve stillendirme
│   └── assets/        # Görseller, fontlar
├── public/            # Statik dosyalar
├── package.json       # Proje bağımlılıkları
└── index.html         # Giriş noktası

Klasör Türleri

src/ (Kaynak)

Web sitenizin kodunu içeren ana klasör:

components/

Web sitenizin yeniden kullanılabilir parçaları:

  • Header
  • Footer
  • Butonlar
  • Kartlar
  • Navigasyon

pages/

Web sitenizin bireysel sayfaları:

  • Ana sayfa
  • Hakkında sayfası
  • İletişim sayfası

styles/

CSS ve stillendirme dosyaları:

  • Global stiller
  • Component stilleri
  • Tema renkleri

assets/

Medya dosyaları:

  • Görseller
  • İkonlar
  • Fontlar

public/

İşleme gerektirmeyen statik dosyalar:

  • favicon.ico
  • robots.txt
  • Statik görseller

Dosyalar Arasında Gezinme

Klasörleri Genişletme

Klasörleri genişletmek/daraltmak için ok veya klasör ikonuna tıklayın.

Dosya Açma

Editörde açmak için herhangi bir dosya adına tıklayın.

Dosya İkonları

Farklı dosya türlerinin farklı ikonları vardır:

| İkon | Dosya Türü | | ---- | ------------------ | | 📄 | JavaScript/JSX | | 🎨 | CSS/Stil dosyaları | | 📋 | JSON dosyaları | | 🖼️ | Görsel dosyaları | | 📝 | Markdown dosyaları |

Dosya Bulma

Gezinerek

  1. Kökten başlayın
  2. İlgili klasörleri genişletin
  3. Dosyaya tıklayın

Arama ile

  1. Ctrl/Cmd + P basın (varsa)
  2. Dosya adını yazın
  3. Sonuçlardan seçin

İçeriğe Göre

  1. Global arama için Ctrl/Cmd + Shift + F kullanın
  2. Metin içeriğini arayın
  3. Dosyaları açmak için sonuçlara tıklayın

Düzenlenecek Yaygın Dosyalar

İçerik Değişiklikleri İçin

| Ne Değiştirilecek | Nereye Bakılacak | | ----------------- | --------------------------------- | | Sayfa metni | src/pages/ | | Component metni | src/components/ | | Meta veriler | index.html veya sayfa dosyaları |

Stil Değişiklikleri İçin

| Ne Değiştirilecek | Nereye Bakılacak | | ----------------- | -------------------------------- | | Renkler | src/styles/ veya CSS dosyaları | | Fontlar | Global CSS dosyaları | | Boşluklar | Component stilleri |

Yapı İçin

| Ne Değiştirilecek | Nereye Bakılacak | | ----------------- | --------------------- | | Düzen | Component dosyaları | | Navigasyon | Header/Nav componenti | | Footer | Footer componenti |

Dosya İşlemleri

Dosyaları Görüntüleme

İçeriğini editörde görüntülemek için herhangi bir dosyaya tıklayın.

Dosyaları Düzenleme

  1. Dosyayı açın
  2. Editörde değişiklik yapın
  3. Ctrl/Cmd + S ile kaydedin

Dosyaları İndirme

  • Tek dosya: Sağ tık → İndir (veya indirme butonunu kullanın)
  • Tüm dosyalar: ZIP indirme seçeneğini kullanın

İpuçları

src/ ile Başlayın

Düzenlemek istediğiniz şeylerin çoğu src/ klasöründe.

Dosya Adlarını İpucu Olarak Kullanın

Dosya adları genellikle amaçlarını tanımlar:

  • Header.jsx - Header componenti
  • HomePage.jsx - Ana sayfa
  • styles.css - Stillendirme

Component İsimlerini Kontrol Edin

Hangi componenti aradığınızı biliyorsanız (Düzenleme Aracı'ndan), o ismi arayın.

nodemodules'u Düzenlemeyin

Proje Yapılandırma Dosyaları

package.json

Proje bağımlılıklarını ve script'leri listeler. Ne yaptığınızı bilmiyorsanız genellikle düzenlemeyin.

Yapılandırma Dosyaları

Çeşitli config dosyaları build ayarlarını kontrol eder. Yalnızca gerekirse düzenleyin.