Ikinci partta biraz olayin teknik kismini ele alalim;
Webserverin calisma mantigi?
Bir Webserver'in temel gorevi dosyalarin Internet uzerinden erisebilir kilmasidir.
Sunucumuzda surekli calisir, browserimizden server'e gonderilen requestleri dinler.
Browserimiz bir request yolladiginda Webserver bu dosyanin browser'e ulasmasini ve requestlere gore cevap gonderilmesini saglar.
Webserverimiz Routing'den sorumlu oldugu kadar HTTP requestlerinin islenmesinden de sorumludur.
Routing isleminde Webserverimiz dogru dosyalarin teslim edilmesini saglar.
Bu simdi ki ornekte onceki 1.partta kullandigim connect kullanmistim, yeni baslayanlara kolaylik amaciyla.
Bu ornekte Express kullanacagiz lakin Syntax konusundan fazla bir farki olmadigi icin, fazla zorlanmayacagiz.
Dizin yapimiz soyle olacak;
nodeapp
-client
-server
--server.js
Simdi connect degil express kullanacagimiz icin npm(Node Package Manager) ile express modulumuzu kuracagiz.
Onceki yazdigim yazida ki kodumuza bakalim;
Simdi express ile yazalim;
Gordugunuz gibi connect ile express arasinda Syntax acisindan fazla farkliliklar yok.
Sadece isimleri degistirdik tabiiri caizse.
express() ' i app adli variable'imiza tanimladik.
Fonksiyonumuz ayni kaliyor, ciktilar vesaire.
Simdi yavastan Webserver programlamaya baslayalim;
Ilk olarak;
Ekleyip express()'i app variable'imiza atiyoruz, erisim kolayligindan.
Middleware Kullanimi;
Express kullanarak static sayfalar sunmak icin bir Middleware en iyisi.
Middleware http requestlerinin handling islemini yapip express() ile bize aktarir bir nevi.
Ustte ki kodumuzda bize yabanci sadece express.static() var. Adindan anlasilacagi uzerine kafanizda bir kac fikir olusmustur.
Static datalarimizi yollar. Bunun icin parametre olarak kok dizin olarak kullanilacak dizin'e ihtiyac duyar.
Bizim durumumuzda dosyanin bulundugu dizinden alacagimiz icin __dirname kullandik, bu calisan dosyanin calistigi dizine delalet eder.
Middleware'imiz express() ile arka arkaya calisiyor, Middleware'imizden sonra yukarida ki kodumuzdanda anlayacaginiz gibi http requestlerinin handling islemi geliyor.
Bu da assagida ki kodumuza tekabul ediyor;
Kodumuzdan da anlayacaginiz uzerine butun adreslerde 404 hatasi verecektir ve bu verecegi 404 hatasina nigss.html'yi aktaracaktir. (Icine 404 error gibi kucuk bir seyler yazabiliriz.)
app.get() parametre olarak bir Route aliyor ( Domain harici URL'yi aliyor. nigss.com/'burasidiyebiliriz' ) ve birde fonksiyon aliyor parametre olarak.
Yani Route cagirildiginda, hangi islemi yapacagimizi soyluyoruz bir nevi.
// tht.com/nig 'e girildiginde nigsmom.html cagir gibisinden.
Ama her seferinde HTML ile 404 hatasi vermek cok sacma oluyor.
Sacma oluyor ama su yonden bakarsak express.static() her hangi bir static data bulamadigi zaman, error mesajimizi veriyor.
Sonra next() adli fonksiyonumuzu cagiriyor, adindan da anlasilacagi gibi diger Middleware islemine atlatiyor.
Ornegimizde Middleware kullanmadigimiz icin, kullandigimiz app.get() direk olarak 404 error verecektir ve bizim belirledigimiz HTML dosyasini browserimize gonderecektir.
Ama biz birazda JavaScript kodu eklemek istersek nasil olacak?
Basit bir ornek anonym bir fonksiyon app.get() ile olusturulup console.log() calistiriliyor.
Response'den URL'imizi yazdiriyor, next() ile diger Middleware'i baslatiyor.
Ekleyerek baska bir URL icin baska dosya cagirabiliriz.
Bu kodumuzda tht.com/debs'a girdigimizde 'debss cagirildi!' diye bir mesaj gosterilecek ve debss.html cagiralacak.
Tabii console.log() disinda daha komplexli kodlar da yazabiliriz her seferinde static dosyalar gondermek zorundada kalmayiz. Dynamic dosyalar da gonderebiliriz.
Biraz karisiklik olabilir, akliniza takildiginiz bir yer var ise sorabilirsiniz.
Hayirli aksamlar
Webserverin calisma mantigi?
Bir Webserver'in temel gorevi dosyalarin Internet uzerinden erisebilir kilmasidir.
Sunucumuzda surekli calisir, browserimizden server'e gonderilen requestleri dinler.
Browserimiz bir request yolladiginda Webserver bu dosyanin browser'e ulasmasini ve requestlere gore cevap gonderilmesini saglar.
Webserverimiz Routing'den sorumlu oldugu kadar HTTP requestlerinin islenmesinden de sorumludur.
Routing isleminde Webserverimiz dogru dosyalarin teslim edilmesini saglar.
Bu simdi ki ornekte onceki 1.partta kullandigim connect kullanmistim, yeni baslayanlara kolaylik amaciyla.
Bu ornekte Express kullanacagiz lakin Syntax konusundan fazla bir farki olmadigi icin, fazla zorlanmayacagiz.
Dizin yapimiz soyle olacak;
nodeapp
-client
-server
--server.js
Simdi connect degil express kullanacagimiz icin npm(Node Package Manager) ile express modulumuzu kuracagiz.
Kod:
npm install express
Kod:
const connect = require('connect');
var server = connect().
use(function(req,res) {
res.end('Nigs');
}).
listen(64352); // Port numarasi
console.log("Server kendi siteniz; portAdresinde baslatildi.");
Kod:
const express = require('express'); // Express modulumuz
var app = express();
var server = app.use(function(req, res) { //request response falan
res.sen("Nigs");
});
app.listen(64352);Sadece isimleri degistirdik tabiiri caizse.
express() ' i app adli variable'imiza tanimladik.
Fonksiyonumuz ayni kaliyor, ciktilar vesaire.
Simdi yavastan Webserver programlamaya baslayalim;
Ilk olarak;
Kod:
var express = require('express');
var app = express();Middleware Kullanimi;
Express kullanarak static sayfalar sunmak icin bir Middleware en iyisi.
Middleware http requestlerinin handling islemini yapip express() ile bize aktarir bir nevi.
Kod:
var express = require('express);
var app = express();
app.use('/', express.static(__dirname));
app.get('/*', function(req, res) {
res.status(404).sendfile(__dirname + '/nigss.html');
});Static datalarimizi yollar. Bunun icin parametre olarak kok dizin olarak kullanilacak dizin'e ihtiyac duyar.
Bizim durumumuzda dosyanin bulundugu dizinden alacagimiz icin __dirname kullandik, bu calisan dosyanin calistigi dizine delalet eder.
Middleware'imiz express() ile arka arkaya calisiyor, Middleware'imizden sonra yukarida ki kodumuzdanda anlayacaginiz gibi http requestlerinin handling islemi geliyor.
Bu da assagida ki kodumuza tekabul ediyor;
Kod:
app.get('/*', function(req, res) {
res.sendfile(__dirname + '/nigss.html');
});app.get() parametre olarak bir Route aliyor ( Domain harici URL'yi aliyor. nigss.com/'burasidiyebiliriz' ) ve birde fonksiyon aliyor parametre olarak.
Yani Route cagirildiginda, hangi islemi yapacagimizi soyluyoruz bir nevi.
// tht.com/nig 'e girildiginde nigsmom.html cagir gibisinden.
Ama her seferinde HTML ile 404 hatasi vermek cok sacma oluyor.
Sacma oluyor ama su yonden bakarsak express.static() her hangi bir static data bulamadigi zaman, error mesajimizi veriyor.
Sonra next() adli fonksiyonumuzu cagiriyor, adindan da anlasilacagi gibi diger Middleware islemine atlatiyor.
Ornegimizde Middleware kullanmadigimiz icin, kullandigimiz app.get() direk olarak 404 error verecektir ve bizim belirledigimiz HTML dosyasini browserimize gonderecektir.
Ama biz birazda JavaScript kodu eklemek istersek nasil olacak?
Kod:
var express = require('express');
var app= express();
app.use(function(req, res, next){
console.log(req.url); next();
});
app.use('/', express.static(__dirname));
app.get('/*', function(req, res) {
es.status(404).sendfile(__dirname + '/nigss.html');
});
app.listen(64352);Response'den URL'imizi yazdiriyor, next() ile diger Middleware'i baslatiyor.
Kod:
app.get('/debs', function(req, res) {
console.log('debss cagirildi!');
res.sendfile(__dirname + '/debss.html');Bu kodumuzda tht.com/debs'a girdigimizde 'debss cagirildi!' diye bir mesaj gosterilecek ve debss.html cagiralacak.
Tabii console.log() disinda daha komplexli kodlar da yazabiliriz her seferinde static dosyalar gondermek zorundada kalmayiz. Dynamic dosyalar da gonderebiliriz.
Biraz karisiklik olabilir, akliniza takildiginiz bir yer var ise sorabilirsiniz.
Hayirli aksamlar
Son düzenleme:
