Vue için Bebek Adımları

Yazılım işine girdiğimden beri en çok zorlandığım konu Frontend tarafta kodlama yapmak. Ne yazık ki sadece Backend tarafta kalmak lüksümüz de pek bulunmuyor. Örneğin hali hazırda çalışmakta olduğum firmada yeni nesil birçok uygulama önyüz tarafında çeşitli Javascript çatıları(Framework) kullanılıyor. Pratikte bakınca oldukça iyi bir kurgu aslında. Önyüzü Vue, React vb yapılarla geliştirip, asıl iş kuralları için arka planda yer alan .Net Core Web API servislerine gelmek. C# ve .Net Core tarafına aşina olduğum için arka planı rahatça kodluyorum, önyüz tarafında ise önceden geliştirilmiş sayfalara bakarak bir şeyler yapabiliyorum. Yani işin özü Vue.Js çatısının temellerinde sorunlarım var. Bu amaçla SkyNet'e uğradığım bir gün oturdum ekran başına en basit adımlarıyla bu işi nasıl öğrenirim bir kurcalayayım dedim. [Daha fazla]

Nginx Kurgulu Hafif Bir Load Balancer Senaryosu

Dünyanın en popüler ve hızlı proxy serverlarıdan birisi sanıyorum ki Nginx. Daha önce birçok kez onun üzerinde .Net Core tabanlı servisleri konuşlandırmıştım. Ancak bu defa Nginx'in talepleri dengeli bir şekilde dağıtacak şekilde(Load Balancer olarak) nasıl kullanacağımızı öğrenmeye çalışacağız. Senaryo gereği NodeJS ile yazılmış basit bir dummy servisin birkaç kopyasını çalıştıracağız. Aynı makinede farklı port adresleri üzerinden hizmet verecek bu servislere gelen taleplerin dağıtımını, Load Balancer görevini üstlenecek olan Nginx sunucusu üstlenecek. Ben bu kurguyu her zaman yaptığım gibi Heimdall(Ubuntu-20.04) üzerinde icra ediyorum. Ancak teorik olarak farklı platformlarda da benzer şekilde ilerleyebilirsiniz. Sisteminizde docker ve NodeJs'in yüklü olması şu an için yeterli. Nginx sunucusunu makineye kurmaktansa Docker imajı ile çalışmak çok daha mantıklı olacaktır. Hatta bu kurgu özelinde kendi docker imajımızı kullanıp Nginx konfigurasyonlarını bu Container içerisinde yapacağız. Öylese işe Dummy servisimizi yazarak başlayabiliriz. [Daha fazla]

Sequelize Kullanılan Bir NodeJs Rest Servisi Geliştirmek

Epey zamandır Nodejs ile kod yazmamıştım. Bu öğretideki amacım Postgresql veritabanını kullanan bir REST servisini NodeJs ile geliştirmekti. Kod tarafındaki Entity nesneleri ile Postgresql arasındaki ORM(Object Relational Mapping) katmanında Sequelize paketini kullanmayı öğrenmeye çalışıyordum. Postgresql tarafı içinse sistemi kirletmemek adına Docker imajından yararlandım. Önce onun ayağa kaldırarak işe başlayabiliriz. [Daha fazla]

Şu Docker-Compose Dedikleri

Aslında birden fazla Container söz konusu olduğunda bunların yönetimi için kullanılan araçlardan birisi Docker-Compose. Senaryoda farklı dillerde yazılmış üç servisi kullanmak istiyorum. Birisi .Net Core ile yazılmış Web Api, diğeri Flask kullanan Python ve sonuncusu da Express bazlı NodeJs uygulaması. Servislerin ne iş yaptığı çok önemli değil. Odaklanmamız gereken nokta Dockerfile içerikleri ile docker-compose.yml üstünde Container kompozisyonunun nasıl tasarlandığı olacak. Buradaki servislere birde veritabanı bağımlılığı eklemeyi denemek gerçek hayat senaryolarını tatbik etmek adına iyi olabilir. Örneğin Nodejs uygulamasının Postgresql kullanacak şekilde dockerize edilmesi ve Postgresql için docker-compose'da bir imajın kullanılacağının ifade edilmesi iyi bir pratik olacaktır. Üstelik bu tip bir kurgu eğer eğitmenseniz de çok işinize yarayacaktır. Biz şimdi işimize geri dönelim. [Daha fazla]

