Bu eğitimde, Express çerçevesini inceleyeceğiz. Bu çerçeve, minimal ve esnek bir Node.js web uygulaması çerçevesi olarak hareket edecek şekilde oluşturulmuştur ve tekli ve çok sayfalı ve hibrit web uygulaması oluşturmak için sağlam bir özellikler kümesi sağlar.
Bu eğitimde öğreneceksiniz-
- Express.js nedir?
- Express'i yükleme ve kullanma
- Rotalar nedir?
- Express.js kullanan örnek Web sunucusu
Express.js nedir?
Express.js, tek sayfalı, çok sayfalı ve hibrit web uygulamaları oluşturmak için özel olarak tasarlanmış bir Node js web uygulama sunucusu çerçevesidir.
Node.js için standart sunucu çerçevesi haline geldi. Ekspres, MEAN yığını olarak bilinen bir şeyin arka uç kısmıdır.
MEAN, aşağıdaki bileşenlere sahip dinamik web siteleri ve web uygulamaları oluşturmak için ücretsiz ve açık kaynaklı bir JavaScript yazılım yığınıdır;
1) MongoDB - Standart NoSQL veritabanı
2) Express.js - Varsayılan web uygulamaları çerçevesi
3) Angular.js - Web uygulamaları için kullanılan JavaScript MVC çerçevesi
4) Node.js - Ölçeklenebilir sunucu tarafı ve ağ uygulamaları için kullanılan çerçeve.
Express.js çerçevesi, GET, PUT ve POST ve DELETE istekleri gibi birden çok istek türünü işlemek için kullanılabilecek bir uygulama geliştirmeyi çok kolaylaştırır.
Express'i yükleme ve kullanma
Express, Node Package Manager aracılığıyla kurulur. Bu, komut satırında aşağıdaki satırı çalıştırarak yapılabilir.
npm hızlı yükleme
Yukarıdaki komut, Düğüm paketi yöneticisinden gerekli ekspres modülleri indirmesini ve uygun şekilde kurmasını ister.
Yeni kurulan Express çerçevemizi kullanalım ve basit bir "Merhaba Dünya" uygulaması oluşturalım.
Uygulamamız 3000 numaralı portu dinleyecek basit bir sunucu modülü oluşturacaktır. Örneğimizde bu port numarası üzerinden tarayıcı üzerinden bir talep yapılırsa sunucu uygulaması istemciye bir 'Merhaba' Dünya 'yanıtı gönderecektir. .
var express=require('express');var app=express();app.get('/',function(req,res){res.send('Hello World!');});var server=app.listen(3000,function() {});
Kod Açıklaması:
- İlk kod satırımızda, "ekspres modülü" eklemek için require işlevini kullanıyoruz.
- Ekspres modülü kullanmaya başlamadan önce, onun bir nesnesini yapmamız gerekiyor.
- Burada bir geri arama işlevi oluşturuyoruz. Bu işlev, herhangi biri http: // localhost: 3000 olan web uygulamamızın köküne göz attığında çağrılacaktır . Geri arama işlevi, 'Merhaba Dünya' dizesini web sayfasına göndermek için kullanılacaktır.
- Geri arama işlevinde, "Merhaba Dünya" dizesini istemciye geri gönderiyoruz. "Res" parametresi, içeriği web sayfasına geri göndermek için kullanılır. Bu 'res' parametresi, bir kişinin içeriği web sayfasına geri göndermesini sağlamak için 'istek' modülü tarafından sağlanan bir şeydir.
- Daha sonra, sunucu uygulamamızın 3000 numaralı bağlantı noktasındaki istemci isteklerini dinlemesi için dinleme işlevini kullanıyoruz. Herhangi bir kullanılabilir bağlantı noktasını buradan belirtebilirsiniz.
Komut başarıyla yürütülürse, kodunuzu tarayıcıda çalıştırdığınızda aşağıdaki Çıktı gösterilecektir.
Çıktı:
Çıktıdan
- Bağlantı noktası 3000'de localhost'un URL'sine göz attığımızda, sayfada 'Merhaba Dünya' dizesini göreceğinizi açıkça görebilirsiniz.
- Kodumuzda, sunucunun 3000 numaralı bağlantı noktasını dinlemesi için özel olarak bahsettiğimiz için, bu URL'ye göz atarken çıktıyı görüntüleyebiliyoruz.
Rotalar nedir?
Yönlendirme, bir uygulamanın belirli bir uç noktaya yönelik bir istemci isteğine nasıl yanıt vereceğini belirler.
Örneğin, bir müşteri aşağıda gösterilenler gibi çeşitli URL'ler için GET, POST, PUT veya DELETE http talebinde bulunabilir;
http://localhost:3000/Bookshttp://localhost:3000/Students
Yukarıdaki örnekte,
- İlk URL için bir GET isteği yapılırsa, yanıt ideal olarak bir kitap listesi olmalıdır.
- İkinci URL için GET talebi yapılırsa, yanıt ideal olarak bir Öğrenci listesi olmalıdır.
- Bu nedenle, erişilen URL'ye bağlı olarak, web sunucusunda farklı bir işlevsellik çağrılacak ve buna göre yanıt istemciye gönderilecektir. Yönlendirme kavramı budur.
Her rota, rota eşleştiğinde yürütülen bir veya daha fazla işleyici işlevine sahip olabilir.
Bir yol için genel sözdizimi aşağıda gösterilmiştir
app.METHOD(PATH, HANDLER)
Neredeyse,
1) uygulama, ekspres modülün bir örneğidir
2) METHOD bir HTTP istek yöntemidir (GET, POST, PUT veya DELETE)
3) PATH, sunucudaki bir yoldur.
4) HANDLER, rota eşleştiğinde yürütülen işlevdir.
Ekspres içinde yolları nasıl uygulayabileceğimizin bir örneğine bakalım. Örneğimiz şu şekilde 3 rota oluşturacaktır:
- Bu rotaya erişilirse "Düğümde Eğitim" dizesini görüntüleyecek A / Düğüm yolu
- Bu rotaya erişilirse "Açısal Eğitim" dizesini görüntüleyen A / Açısal rota
- "Guru99 Öğreticilerine Hoş Geldiniz" dizesini görüntüleyen varsayılan bir yol /.
Temel kodumuz önceki örneklerle aynı kalacaktır. Aşağıdaki kod parçası, yönlendirmenin nasıl uygulandığını gösteren bir eklentidir.
var express = require('express');var app = express();app.route('/Node').get(function(req,res){res.send("Tutorial on Node");});app.route('/Angular').get(function(req,res){res.send("Tutorial on Angular");});app.get('/',function(req,res){res.send('Welcome to Guru99 Tutorials');}));
Kod Açıklaması:
- Tarayıcıda http: // localhost: 3000 / Node URL'si seçilmişse burada bir yol tanımlıyoruz . Rotaya, Düğüm URL'sine göz attığımızda çağrılacak bir geri arama işlevi ekliyoruz.
Fonksiyonun 2 parametresi vardır.
- Kullanacağımız ana parametre, müşteriye geri bilgi göndermek için kullanılabilecek 'res' parametresidir.
- 'Req' parametresi, yapılan istek hakkında bilgi içerir. Bazen, yapılan talebin bir parçası olarak ek parametreler gönderilebilir ve bu nedenle 'req' parametresi, gönderilen ek parametreleri bulmak için kullanılabilir.
- Düğüm yolu seçilirse, "Düğümde Eğitim" dizesini istemciye geri göndermek için gönderme işlevini kullanıyoruz.
- Tarayıcıda http: // localhost: 3000 / Angular URL'si seçilmişse burada bir rota tanımlıyoruz . Rotaya, Angular URL'ye göz attığımızda çağrılacak bir geri arama işlevi ekliyoruz.
- Açısal yol seçilirse, "Açısal Öğretici" dizesini istemciye geri göndermek için gönderme işlevini kullanıyoruz.
- Bu, uygulama rotasına göz atıldığında seçilen varsayılan yoldur - http: // localhost: 3000 . Varsayılan rota seçildiğinde, istemciye "Guru99 Öğreticilerine Hoş Geldiniz" mesajı gönderilecektir.
Komut başarıyla yürütülürse, kodunuzu tarayıcıda çalıştırdığınızda aşağıdaki Çıktı gösterilecektir.
Çıktı:
Çıktıdan
- Bağlantı noktası 3000'deki localhost URL'sine göz attığımızda, sayfada 'Guru99 Eğitimlerine Hoş Geldiniz' dizesini göreceğinizi açıkça görebilirsiniz.
- Çünkü kodumuzda, varsayılan URL'mizin bu mesajı göstereceğinden bahsetmiştik.
Çıktıdan
- URL'nin / Düğüm olarak değiştirilmiş olması durumunda, ilgili Düğüm yolunun seçileceğini ve "Düğümde Öğretici" dizesinin görüntülendiğini görebilirsiniz.
Çıktıdan
- URL'nin / Açısal olarak değiştirilmiş olması durumunda, ilgili Düğüm yolunun seçileceğini ve "Açısal Öğretici" dizesinin görüntülendiğini görebilirsiniz.
Express.js kullanan örnek Web sunucusu
Yukarıdaki örneğimizden, yönlendirmeye dayalı olarak hangi çıktının gösterileceğine nasıl karar verebileceğimizi gördük. Bu tür yönlendirme, günümüzün modern web uygulamalarının çoğunda kullanılan şeydir. Bir web sunucusunun diğer kısmı, Node js'deki şablonları kullanmakla ilgilidir.
Anında hızlı Node uygulamaları oluştururken, kolay ve hızlı bir yol, uygulama için şablonlar kullanmaktır. Piyasada şablon yapmak için birçok çerçeve mevcuttur. Bizim durumumuzda, templating için yeşim çerçevesi örneğini alacağız.
Jade, Düğüm Paketi yöneticisi aracılığıyla kurulur. Bu, komut satırında aşağıdaki satırı çalıştırarak yapılabilir.
npm yeşim yükle
Yukarıdaki komut, Düğüm paketi yöneticisinden gerekli jade modüllerini indirmesini ve uygun şekilde yüklemesini ister.
NOT: Node jade'in son sürümünde kullanımdan kaldırılmıştır. Bunun yerine pug kullanın.
Yeni yüklediğimiz jade çerçevemizi kullanalım ve bazı temel şablonlar oluşturalım.
Adım 1) İlk adım, bir yeşim şablonu oluşturmaktır. İndex.jade adlı bir dosya oluşturun ve aşağıdaki kodu ekleyin. Dosyayı "görünümler" klasöründe oluşturduğunuzdan emin olun
- Burada, bu şablon çağrıldığında sayfanın başlığının geçirilen değerle değiştirileceğini belirtiyoruz.
- Ayrıca, başlık etiketindeki metnin, jade şablonunda geçirilen her şeyle değiştirileceğini de belirtiyoruz.
var express=require('express');var app=express();app.set('view engine','jade');app.get('/',function(req,res){res.render('index',{title:'Guru99',message:'Welcome'})});var server=app.listen(3000,function() {});
Kod Açıklaması:
- Uygulamada belirtilmesi gereken ilk şey, şablonları oluşturmak için kullanılacak "görünüm motoru" dur. Şablonlarımızı oluşturmak için yeşim kullanacağımız için bunu buna göre belirliyoruz.
- Oluşturma işlevi, bir web sayfasını oluşturmak için kullanılır. Örneğimizde, daha önce oluşturulmuş şablonu (index.jade) oluşturuyoruz.
- "Guru99" ve "Welcome" değerlerini sırasıyla "title" ve "message" parametrelerine geçiriyoruz. Bu değerler, index.jade şablonunda belirtilen 'başlık' ve 'mesaj' parametreleri ile değiştirilecektir.
Komut başarıyla yürütülürse, kodunuzu tarayıcıda çalıştırdığınızda aşağıdaki Çıktı gösterilecektir.
Çıktı:
Çıktıdan
- Sayfa başlığının "Guru99" olarak ayarlandığını ve sayfanın başlığının "Hoş Geldiniz" olarak ayarlandığını görebiliriz.
- Bunun nedeni node js uygulamamızda çağrılan jade şablonudur.
Özet
- Ekspres çerçeve, Node js uygulamaları geliştirmek için kullanılan en yaygın çerçevedir. Ekspres çerçeve, node.js çerçevesinin üzerine inşa edilmiştir ve sunucu tabanlı uygulamaların gelişiminin hızlı izlenmesine yardımcı olur.
- Rotalar, yapılan talebe göre kullanıcıları web uygulamalarının farklı bölümlerine yönlendirmek için kullanılır. Her yol için yanıt, kullanıcıya neyin gösterilmesi gerektiğine bağlı olarak değişebilir.
- İçeriği verimli bir şekilde enjekte etmek için şablonlar kullanılabilir. Jade, Node.js uygulamalarında kullanılan en popüler şablonlama motorlarından biridir.