Empowering insights. Preserving privacy.

Self-hosting with superpowers.

Son zamanların belki de en popülerleşen web geliştirme frameworklerinden birisi olan Next.js, benim de alet çantamda bulunan oldukça güçlü bir alet. Hem arkasında [Vercel](https://vercel.com/) gibi güçlü bir şirket olması, hem de [React](https://react.dev/) ekosisteminin büyüklüğü tarafından benimsenmesi ile oldukça hız kazanarak gelişmeye devam ediyor.

Her ne kadar getirdiği yapılar itibariyle eskiden kullandığımız tamamı server side çalışan uygulamalara benzese de, aralarında reactivity gibi büyük bir fark bulunmakta. Bütün bu sunucu taraflı çalışan mekanizmayı reaktif programlama ile süslemek takdire şayan. Aynı proje içerisinde client side rendering, server side rendering ve static rendering tekniklerini birleştiriyor olabilmeniz, bir çok konuda elinizi kolaylaştırıyor. Tabii içerisinde sunucu taraflı çalışan bir yapı olduğu için backend yazmanıza da olanak tanıyor. Tüm bu özellik seti Next.js'i hızlıca ürünler çıkarmak için doğru araçlardan birisi yapıyor.

Şimdi kısaca bazı özelliklerinden bahsedelim, daha sonra da kendimce olumlu ve olumsuz yorumlarımdan bahsedeceğim. Şimdiden iyi okumalar.





Next.js nedir, nasıl kullanılır gibi detaylara değindiğim bu yazıda kişisel tecrübelerime olabildiğince yer vermeye çalıştım.

Next.js Hakkında Kişisel Görüşlerim

Herkese merhabalar, uzun zamandır birşeyler yazayım çizeyim, üreteyim diye çok hevesliydim. Ufak bir güven gelince video içerik üretmeye başladım hemen. Tabii bu ürettiklerimi yazılı bir platform ile de desteklemek istedim. Bu sebeple, kişisel günlük ve portfolyo tarzında ilerleteceğim bu siteyi yapma kararı aldım. 

## Neler Paylaşacağım?
Yeni şeyler denemeyi hayatın her alanında seviyorum, çok paylaşmak istesem de bu konuda biraz eksik kalıyordum. Deneyimlerimi daha fazla somutlaştırmak adına burayı kullanmayı deneyeceğim. Bu doğrultuda yediğim yemeklerden tutun, keşfettiğim yeni teknolojileri kendi yorumlarım ile hem yazılı hem görsel olarak burada paylaşacağım. Yazıyı yazarken henüz bir galeri ve video listeleme özelliği olmasa da ihtiyaç duydukça geliştirip eklemesini yapacağım. Şu anlık MVP olarak ilerliyoruz :)

## Hangi Teknolojileri Kullandım?
Kişisel ve profesyonel hayatımda da sıkça kullandığım teknoloji çantama bu siteyi yaparken de yer verdim. Frontend uygulamasını geliştirirken kolay kolay vazgeçemeyeceğim bir framework olan [Next.js](https://nextjs.org/) kullandım. Bir haber sitesi gibi anlık olarak sürekli güncellenen bir site olmadığı için sayfaları statik olarak oluşturuyorum. Hem build anında generation yapılıyor, hem de dilediğim zaman revalidation yolu ile sayfaları güncelleyebiliyorum. 

Sitedenin dinamikliğini sağlamak adına, tüm verileri saklayıp yönetmekle kalmayıp, benim için bir backend oluşturan ve her şeyi yönetmemi sağlayan [Directus](https://directus.io/)'ı tercih ettim. Kolaylıkla data modelleri oluşturup formlar aracılığı veri girişi, görsel yüklemesi gibi şeyler yapabiliyorsunuz. Çok daha fazla özelliği mevcut fakat ona daha sonra detaylıca değineceğiz.

Her ne kadar uzunca bir site çok ziyaretçi almayacaksa olsa da, hatta belki bu yazıyı kimse okumamış bile olabilir, analytics kurmanın motivasyona katkısı olacağını düşündüm. O kadar self-hosted konularında caka satarken tutup Google Analytics koymam yakışmazdı. Bu sebeple tercih hakkımı [Umami](https://umami.is/) ile kullandım. Gelen ziyaretçilerin datasını başka bir yere çıkarmaya şimdilik gerek yok, merak eden inceleyebilir.

Tabi bu yukarıda saydığım servislerin herhangi birine para ödemiyorum, çünkü hepsi açık kaynak aletler. Geliştirenlere buradan teşekkürlerimizi iletmiş olalım. Fakat her ne kadar ücretsiz olsa da bunların bir yerde barınması gerekiyor. Bunun için Hetzner üzerinden aldığım ARM mimarili ufak bir sanal sunucuya, video serilerine başladığım [Coolify](https://coolify.io/) adındaki mucizevi aracı kurdum. Tek tıkla onlarca hazır servis kurabildiğiniz, ayrıca Netlify ve Vercel gibi kendi uygulamarınızı host edebileceğiniz Docker bazlı açık kaynak bir araç. Ne olduğunu anlattığım videomu da aşağıya bırakmış olayım.

<iframe width="560" height="315" src="https://www.youtube.com/embed/qXlFab8OLqY?si=DFW_o1dnck6n9tbz&amp;controls=0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

Şimdilik diyeceklerim bu kadar, umarım benim adıma güzel bir başlangıç olur. Gelecek yazılarda görüşmek üzere, sağlıcakla :)


Yeni başlangıçlara girdiğimiz muhteşem blogumuza hoşgeldiniz. Bu platform neler doğuracak hep beraber göreceğiz...

Hoşgeldiniz

Next.js Hakkında Kişisel Görüşlerim

Son Yazılar

Merhaba Dünya!

Yıldızlar

Bağlantılar