Sıkça Duyduğum Deno'ya Hello Dedim

Şu sıralar adını sıklıkla duyduğum ve NodeJs'in yerini alır mı almaz mı tartışmalarını(ki öyle bir şey yok) okuduğum Deno'yu basit bir örnekle inceledim. Javascript haricinde dahili olarak Typescript desteği de sunan, V8 üzerinde koşan ve Rust ile yazılmış bir çalışma zamanı olarak nitelendiriliyor Deno. Ben nasıl bir geliştirme tecrübesi yaşatacağını tatmak istemiştim. Klasik kurgu olarak REST tipinden bir servisin birkaç operasyonunu icra etsem yeterliydi. Örnek verileri almak için International Chuck Norris veritabanını kullandım :D Keza biraz eğlence katmak lazımdı olaya. Hatta verileri SQLite veritabanında tutmak da fena olmayacak. [Daha fazla]

Bir React Uygulamasında En Ala SQL Veritabanını Kullanmak

Öğrenecek bir şeyler araştırırken AlaSQL isimli bir çalışma ile karşılaştım. Tarayıcı üzerinde çalışabilen istemci taraflı bir In-Memory veritabanı olarak geçiyor. Tamamen saf Javascript ile yazılmış. Geleneksel ilişkisel veritabanı özelliklerinin çoğunu barındırıyor. Group, join, union gibi fonksiyonellikleri karşılıyor. In-Memory tutulan veriyi kalıcı olarak saklamakta mümkün. Hatta bu noktada localStorage olarak ifade edilen yerel depolama'dan veri okunup tekrar yazılabiliyor. IndexedDB veya Excel'ide fiziki repository olarak kullanabiliyor. Ayrıca JSON nesnelerle çalışabiliyoruz ki bu da NoSQL desteği anlamına gelmekte. Benim amacım onu yalın bir React uygulamasında deneyimlemeye çalışmak. [Daha fazla]

Hasura GraphQL Engine ile geliştirilmiş bir API Servisini Vue.js ile Kullanmak

API'ler için türlendirilmiş(typed) sorgulama dillerinden birisi olarak öne çıkan GraphQL'e bir süredir uğramıyordum. Daha doğrusu GraphQL sorgusu çalıştırılabilecek şekilde API servis hazırlıklarını yapmaya üşeniyordum. Bu nedenle işi kolaylaştıran ve Heroku üzerinden sunulan Hasura GraphQL Engine hizmetine bakmaya karar verdim. Hasura, veriyi PostgreSQL kullanarak saklıyor ve ayrıca API'yi bir Docker Container içerisinden sunuyor. Amacım Hasura tarafında hazırlayacağım iki kobay veri setini, Vue.js tabanlı bir istemcisinden tüketmek. Basitçe listeleme yapıp, veri ekleme işini yapabilsem başlangıç aşamasında yeterli olur. İşe Hasura servisini hazırlayarak başlamak lazım. [Daha fazla]

Azure SignalR Servisini Kullanmak

Amacım Azure platformunda sunulan SignalR hizmetini kullanarak abonelere bildirimlerde bulunabilmek. Normal SignalR senaryosundan farklı olarak, istemciler ve tetikleyici arasındaki eş zamanlı iletişimi (Real Time Communications) Azure platformundaki bir SignalR servisi ile gerçekleştirmeye çalışacağım. Senaryomuzda bildirimleri gören en az bir istemci (ki n tane olması daha anlamlı), local ortamda çalışan ve bildirim yayan bir Azure Function uygulaması ve Azure platformunda konuşlandırılan bir SignalR servisi olacak. Azure üzerinde koşan SignalR servisi Serverless modda çalışacak şekilde ayarlanacak. [Daha fazla]

React Üzerinde Socket.IO Kullanımı

