DEV Community

Koray Barkin
Koray Barkin

Posted on

3 1

Liman'da Eklenti Geliştirme

Bize tanımlanmış IP üzerinden Liman’a giriş yaptıktan sonra Sistem Ayarları sekmesine gelerek Eklentiler’i seçiniz. Eğer burada Yeni sekmesini görmüyorsanız Mert Çelen’in paylaştığı rehberden Eklenti Geliştirme Ortamı Kurulumunu yapmanız gerekmektedir.

Yeni butonuna basarak eklentinizin ismini girerek oluşturmaya başlayalım.

Eklentimizi geliştirmek için eklentiyi bir sunucuya atamamız gerekmektedir. Bu atamayı sol taraftan Sunucular sekmesine giderek yapabiliriz. Açılan ekranda + işaretine basıp eklemek istediğiniz sunucuyu seçiniz. (Eğer görünürde bir sunucunuz yoksa, ilk önce sunucu oluşturmanız gerekmektedir.)

Liman’da yapacağımız işlemler şimdilik bu kadar. Geliştirme ortamınız da hazırsa Visual Studio Code yardımı ile eklentimizi geliştirebiliriz.

Visual Studio Code’u açalım ve Remote SSH ile Liman sunucumuza bağlanalım. Bağlandıktan sonra sol üstten Open Folder diyerek /liman/extensions/ klasörüne gelip oluşturduğunuz eklentiyi seçiniz.

Açılan eklentide view klasörü altında bir functions.php ve bir tane de index.blade.php adında iki tane dosyamızın olduğunu göreceğiz. Şimdi, Liman sunucumuzdaki bilgileri ya da sizin bilgisayarınızın bileşenlerinin bilgilerini çektiğimiz bir eklenti yapabiliriz. Aşağıdaki kodu functions.php dosyasına yapıştıralım.

<?php
function index(){
    return view("index");
}

function getHOSTinfo(){
    $hostInfo = runCommand("hostname");
    return respond($hostInfo,200);
}

function getIPinfo(){
    $ipInfo = runCommand("ip a");
    return respond($ipInfo,200);
}

?>
Enter fullscreen mode Exit fullscreen mode

Şimdi burada tam olarak neler oluyor? getHOSTinfo fonksiyonunda, içerisinde bulunan runCommand’e hostname değerini gönderdik. Bu komut içerisine gönderdiğimiz değeri sunucumuzda terminal’e yazdığımızda çıkan sonucu döndürmektedir. Terminal’i açıp hostname yazdığımızda sunucumuzun adının yazdığını görürüz. Biz de bu eklentide sunucumuzun adını çağırmak istiyoruz ve çıkan sonucu eklentimize eklemek istiyoruz. Altındaki getIPinfo fonksiyonu da aynı işlemi yapmaktadır, IP bilgilerini öğrenmek için ip a komutunu runCommand’e gönderiyoruz. Ve son olarak da return respond ile eğer gönderdiğimiz HTTP talebinden 200 kodu dönüyorsa bu komutları tanımladığımız değeri gönder diyoruz.

Şimdi de index.blade.php dosyamıza geçelim. Aşağıda paylaştığım kodu index.blade.php dosyasına yapıştırın.

<ul class="nav nav-tabs" role="tablist" style="margin-bottom: 15px;">
  <li class="nav-item">
    <a class="nav-link active" onclick="getIP()" href="#ipTab" data-toggle="tab">IP Bilgileri</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" onclick="getHost()" href="#hostTab" data-toggle="tab">Host Bilgileri</a>
  </li>
</ul>

<div class="tab-content">
    <div id="ipTab" class="tab-pane active">
    <pre id="ipPre"></pre>
    </div>

    <div id="hostTab" class="tab-pane">
    <pre id="hostPre"></pre>
    </div>

</div>

<script>
function getIP(){
  request(API("getIPinfo"), new FormData(), function(response){
    msg = JSON.parse(response).message;
    $('#ipPre').html(msg);
  }, function(response){
    console.log("HATA!");
  });
}
function getHost(){
  request(API("getHOSTinfo"), new FormData(), function(response){
    msg = JSON.parse(response).message;
    $('#hostPre').html(msg);
  }, function(response){
    console.log("HATA!");
  });
}

if(location.hash === ""){
    getIP();
}
</script>

Enter fullscreen mode Exit fullscreen mode

Verimizi direkt yazdırmamız mümkün, fakat daha şık bir görüntü olsun diye Tab’lı yapıda veriyi kullanmak istedim. Şimdi ise getIP ve getHost fonksiyonlarında neler döndüğünü inceleyelim. İki fonksiyonda da sunucumuza request (talep) gönderiyoruz. Endpoint URL’mizin sonuna function.php’de yazdığımız fonksiyonların adını yazdığımızda orada dönen verinin JSON biçimin de döndüğünü görebiliriz. Biz de bir FormData oluşturarak, eğer requestimizden bir response dönüyorsa veriyi parse et ve sadece message başlığını döndür diyoruz ve bu mesajı yukarıda belirttiğimiz id’ye gönderiyoruz. Eğer response dönmüyorsa, ikinci satıra gir ve konsola Hata! yaz dedik. Bunu da debug yaparken response’un durumunu takip etmek için kullanabiliriz.

Son olarak da if(location.hash === “”) diyerek sayfa yüklendiğinde index’te ise yüklemesini istediğimiz fonksiyonu yazıyoruz. Yani eklentiyi ilk açtığımızda karşımız IP bilgileri gözükecek.

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more