Tauri 2.0 ile SQLite Veritabanını React Uygulamanızda Kullanma

Tauri 2.0 ile SQLite Veritabanını React Uygulamanızda Kullanma

Bu makalede, Tauri 2.0’ı kullanarak React uygulamanızda SQLite veritabanını nasıl entegre edebileceğinizi adım adım göstereceğim. Tauri, çapraz platform masaüstü uygulamaları oluşturmak için kullanılan popüler bir framework’tür ve SQLite, hafif ve yerleşik bir veritabanı sistemidir. Bu ikiliyi birleştirerek, performanslı ve kullanımı kolay veritabanı işlevselliğini React uygulamalarınıza ekleyebilirsiniz.

Neden Tauri ve SQLite?

Tauri ve SQLite, masaüstü uygulamaları için harika bir kombinasyondur. Tauri, geliştiricilere HTML, CSS ve JavaScript ile masaüstü uygulamaları oluşturma olanağı sağlarken, SQLite, verileri yerel olarak depolamak için hızlı ve güvenilir bir yol sunar. Bu sayede, kullanıcı verilerini çevrimdışı olarak saklamak, performansı artırmak ve üçüncü taraf hizmetlerine bağımlılığı azaltmak mümkün olur.

Proje Kurulumu

İlk adım, Tauri ve React projenizi kurmaktır. Bu işlem, Tauri’nin sağladığı CLI aracılığıyla kolayca yapılabilir.

“`bash
npx create-tauri-app my-tauri-app –template=react
cd my-tauri-app
“`

Bu komutlar, “my-tauri-app” adında yeni bir Tauri projesi oluşturacak ve React şablonunu kullanacaktır. Proje oluşturulduktan sonra, terminalde “npm install” komutunu çalıştırarak gerekli bağımlılıkları yükleyebilirsiniz.

SQLite Bağlantısı Kurma

Tauri’de SQLite ile etkileşim kurmak için “sqlite” paketini kullanacağız. Bu paketi proje bağımlılıklarınıza eklemek için “npm install sqlite” komutunu çalıştırın.

Ardından, veritabanı ile etkileşim kurabileceğimiz bir yardımcı fonksiyon tanımlayacağız:

“`javascript
// src/main.rs
use tauri::Manager;
use sqlite::{Connection, OpenFlags};

#[tauri::command]
fn connect_db() -> Result {
let db_path = “my_database.db”;
let conn = Connection::open_with_flags(
db_path,
OpenFlags::SQLITE_OPEN_CREATE | OpenFlags::SQLITE_OPEN_READWRITE,
)
.map_err(|e| e.to_string())?;
Ok(conn)
}

fn main() {
tauri::Builder::default()
.invoke_handler(tauri::generate_handler![connect_db])
.run(tauri::generate_context!())
.expect(“error while running tauri application”);
}
“`

Bu kod, “my_database.db” adında bir veritabanı dosyası oluşturur veya var olan bir dosyayı açar. Eğer dosya yoksa, otomatik olarak oluşturulur. “connect_db” fonksiyonu, Tauri’nin “invokeHandler” mekanizması aracılığıyla React uygulamanızdan çağırılabilen bir Tauri komutudur.

React Uygulamanızda Veritabanını Kullanma

Artık veritabanına bağlantı kurabildiğimiz için, React uygulamanızda veritabanını kullanmak için gerekli işlemleri gerçekleştirebiliriz. Örnek olarak, bir kullanıcı listesi oluşturup veritabanında saklayacağız:

“`javascript
// src/App.jsx
import React, { useState, useEffect } from ‘react’;
import { invoke } from ‘@tauri-apps/api/tauri’;

function App() {
const [users, setUsers] = useState([]);

useEffect(() => {
const fetchUsers = async () => {
const conn = await invoke(‘connect_db’);
const stmt = conn.prepare(“SELECT * FROM users”).unwrap();
let users = [];
while let Some(row) = stmt.next().unwrap() {
users.push({
id: row.get(0).unwrap(),
name: row.get(1).unwrap(),
email: row.get(2).unwrap(),
});
}
setUsers(users);
};
fetchUsers();
}, []);

const addUser = async (name, email) => {
const conn = await invoke(‘connect_db’);
conn.execute(“INSERT INTO users (name, email) VALUES (?, ?)”, &[name, email])
.unwrap();
const newUsers = […users, { id: users.length + 1, name, email }];
setUsers(newUsers);
};

return (

);
}

export default App;
“`

Bu kodda, “useEffect” hook’u kullanarak veritabanından kullanıcıları çekiyoruz. Daha sonra, “addUser” fonksiyonu ile yeni bir kullanıcı ekleyebiliyoruz. Bu fonksiyon, veritabanına yeni bir kayıt ekliyor ve kullanıcı listesinde güncelleme yapıyor.

Önemli Noktalar

* **Veritabanı Şeması:** Veritabanı şemasını oluşturmak için SQL komutları kullanmanız gerekecektir. Örneğin, kullanıcılar tablosunu oluşturmak için aşağıdaki komutu kullanabilirsiniz:

“`sql
CREATE TABLE users (
id INTEGER PRIMARY KEY AUTOINCREMENT,
name TEXT,
email TEXT
);
“`

* **Güvenlik:** Kullanıcı girdisini doğrulamak ve SQL enjeksiyonundan kaçınmak için önlemler almanız önemlidir.
* **Veritabanı Yönetimi:** Veritabanınızı yedekleme, güncelleme ve silme gibi işlemler için ek kod yazmanız gerekebilir.

Sonuç

Tauri ve SQLite’ı birleştirerek, React uygulamaları için güçlü ve kullanımı kolay bir veritabanı çözümü sağlayabilirsiniz. Yerel veritabanı desteği sayesinde, çevrimdışı özellikler, performans iyileştirmeleri ve üçüncü taraf hizmetlerine bağımlılığın azaltılması sağlanabilir. Bu makalede, Tauri ve SQLite’ı birleştirerek temel veritabanı işlemlerini nasıl gerçekleştirebileceğinizi gösterdim. Daha fazla gelişmiş özellik ve kullanım senaryoları için Tauri ve SQLite belgelerine başvurabilirsiniz.

## #Etiketler
Tauri, SQLite, React, Masaüstü Uygulamaları, Veritabanı, Yerel Depolama, Çapraz Platform, Framework

Daha fazla bilgi için, Tauri ve SQLite belgelerini inceleyebilirsiniz:

• Tauri: https://tauri.app/
• SQLite: https://www.sqlite.org/

Bu konuda sorularınız veya yorumlarınız varsa, fatihsoysal.com adresinden benimle iletişime geçebilirsiniz.