Bir süre önce eski bir meslektaşım OBD2 portlarından nasıl bilgi okuyabileceğimizi sormuştu. Bu konuyu araştırırken kendimi çok farklı bir yerde buldum. OBD2 portu ile bir arabadan veri almak mümkün. Peki bir yarış sırasındaki tüm araçların hız, motor sıcaklığı, anlık devir vb bilgilerini aktarabildiğimizi düşünsek. Bir şekilde veriyi bir yerlere bastığımızı varsayarsak (anten, radyo sinyali vb düzenekler ile), onun yarışı mobil cihazlarındaki uygulamadan takip edenlere anında gönderimi için nasıl bir yol izleyebiliriz? İşte araştırma sırasında geldiğim nokta buydu. Donanımsal gereksinimleri bir kenara bırakırsak bunun minik bir POC çalışmasını denemek istedim. [Daha fazla]

Firebase Cloud Messaging ile Abonelere Bildirim Yollamak

Tarayıcı üzerinde yaşayan ve çevrim dışı ya da çok düşük internet hızlarında da çalışabilme özelliğine sahip olan PWA(Progressive Web Applications) uygulamalarının en önemli kabiliyetlerinden birisi de Push Notification'dır. Bu, mobil platformlardan yapılan erişimler düşünüldüğünde oldukça önemli bir nimettir. Arka planda içerik güncelleme (updating) özelliği de bir diğer önemli kabiliyettir. Bu yetenekler uygulama için tekrardan submit operasyonuna gerek kalmadan güncel kalabilmek anlamına da gelir. [Daha fazla]

Bir Web Uygulamasında Gantt Chart Kullanımı

Henry Gantt tarafından icat edilen Gantt tabloları, proje takvimlerinin şekilsel gösteriminde kullanılmaktadır. Temel olarak yatay çubuklardan oluşan bu tablolarda proje planlarını, task'ları, süreleri ve ilerleyişi görmek mümkündür. Excel üzerinde bile kullanılabilen Gantt Chart'lar sanıyorum proje yöneticilerinin de vazgeçilmez araçlarındandır. Benim amacım ise dhtmlxGantt isimli Javascript kütüphanesinden yararlanarak bir Asp.Net Core projesinde Gantt Chart kullanmak. [Daha fazla]

MongoDb,Express,Vue ve Node Birlikteliği

Amacım bu 4 enstrümanı kullanarak Web API tabanlı çalışan basit bir web uygulaması geliştirmek. Veriyi tutmak için MongoDB'yi, sunucu tarafı için Node.js'i, Web Framework amacıyla Express'i ve önyüz geliştirmesinde de Vue.js'i kullanmak istedim. Kobay olarakta 90lardan aklıma gelen ve Cobol öğretirlerken gösterdikleri Fihrist örneğini seçtim. Ayrıca WebPack'i de işin içerisine katıp paketleme operasyonunu da deneyimlemeye çalıştım. [Daha fazla]

Angular ile Yazılmış Bir Web Uygulamasını PWA Uyumlu Hale Getirmek

PWA(Progressive Web App) tipindeki uygulamalar özellikle mobil cihazlarda kullanılırken sanki AppStore veya PlayStore'dan indirilmiş native uygulamalarmış gibi görünürler. Ancak native uygulamalar gibi dükkandan indirilmezler ve bir web sunucusundan talep edilirler. Https desteği sunduklarından hat güvenlidir. Bağlı olan istemcilere push notification ile bildirimde bulunabilirler. Cihaz bağımsız olarak her tür form-factor'ü desteklerler. Bu uygulama modelinde Service Worker'lar iş başındadır ve sürekli taze kalınmasını sağlarlar. Düşük internet bağlantılarında veya internet olmayan ortamlarda çevrim dışı da çalışabilirler. URL üzerinden erişilen uygulamalar olduklarından kurulum ihtiyaçları yoktur. [Daha fazla]

Google Cloud Fonksiyonlarını Firebase ile Birlikte Kullanmak

