Nuxt 3 JS Nedir? Nasıl Kurulur?

Nuxt JS, VUE JS' ten farklı olarak sunucu tarafında web siteleri geliştirmenizi sağlayan bir VUE JS Freamworkü'dür. Nuxt JS kullanılarak sunucu tarafında derlenen web siteleri geliştirebilirsiniz. Bunun yanında Nuxt' un  web geliştiricilerine sağladığı birçok avantaj bulunmaktadır.

Nuxt JS' in pratikteki faydalarından en önemlisi sunucuda render edilmesidir. Bunu bir örnek üzerinden anlamatmak gerekirse, JS tabanlı bir frontend dili ile web sitenizi oluşturdunuz. Arama motorları web sayfalarınızı doğru kullanıcıya doğru zamanda göstermek için sürekli tarama işlemi yapar. Kullanıcı veya arama motoru sayfanızı ziyaret ettiğinde kendi cihazına bir JS dosyası yüklenir. JS dosyası cihazınızda çalışarak HTML öğelerini oluşturur. Bu işleme istemci taraflı derleme(CSR - Client Side Renderig) adı verilir. Bu örnekte olduğu gibi arama motoru web sayfamızı ziyaret ettiğinde HTML öğelerini göremez. Web sayfamızın arama motorları tarafından anlaşılıp üst sıralarda çıkmasını zorlaştırır.

Gelişmiş frontend dilleri sayesinde kullanıcı deneyimi artırılmıştır ancak taranamayan bir sayfanın kullanıcılara gösterilmesi istenmeyen bir durumdur. Bu noktada Nuxt JS devreye girmektedir. Nuxt JS sayesinde geliştirmekte olduğunuz VUE uygulamasının sunucuda derlenmesini sağlayabilirsiniz. 

Nuxt JS' in bir diğer avantajı ise Routing yapısıdır. Herhangi bir Route ayarı yapmadan sadece sayfanızı eklemeniz yeterlidir. Nuxt arka tarafta otomatik routing işlemini yapacaktır. SEO için önemli konulardan bir tanesi de Meta Etiketleridir. Nuxt herhangi bir eklentiye ihtiyaç duymadan Meta etiketlerini kullanmanıza izin verir.

head() {
      return {
        title: this.title,
        meta: [
          {
            hid: 'description',
            name: 'description',
            content: 'WebDE SEO Description'
          }
        ]
      }
    } 

Nuxt 3, en son yayınlanan stabil sürüm  olarak kullanılmaktadır. Kasım 2022' de yayınlanmıştır. Terminalinize aşağıdaki kod bloğunu yazarak yeni bir NUXT3 JS projesi başlatabilirsiniz.

npx nuxi init <project-name>

NUXT 3 İle Birlikte Gelen Yenilikler

TypeScript Desteği : Nuxt3 temel kurulum ile birlikte gelen typeScript desteğine sahiptir.

Nitro Server Engine : Full Stack geliştirmeler yapmanıza imkan sağlayan yeni sunucu motoru.

Vite & Webpack : Nuxt3 daha hızlı ve yalın bir geliştirme amacıyla kullanılan paketleyici.

Nuxi : Hızlıca yeni projeler oluşturmanızı sağlar.

Nuxt Bridge : Nuxt 2 projelerinizde üzerinde Nuxt 3 kullanmanıza imkan sağlayan ara katmandır.