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.
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.