Velo by Wix ile Kodlama: Sitenize Özel Veritabanı ve Dinamik Form Oluşturma

Tarık Tunç
18 Eki
2 dakikada okunur

Wix, uzun süre boyunca yalnızca sürükle-bırak kolaylığıyla tanındı. Ancak Velo by Wix, bu sınırları tamamen ortadan kaldırıyor. Artık sadece tasarım yapmakla kalmayıp, veritabanı yönetimi, dinamik sayfalar ve API entegrasyonları gibi ileri seviye özelliklerle web sitenizi yazılım seviyesinde özelleştirebilirsiniz.Bu rehberde, kodlama bilgisi az olan kullanıcılar için bile anlaşılır adımlarla Velo kullanarak özel bir form oluşturmayı ve verileri kendi veritabanınıza kaydetmeyi öğreneceğiz.

Wix Velo nedir ?

Wix Velo, Wix’in sunduğu açık geliştirme platformudur. Sürükle-bırak kolaylığını korurken, geliştiricilere JavaScript tabanlı kodlama, veritabanı yönetimi (CMS), API entegrasyonu ve dinamik sayfa oluşturma gibi profesyonel araçlar sunar.

Velo ile:

Sitenize özel işlevler ekleyebilir,
Kullanıcı verilerini kaydedebilir,
Otomasyonlar ve özel entegrasyonlar kurabilirsiniz.

Yani Velo, Wix’i sadece bir web tasarım aracı olmaktan çıkarıp tam kapsamlı bir web uygulama geliştirme platformuna dönüştürür.

Velo Nedir ve Nasıl Aktif Edilir?

Velo, Wix’in üzerine inşa edilmiş bir JavaScript tabanlı geliştirme platformudur. Wix Editor üzerinden, sitenizde dinamik etkileşimler oluşturmanıza olanak tanır.

Velo’yu aktif etmek için:

Wix Editor’ü açın.
Üst menüden “Geliştirici Modu” (Dev Mode) seçeneğini aktif edin.
Editörün alt kısmında Kod Paneli açılacaktır. Artık sitedeki tüm elementlere JavaScript ile müdahale edebilirsiniz.

Adım 1: Veritabanı (CMS) Oluşturma

İlk adımda, kullanıcı verilerini saklayacağımız bir koleksiyon (collection) oluşturuyoruz.

Sol menüden “İçerik Yöneticisi (Content Manager)” sekmesini açın.
Yeni Koleksiyon Ekle → örneğin UserComments adını verin.
Koleksiyonunuza, name, email, message gibi alanlar ekleyin.Bu veritabanı, formdan gelecek verileri saklayacağınız temel yapıdır.

Adım 2: Kullanıcı Girdisi Formu Tasarlama

Şimdi formu oluşturalım.Editor’da sayfanıza şu elementleri ekleyin:

Metin kutusu (örnek: “İsim”, “E-posta”)
Uzun metin kutusu (örnek: “Mesajınız”)
Gönder butonu (submitButton ID’si ile)

Bu noktada standart Wix formlarını değil, tamamen özgün ve Velo tarafından kontrol edilen form elementlerini kullanıyoruz.

Adım 3: Temel Velo Kodu ile Formu Veri Tabanına Bağlama

Artık form verilerini CMS’e kaydedecek kodu yazabiliriz.

import wixData from 'wix-data';

$w.onReady(function () {
  $w("#submitButton").onClick(() => {
    const name = $w("#nameInput").value;
    const email = $w("#emailInput").value;
    const message = $w("#messageInput").value;

    wixData.insert("UserComments", {
      name: name,
      email: email,
      message: message,
      createdAt: new Date()
    })
    .then(() => {
      $w("#successText").text = "Mesajınız başarıyla gönderildi!";
      $w("#successText").show();
    })
    .catch((err) => {
      console.error("Veri eklenirken hata oluştu:", err);
    });
  });
});

Kod Açıklaması:

import wixData → Wix’in veri tabanı modülünü projeye dahil eder.
$w.onReady() → Sayfa yüklendiğinde çalışacak kod bloğunu başlatır.
insert() → Girilen verileri “UserComments” koleksiyonuna ekler.
.then() ve .catch() → Başarılı veya hatalı işlem sonuçlarını yönetir.

Velo by Wix, yalnızca bir kodlama aracı değil; işletmenize özel çözümler üretebileceğiniz güçlü bir geliştirme platformudur.API entegrasyonları, dinamik sayfalar ve özel otomasyon akışları ile markanızın dijital altyapısını profesyonel seviyeye taşıyabilirsiniz.

Blakfy, bu konuda profesyonel Velo geliştirme ve entegrasyon hizmeti sunar. İşletmenizin ihtiyaçlarına özel veritabanı, form ve API çözümleriyle dijital operasyonlarınızı büyütebilirsiniz. 👉 Wix sitenizi özel çözümlerle güçlendirin!

Blakfy’nin profesyonel Velo geliştirme hizmetleriyle tanışın.

Hemen Başlayın