Bulut çözümlerin sunduğu imkanlardan birisi de sunucu oluşturma, barındırma, yönetme gibi etkenleri düşünmemize gerek kalmayacak şekilde uygulama geliştirme ortamları sağlamalarıdır. Bazen bulut platform üzerinde sunulan bir veritabanı ile konuşan servis kodlarını yine o platformun sunucularında barındırmak suretiyle hizmet sağlarız. Söz gelimi Google'ın Firebase veritabanı ve onu kullanan servis tabanlı fonksiyonları Google Cloud Platform üzerinde konuşlandırabiliriz. Bu örnekteki amacım da Firebase ile ilişkili bir uygulama servisini Google Cloud Platform üzerinde fonksiyonlaştırabilmek. Her zaman olduğu gibi örneği WestWorld (Ubuntu 18.04, 64bit) üzerinde geliştiriyorum. [Daha fazla]

Angular ile Basit Bir Görevler Listesi Uygulaması Yazmak

Bu çalışmadaki temel amacım Angular ile basit bir Hello World uygulaması oluşturmak. Güncel Angular bilgim oldukça düşük olduğu için bu tip bir çalışma içerisine girdim diyebilirim. Nitekim şirketteki projelerde Vue.js kullanılıyor ancak ben Angular tarafını da öğrenmek istiyorum. Çalışmayı uzun zamandır yaptığım gibi yine WestWorld (Ubuntu 18.04, 64bit) üzerinde icra etmekteyim. [Daha fazla]

Peki ya Kong Kim?

Hali hazırda çalışmakta olduğum firmada, microservice'lerin orkestrasyonu için KONG isimli bir araç kullanılıyor. Kabaca bir API Gateway rolünü üstlenen KONG microservice'lere gelen request'lerle ilgili olarak Load Balancing, Authentication, Rate Limiting, Caching, Logging gibi cross-cutting olarak tabir edebileceğimiz yapıları hazır olarak sunuyor(muş) Web, Mobil ve IoT gibi uygulamalar geliştirirken backend servisleri çoğunlukla microservis formunda yaşamaktalar. Bunların orkestrasyonunda görev alan KONG, Lua dili ile geliştirilmiş performansı ile ön plana çıkan NGINX üzerinde koşan açık kaynaklı bir proje olmasıyla da dikkat çekiyor. [Daha fazla]

Angular ile Basit Bir Tahmin Oyunu Yazmak

Angular tarafını yavaş yavaş tanımaya başlıyorum. Ancak bilgilerimi pekiştirmek için farklı öğretileri uygulamaya devam etmem gerekiyor. Bu kez temelleri basit şekilde anlamak adına bir şehir tahmin oyunu yazmaya karar verdim. Uygulama havanın rastsal durumuna göre kullanıcısına bir soru soracak ve hangi şehirde olduğunu bulmasını isteyecek. Kabaca şu aşağıdaki cümleye benzer bir düşünce ile yola çıktım. [Daha fazla]

Apollo Server ile Bir GraphQL Sunucusu Yazmak

Apollo Server, web, mobile gibi istemciler için GraphQL servisi sunan bir ürün olarak düşünülebilir. Otomatik API doküman desteği sunar ve herhangibir veri kaynağını kullanabilir. Yani bir veri tabanını veya bir mikroservisi ya da bir REST APIyi, GraphQL hizmeti verebilecek şekilde istemcilere açabilir. Tek başına sunucu gibi çalıştırılabileceğinden de ilgimi çekti aslında. Pek tabii Heroku gibi ortamlarca Serverless modda da kullanılabiliyor. [Daha fazla]

HTTP/2 Server Push Nasıl Bir Şeydir?

HTTP/2 protokolü ile gelen önemli özelliklerden birisi de, tek bir TCP/IP bağlantısında sunucudan istemciye birden fazla dosya içeriğinin gönderilebilmesidir. Yazının ilerleyen kısımlarında kaynakçada işlenen node.js örneğini ele alacak ve çalışma zamanındaki işleyişleri irdelemeye çalışacağız. [Daha fazla]

Servis Çıktılarını Plotly.js ile Grafikleştirmek

