TypeScript ile API Client Oluşturma Adımları

Modern web uygulamalarında, API'lerle etkileşim kurmak çoğunlukla kaçınılmazdır. TypeScript, JavaScript'in güçlü bir üst kümesi olarak, özellikle büyük uygulamalarda geliştirme sürecini daha güvenilir ve sürdürülebilir hale getirir. Bu makalede, TypeScript kullanarak basit bir API istemcisi (client) oluşturma adımlarını ele alacağız. API istemcimizin, belirli bir RESTful servise istek gönderip dönen verileri nasıl işleyeceğini gözlemleyeceğiz.

TypeScript Nedir?

TypeScript, Microsoft tarafından geliştirilmiş açık kaynaklı bir programlama dilidir. JavaScript'in bir üst kümesi olarak, statik tip kontrolü, sınıf tabanlı nesne yönelimli programlama ve modern JavaScript özelliklerini destekler. TypeScript kullanarak, büyük ve karmaşık projelerinizde daha sağlam bir yapıya ulaşabilir, kodunuzu daha iyi organize edebilir ve hata ayıklama sürecini hızlandırabilirsiniz.

API Client Oluşturma

TypeScript ile basit bir API istemcisi oluşturmak için öncelikle gerekli bağımlılıkları yüklemeniz gerekiyor. Proje dizininde aşağıdaki npm komutunu çalıştırarak Axios kütüphanesini yükleyelim:

npm install axios

Şimdi, basit bir `apiClient.ts` dosyası oluşturalım. Bu dosyada API'ye istek gönderecek bir sınıf (class) tanımlayacağız:

import axios, { AxiosInstance } from 'axios';

class ApiClient {
    private axiosInstance: AxiosInstance;

    constructor(baseURL: string) {
        this.axiosInstance = axios.create({
            baseURL: baseURL,
            timeout: 1000,
        });
    }

    public async get(endpoint: string) {
        try {
            const response = await this.axiosInstance.get(endpoint);
            return response.data;
        } catch (error) {
            console.error('API isteği hatası:', error);
            throw error;
        }
    }
}

export default ApiClient;

Yukarıdaki kodda, API istemcisini tanımlamak için Axios kütüphanesini kullanıyoruz. `constructor` metodunda temel URL’yi alıp Axios örneğini oluşturuyoruz. Ayrıca `get` metodu ile belirtilen uç noktaya (endpoint) GET isteği gönderiyoruz. Hata durumunda ise basit bir hata mesajı log'lanmakta.

Kullanım Örneği

Artık istemcimizi kullanabiliriz. Aşağıda, `main.ts` dosyası oluşturarak bu istemcinin nasıl kullanılacağını gösterelim:

import ApiClient from './apiClient';

const client = new ApiClient('https://jsonplaceholder.typicode.com');

async function fetchData() {
    try {
        const data = await client.get('/posts');
        console.log(data);
    } catch (error) {
        console.error('Veri alırken hata oluştu:', error);
    }
}

fetchData();

Burada, JSONPlaceholder API'sinden veri çekiyoruz. `fetchData` fonksiyonu, API istemcimizi kullanarak '/posts' uç noktasına GET isteği gönderiyor ve sonucu konsola yazdırıyor.

Sonuç

Bu makalede, TypeScript kullanarak basit bir API istemcisi oluşturmanın adımlarını öğrendik. TypeScript'in sağladığı tip güvenliği ve hata ayıklama kolaylıkları, geliştirme sürecini oldukça sadeleştiriyor. Daha karmaşık API etkileşimleri için ek fonksiyonellikler ekleyerek bu temel API istemcisini genişletebilir, TypeScript'in avantajlarını daha fazla keşfedebilirsiniz.