Electron ve TypeScript Kullanımı

Electron ve TypeScript Nedir?

Electron, masaüstü uygulamaları geliştirmek için kullanılan bir çerçevedir. HTML, CSS ve JavaScript kullanarak çapraz platform uygulamaları oluşturmanıza olanak tanır. TypeScript ise JavaScript'in bir üst kümesi olup, tip güvenliği sağlar ve daha büyük uygulamalar geliştirmeyi kolaylaştırır. Bu iki teknoloji birleştiğinde, güçlü ve ölçeklenebilir masaüstü uygulamaları geliştirmek mümkündür.

Electron ve TypeScript ile Başlamak

Kurulum

Electron ve TypeScript kullanarak bir uygulama geliştirmek için, öncelikle Node.js'in sisteminizde kurulu olması gerekmektedir. Ardından, Electron ve TypeScript'i projenize dahil etmek için gerekli adımları takip edelim.

npm init -y
npm install electron typescript --save-dev

Yukarıdaki komut ile yeni bir Node.js projesi oluşturup, Electron ve TypeScript kütüphanelerini yüklemiş olduk.

Proje Yapısı Oluşturma

Projenizin dosya yapısını oluşturmalısınız. Aşağıdaki gibi bir yapıyla başlayabilirsiniz:

• src/
     main.ts
     index.html
• package.json
• tsconfig.json

Bu yapıyı oluşturduktan sonra, tsconfig.json dosyanızı şu şekilde yapılandırabilirsiniz:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "outDir": "dist",
    "strict": true,
    "esModuleInterop": true
  }
}

Basit Bir Elektron Uygulaması Oluşturma

Şimdi de main.ts dosyanızda basit bir Electron uygulaması oluşturabilirsiniz:

import { app, BrowserWindow } from 'electron';

function createWindow() {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  });

  win.loadFile('index.html');
}

app.whenReady().then(createWindow);

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

Bu kod örneği, Electron uygulamanızın ana penceresini oluşturur. Uygulamayı başlatmak için npx electron . komutunu kullanabilirsiniz.

Sonuç

Electron ve TypeScript kullanarak çapraz platform masaüstü uygulamaları geliştirmek oldukça kolaydır. Bu makalede, Electron çerçevesinin ve TypeScript'in nasıl entegre edileceğini ve basit bir uygulamanın nasıl oluşturulacağını öğrendik. Daha karmaşık uygulamalar geliştirmek için bu temel bilgiler üzerine daha fazla detay ekleyebilirsiniz.