West-World'de eğlence tüm hızı ile devam ediyor. Bu geceki "Easy Graphics of new Era" isimli partinin onur konuğu ise açık kaynak javascript grafik kütüphanesi Plotly. Oldukça renkli bir kişiliğe sahip olan plotly github şehrinin de en sevilen karakterlerinden birisi. Kendisini West-World'e getirense en yakın arkadaşları D3.js ve WebGL. Ona West-World sakinleri adına bir soru yönelttik ve izleyicilerini nasıl büyülediğini sorduk. Enerjik ve içten uslübuyla "dans figürlerimi çalışırken çoğunlukla JSON ve CSV melodilerinden ilham alıyorum. Kareografide uzun zamandarı Mr. jQuery ile ilerliyorum. Ayrıca Node'un bana sağladığı içsel motivasyondan bahsetmeden geçemem. Hepsi içimde harika bir karmanın oluşmasına neden oluyor. Sonuç gülümseyen ve ritmime uymaya çalışan insanların ortaya çıkarttığı müthiş enerji" diyor... [Daha fazla]

Node.js - Asenkron Talep Karşılama

Bu yazımızda Node.js ile geliştirilmiş sunucu uygulamalarında async kullanımını inceleyeceğiz. Amacımız istemci talebi sonrası arka planda paralel servis çağrıları gerçekleştirmek ve ayrıca bu süreç sırasında sunucuya gelecek diğer isteklerinde değerlendirilebileceğini görmek. Bunlara ilaveten ön tarafta konuşlandıracağımız ana servisin bir yönlendirici(router) gibi kullanılabileceğini öğreneceğiz. Haydi gelin hiç vakit kaybetmeden serüvenimize başlayalım. Konuyu basit bir şekilde anlayabilmek adına örnek bir senaryo üzerinden gitmekte yarar var... [Daha fazla]

Electron ile Cross-Platform Uygulama Geliştirmek

Haftasonu kendimi bir şekilde ilginç bir maceranın içerisinde buldum. West-World'de Windows Forms benzeri bir uygulama yazabileceğimi ve bunu hem macos hem de windows platformunda yapabileceğimi öğrendim. Bunun için HTML, Node.js ve CSS yeterli. İşin aslı electron isimli açık kaynak geliştirilen ürün sayesinde platform bağımsız masaüstü uygulamaları geliştirmek mümkünmüş. Hızlı bir deneyim için interneti taramaya ve basit bir "Hello World" yazmaya karar verdim. Amacım West-World(Ubuntu) üzerinde geliştireceğim masaüstü uygulamasını hem macox hem de windows üzerinde çalıştırabilmekti... [Daha fazla]

Eğlenceli SignalR

Bu yazımızda, Chart.js kütüphanesini kullanarak, tarayıcı üzerindeki bir grafiğin SignalR üzerinden nasıl beslenebileceğini incelemeye çalışıyoruz. Bunu yaparken Chart.js'in nefis özelliklerini kullacağız ama daha da önemlisi verilerin belirli periyotlarla istemci tarafına akmasını ve grafik üzerinden anlık(SignalR kullanmamızın bir sebebidir) olarak izlenebilmesini sağlayacağız. [Daha fazla]

Stream ve Pipe Mevzusu

Node.js tarafında anlaşılması en zor konulardan birisinin stream'ler olduğu söyleniyor. Özellikle event ve multi-process gibi konularlar yakın temas içerisinde. Ancak benim dikkatimi çeken nokta okuduğum bir yazı üzerine önüme gelen performans. Özellikle büyük veri ile çalışan bir web sunucusu söz konusu ise stream nesnelerinin pipe mekanizması ile birlikte kullanılıyor olması önem arz eden bir konu. Gelin ne demek istediğimi benden daha iyi özetleyecek basit bir örnek ile konuya giriş yapalım. [Daha fazla]

Pug, Pug, Pug

Bu makalemizde Node.js üzerinde express kullanarak basit bir web sayfasının nasıl gösterilebileceğini incelemeye çalışıyoruz. Ancak farklı olarak Pug(eski adı Jade) isimli paketten yararlanarak html içeriğini çok daha farklı bir şekilde tasarlıyoruz. Bu tasarım sırasında HTML'in klasik açısal ayraç sistemini terk ediyor ve girintili(tab'lı) yazım stiline geçiyoruz. [Daha fazla]