Bu doküman ingilizce dokümana göre eski olabilir. Son güncellemeler için lütfen İngilizce Dokümanı. ziyaret edin

Express ile şablon motorları kullanmak

Şablon motoru, uygulamanızda statik şablon dosyaları kullanmanızı sağlar. Çalışma zamanında, şablon motoru bir şablon dosyasındaki değişkenleri alıp gerçek değerleyler değiştirir, ve şablonu bir HTML dosyasına dönüştürüp istemciye gönderir. Bu yaklaşım bir HTML sayfasını tasarlamayı kolaylaştırır.

Express ile çalışan bazı popüler şablon motorları: Pug, Mustache, ve EJS. Express uygulama üreteci (generator) varsayılan olarak Jade kullanıyor, ancak aynı zamanda diğerlerini de destekler.

Express ile kullanabileceğiniz şablon motorları listesi için bakınız Şablon Motorları (Express wiki). Ayrıca bakınız: JavaScript Şablonlama Motorlarını Karşılaştırma:: Jade, Mustache, Dust ve Daha fazla.

Not: Jade, Pug olarak değiştirildi. Uygulamanızda Jade kullanmaya devam edebilirsiniz, ve problem olmadan çalışacaktır. Ancak şablon motorunun en son güncellemelerini almak istiyorsanız, uygulamanızda Jade’i Pug ile değiştirmelisiniz.

Şablon dosyalarını işlemek için, aşağıdaki uygulama ayarları özelliklerini ayarlayın, üretici (generator) tarafından yaratılan varsayılan uygulamada app.js dosyasında ayarlayın:

Daha sonra ise, ilgili şablon motorunun npm paketini yükleyin; örneğin Pug yüklemek için:

$ npm install pug --save

Jade ve Pug gibi Express-uyumlu şablon motorları, şablon kodunu işlemek için res.render() tarafından çağrılan __express(filePath, options, callback) isimli bir fonksiyon dışa aktarır.

Bazı şablon motorları bu anlayışı takip etmez. Consolidate.js kütüphanesi bu anlayışı bütün popüler Node.js şablon motorlarını eşleyerek (mapping) takip eder, ve dolayısıyla Express içinde sorunsuz çalışır.

Görünüm motoru ayarlandıktan sonra, uygulamanızda motoru tanımlamanıza veya şablon motoru modülünü yüklemenize gerek yok; Aşağıda gösterildiği gibi (yukarıdaki örnek için) Express, modülü kendi içinde yükler.

app.set('view engine', 'pug')

Aşağıdaki içerikle, views dizininde index.pug adlı bir Pug şablon dosyası yarat:

html
  head
    title= title
  body
    h1= message

Ardından, index.pug dosyasını işlemek için bir rota yaratın. view engine özelliği ayarlanmadıysa, view dosyasının uzantısını belirtmelisiniz. Aksi takdirde belirtmenize gerek yok.

app.get('/', (req, res) => {
  res.render('index', { title: 'Hey', message: 'Hello there!' })
})

Ana sayfaya bir istek yaptığınızda, index.pug dosyası HTML olarak gösterilecek.

Not: Görünüm motoru önbelleği şablonun çıktısını önbelleğine almaz, sadece şablonun temelini alır. Önbellek açık olsa bile, görünüm her istekle beraber yeniden işlenir.

Şablon motorlarının Express’te nasıl çalıştıkları ile ilgili daha fazla bilgi için bakınız: “Express için şablon motorları geliştirme”.