Express.js Nedir?

NodeJS Web Application Framework

Single Page Application (SPA) ve Progressive Web App (PWA) yazılarına kaldığımız yerden devam edelim. Vakit olursa, konuyu ayrıca Vue – Server Side Rendering ile de genişletmeye çalışacağım.

AA

Bu yazıda web uygulama çatısı olarak kullanılabilecek Node.js modüllerinden biri olan Express.js’den bahsederek başlayalım.

Express.js

Express.js modülü / paketi, Node.js tabanlı bir web uygulama sunucu çatısıdır. Express.js’nin sunduğu sınırsız HTTP yardımcı araçları ve katmanlar sayesinde sağlam bir API oluşturmak oldukça hızlı ve kolaydır.

Express.js, ayrıca MEAN yazılım demeti bileşenlerinden biridir. MEAN (MongoDB, Express.js, Angular.js ve Node.js), web uygulamaları ve dinamik web siteleri geliştirmek için kullanılan, ücretsiz ve açık kaynak kodlu yazılım demetidir. Ayrıca, Express.js MEAN dışında pek çok framework’ün de parçasıdır. Liste için Frameworks built on Express1 başlıklı listeye göz atabilirsiniz.

Express.js Modülünün Sağladığı Avantajlar

  • Kolay ve hızlı bir şekilde Web uygulamaları geliştirme imkanı sağlar,
  • Pug2, EJS3, Handlebars gibi şablon motorları (template engine) uygulama geliştirme süreçlerinde kullanılabilir,
  • Orta katman (Middleware) modülleri ile kapsamlı uygulamalar geliştirilebilir,
  • Route (Yönlendirme) yöntemiyle web istekleri yönetilebilir,
  • MySQL, MongoDB, SQL SERVER gibi veritabanı uygulamaları uygulamalarda kullanılabilir.
  • Farklı uygulamalar için REST API oluşturmak mümkündür,
  • Statik dosyaların yönetimini kolaydır,

Routing olarak, Express.js örnek alınarak geliştirilmiş, basit bir kullanıma sahip Page.js4 de seçenek olarak değerlendirilebilir.

Express.js desteği olan metotlar: get, post, put, head, delete, options, trace, copy, lock, mkcol, move, purge, unlock, report, mkactivity, checkout, merge, m-search, notify, subscribe, unsubscribe, patch, search.

Express.js Kullanım Örneği

NPM veya Yarn ile projemizi başlatalım.

yarn init -y
# ya da
npm init -y

Artık express modülünü indirebiliriz.

yarn add express --save
# ya da
npm install express –-save

Aşağıdaki içeriği index.js (farkı bir entry point tercih etmemiş isek) olarak kayıt edelim.

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => res.send('Merhaba Dünya!'))
app.listen(port, () => console.log(`Example app listening on port ${port}!`))

Başlangıç aşamasında bu basit örnek işimizi görecektir. Artık 3000 no’lu port üzerinden / isteğine dönecek res.send() içeriği olan Merhaba Dünya! mesajını görüntüleyebiliriz. Yapmamız gereken node ile entry point’i işleme almak.

node index.js

İnternet tarayıcımızın adres satırına localhost:3000 yazarak örneğimizi görüntüleyebiliriz. Örneğimizi biraz daha geliştirelim ve res.send() yerine res.sendFile() ile bir dosya içeriğini cevap olarak gönderelim. Son durumda, index.js içeriğimiz şu şekilde olacaktır.

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => res.sendFile(__dirname + '/index.html');
app.listen(port, () => console.log(`Example app listening on port ${port}!`))

Örneğe son olarak statik dosyalarımızı (örneğin /assets klasörü) da dahil edelim.

const express = require('express')
const app = express()
const port = 3000

app.use(express.static(__dirname + '/assets'));
app.get('/', (req, res) => res.sendFile(__dirname + '/index.html'));
app.listen(port, () => console.log(`Example app listening on port ${port}!`))

/assets içeriğinde style.css adında basit bir stil dosyası oluşturdum. Aşağıda index.html ve style.css dosya içeriklerini görebilirsiniz.

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8" />
  <title>Hello World!</title>
  <link rel="stylesheet" href="style.css" />
</head>

<body>
  <h1>Hello World!</h1>
</body>

</html>
body {
  color: red;
}

Tüm işlemlerimiz bu kadar! Örnekte işlenen konularla ilgili bilgi için Basic Routing5 ve Hello world example6, Express.js ile ilgili diğer tüm detaylar için ise Electron Documentation7 sayfasına göz atabilirsiniz.