Kategoriler
Kodlama

Google Sheets’i basit veritabanı olarak kullanmak

Google Sheets/E-tablolar Masaüstünde kullandığımız Microsoft Office benzeri ama daha fazlası. Google Drive içerisinde kullanılabilen bu uygulama ile birçok farklı uygulamalar geliştirilebiliyor.

Google Sheets verileri ile bir web sitesi bile kurmak mümkün, burada ben Vue.js ve Papa Parse JavaScript kütüphanelerini kullanarak bir Google e-tablosundan veri alarak tarayıcıda gösterebilmeyi deneyeceğim.

Öncelikle bu uygulamanın kaynağı @bornfight_(Alen Duda)’dır. Şimdi hemen onun yaptığı örneği görmek için CodePen’den bakabilirsiniz.

Yapmamız gerekenler:

Veri tabanı olarak kullanacağımız bir Google Sheets tablosu oluşturmak, bunu Google Drive’a giriş yapıp orada yeni bir Google Sheets dosyası oluşturarak ve o dosyayı “Web’de yayınla/Publish to the web” olarak paylaşıma açarak yapabilirsiniz. Ardından dosyanın URL’ini alın, uygulama için gerekecek.

Dosyamızın adresi(URL)’leri şu şekiklde JavaScript içerisine ekleyecceğiz:

const moviesUrl =
  "https://docs.google.com/spreadsheets/d/e/2PACX-1vTtKbv_S8Fdo3HLhm64Tc94WZ6FuqtzqePIjuejNFJxKkUvAE8JF8V2KgKoz1n5jQUDfL8A3F-QoDWk/pub?gid=0&single=true&output=csv";

const showsUrl =
  "https://docs.google.com/spreadsheets/d/e/2PACX-1vTtKbv_S8Fdo3HLhm64Tc94WZ6FuqtzqePIjuejNFJxKkUvAE8JF8V2KgKoz1n5jQUDfL8A3F-QoDWk/pub?gid=1364847678&single=true&output=csv";

Daha sonra Vue ile şu şekilde işleyebiliriz:

const app = new Vue({
  el: "#app",
  data: function () {
    return {
      movies: [],
      shows: []
    };
  },

Ve şöyle bir örnek dosyamız oluyor:

created: function () {
    this.fetchMovies();
    this.fetchShows();
  },
  methods: {
    fetchMovies() {
      Papa.parse(moviesUrl, {
        download: true,
        header: true,
        complete: (results) => this.movies = results.data
      });
    },
    fetchShows() {
      const _this = this;
      Papa.parse(showsUrl, {
        download: true,
        header: true,
        complete: function(results) {_this.shows = results.data;}
      });
    }
  }

HTML’imiz ise aşağıdaki gibi:

<div id="app">
  <table v-if="movies.length">
    <thead>
      <tr>
        <th>Title</th>
        <th>Year</th>
        <th>URL</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="movie in movies">
        <td>{{movie.Title}}</td>
        <td>{{movie.Year}}</td>
        <td><a :href="movie.Url" target="_blank">{{movie.Url}}</a></td>
      </tr>
    </tbody>
  </table>

  <table v-if="shows.length">
    <thead>
      <tr>
        <th>Title</th>
        <th>Last watched season</th>
        <th>URL</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="show in shows">
        <td>{{show.Title}}</td>
        <td>{{show["Last watched season"]}}</td>
        <td><a :href="show.Url" target="_blank">{{show.Url}}</a></td>
      </tr>
    </tbody>
  </table>
</div>

Bu makalemizde amaçlı basittir ve yalnızca veri kaynağı olarak Google E-Tablolar kullanılarak nelerin mümkün olabileceğine giriş yaptık. İşbirliğine dayalı yapısı, her zamanki gibi okuma/yazma erişimini sınırlama yeteneğini korurken, ön uç güncellemesini (çok temel bir CMS’e benzer) yapan değişiklikler yapmayı kolaylaştırır.

Bununla birlikte, sınırlamalar vardır – hız, olası hız sınırlaması ve CSV seçeneğini gelecekte kullanılabilir durumda tutmak için Google’a bağımlılık. Bu nedenle, bu hiçbir zaman daha uygun bir veritabanı ve arka uç kombinasyonunun yerini almayacaktır, ancak yine de hızlı prototip oluşturma ve eğlenceli mini projeler için yararlı olabilir, özellikle de veriler zaten mevcutsa. Veriler zaten mevcutsa dedik çünkü örneğin Google Formlar ile bir anket oluşturdunuz ve form verilerini dinamik canlı olarak web sayfası veya uygulamanız içerisinde göstermek isterseniz bu yöntem harika bir seçim olabilir. Büyük projeler için yukarıda bahsettiğim sebeplerden ötürü önermiyorum.

Kolay gelsin.

wolkanca.com’da Google Sheets’i basit veritabanı olarak kullanmak veya diğer konular hakkında herhangi bir sorunuz varsa, sosyal medya butonları ile yorum ya da mesaj göndermekten çekinmeyin, Google Sheets’i basit veritabanı olarak kullanmak için ya da değil DM kapısı her daim açık. Yazıyı beğendiyseniz paylaşın, daha fazla ilgili gönderi için hemen aşağıdaki menülere göz gezdirebilirsiniz, okuduğunuz için teşekkürler, saygılar sevgiler.

WOLKANCA

Volkan Yılmaz

Digital Marketing & WordPress & SEO - wolkanca mahallesi gmail sokak nokta com.