B2B Platform Teknoloji Rehberi

MASPAR B2B
Teknoloji Rehberi

"Masadaki herkes anlasın"

Kullanılan Teknolojiler

Her teknoloji için hem teknik hem de kolay anlaşılır açıklamalar

Vue 3

prod-a-table
Teknik Detay

Composition API, ref(), computed(), watch()

Kolay Anlatım

"Lego gibi parçaları birleştiriyoruz. Her parça bağımsız çalışıyor ama birlikte harika şeyler yapıyorlar!"

Neden seçtik?

Reaktif yapısı sayesinde veriler değişince ekran otomatik güncelleniyor. Temiz ve okunabilir kod yazılıyor.

React 18

prod-b-dark
Teknik Detay

Hooks, useState, useEffect, JSX

Kolay Anlatım

"Facebook'un geliştirdiği süper güçlü araç. Instagram, WhatsApp, Netflix hep bunu kullanıyor!"

Neden seçtik?

Devasa ekosistemi var. Binlerce hazır bileşen ve kütüphane mevcut. Çok hızlı performans sağlıyor.

Alpine.js

prod-maspar-replica prod-c-split
Teknik Detay

x-data, x-show, x-for, @click

Kolay Anlatım

"HTML'e süper güç veriyor! Sadece birkaç satır ekleyerek sayfayı interaktif hale getiriyor."

Neden seçtik?

Sadece 15KB boyutunda. Öğrenmesi çok kolay. Mevcut HTML'e kolayca eklenebiliyor.

Tailwind CSS

Tüm Draftlarda
Teknik Detay

Utility-first, JIT Compiler, dark: prefix

Kolay Anlatım

"CSS yazma derdinden kurtarıyor! Hazır sınıflarla saniyeler içinde güzel tasarımlar yapabiliyoruz."

Neden seçtik?

Geliştirme hızını 3-4 kat artırıyor. Tüm ekip aynı tasarım dilini konuşuyor. Dark mode desteği hazır.

Özellik Karşılaştırması

4 draft'ın özellik matrisi

Özellik prod-a-table prod-b-dark prod-maspar-replica prod-c-split
Dark Mode
Responsive
Filtreleme
Arama
Tablo Görünümü
Kart Görünümü
Split View
Favori Listesi
Öğrenme Eğrisi Orta Yüksek Düşük Düşük
Bundle Boyutu ~50KB ~130KB ~15KB ~15KB

Sistem Mimarisi

Frontend'den veritabanına veri akışı

Frontend

Vue / React / Alpine

Kullanıcı Arayüzü

Kullanıcının gördüğü ve etkileşimde bulunduğu katman. Butonlar, formlar, tablolar burada.

API

Laravel Backend

Uygulama Sunucusu

İş mantığının çalıştığı yer. Kullanıcı isteklerini işler, veritabanıyla konuşur.

Database

MySQL / MariaDB

Veritabanı

Tüm verinin saklandığı yer. Ürünler, kullanıcılar, siparişler burada tutuluyor.

1 Kullanıcı Etkileşimi

Kullanıcı bir butona tıklar veya form doldurur

2 API İşlemi

Backend isteği alır, doğrular ve işler

3 Veri Kayıt

Veritabanına yazılır veya okunur, sonuç döner

Canlı Demo'lar

Tüm draftları canlı olarak inceleyin