Node.js Turkish Tutorial Part 4

in #utopian-io8 years ago (edited)

NODE.JS LOGOo.png
Source

Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient. The Node.js package ecosystem, npm, is the largest ecosystem of open source libraries in the world.
Source

Linklerimiz:
Github
Node.js Web Sitesi


What Will I Learn?Neler Öğreneceğim?
- Node.js Express Module- Node.js Express Modulü
- Node.js Express Module Setup- Node.js Express Modülü Kurulumu
- Node.js Express Module Usage- Node.js Express Modülü Kullanımı

RequirementsGereksinimler
- Visual Studio Code (Website)- Visual Studio Code (Website)
- Intermediate Node.js knowledge- Orta Düzeyde Node.js bilgisi

DifficultyZorluk
- Intermediate- Orta

Curriculum (Bu konuyla ilgili tüm içeriklerim)

Part 1: Node.js Turkish Tutorial Part 1
Part 2: Node.js Turkish Tutorial Part 2
Part 3: Node.js Turkish Tutorial Part 3


Tutorial Contents (Yazının İçeriği)

Bugün sizlere node.js tutoriallerimizin 4.dersinde express modülü nedir, nasıl yüklenir,nasıl kullanılır bunları anlatmaya çalışıcağım.Bu postumu okumadan önce eğer node.js için 1. ve 2. ve 3.dersimi okumadıysanız okumanızı öneririm.2. dersimde visual studio code programını anlatmıştım bundan sonraki eğitimlerimde kodlamalar için o programı kullanıcağım.3. dersimde ise node.js için modül yüklemesini göstermiştim express'ide 3.dersimde gösterdiğim şekilde yükliyiceğiz.

Express Modülü Nedir ?
Express modülü node.js'de daha önce basit bir şekilde web server kurmuştuk fakat web server'da yapıcağımız tüm değişiklikleri teker teker yeni dosyalar açarak her yeni sayfa için örnek olarak login ekranı için yeni dosya anasayfa için yeni dosya gibi yeni dosyalar açarak kodlamalarımızı yapıcaktık fakat express modülü burada yardımımıza koşuyor.Express modülü ile web sunucumuza gelen istekleri düzenleme,yanıtlama,yönetme gibi işlemleri kolayca yapabiliriz.

İlk olarak express modülümüzü projemize yüklememiz lazım.3. Tutorial'imde nasıl kurulucağını detaylı bir şekilde anlatmıştım fakat yinede kendim yüklemeyi yaparken bu tutorial için anlatıcağım.

Express Modülü Kurulumu

Daha önce gösterdiğim node.js kodlamaları için kullandığım visual studio code programımızı açıyoruz.Daha sonra package.json adında bir dosya oluşturuyoruz.
express 1.png

Output kısmından termınal seçeneğine geliyoruz ve ben global olarak yüklemek istiyorum bu yüzden termınal satırına

npm install express -g

yazıyoruz.Ve otomatik olarak express modülümüzü kuruyor.
express 2.png
Express modülümüzü kurmuş olduk.Şimdi express ile ilk deneme olarak basit bir http sunucu oluşturalım.

Express Modülü İle Http Sunucusu Oluşturmak
Visual studio code'de yeni bir dosya açıyoruz adını app.js yapıyoruz.
express 3.png
Şimdi kodlarımızı yazalım

const express = require("express");
const app = express();

app.listen(1453, function () {

console.log("Express modulu sunucumuza hosgeldiniz");

});

Evet express modülümüz ile bir http sunucusu oluşturmuş olduk.
express 4.png

Express http sunucumuzu oluşturduk şimdi bu sunucu içerisinde nasıl yönetim yapıcağız express modülü ile gelin bunları inceliyelim.

Express Modülünde İstekleri Yönetmek
Express modülü bize esnek istek yönetim imkanı sunar.Ayrıca gelen istek yöntemleri içinde özel metotlar tanımlıdır.Örnek olarak "GET" metodu ile gelen isteklere cevap verirken get metodu kullanılır.Bunun için bir örnek kodlama yapalım.

const express = require("express");
const app = express();

app.get("/", function (req, res) {

res.send("Merhaba Express");

//res.send("Merhaba Express");

});

app.post("/", function (req, res) {

res.send("Merhaba Sayın Express");

});

app.listen(1453, function () {

console.log("Sunucu çalışıyor.. ");

});
express 5.png

Bu kodları açıklamak gerekirse bize gelen bir Merhaba Express yazısına bizim express modülümüz cevap olarak Merhaba Sayın Express yazıcaktır.Bu şekilde kendi kodlarınıza ve isteklerinize göre düzenlemeler yapabilirsiniz.

Bize istekte bulunan bir metine metinle cevap vermeyi öğrendik peki gelen isteklere bir dosya vermek istersek hangi metodu kullanıcağız.Bunun için ise sendFile metodunu kullanıcağız bir örnek de sendFile metodu için yazalım.

const express = require("express");
const app = express();

app.get("/", function (req, res) {

res.sendFile(__dirname + "/index.html");

});

app.listen(1453, function () {

console.log("Sunucu çalışıyor..");

});
express 6.png

Bu şekilde gelen isteğe bir dosya gönderebiliriz. "res.sendFile(__dirname + "/index.html");"kodumuz hangi dosyayı göndericeğimizi göstermektedir.Bu örnekte anasayfamıza gelen bir istekte aynı klasörde bulunan index.html dosyası gönderilicektir.

Dosya göndermede farkettiyseniz sadece 1 dosya göndermeyi gösterdim fakat geliştirdiğiniz web sayfasında birden fazla JavaScript veya resim kullanabilirsiniz.Ancak node.js ile her dosya isteğine ayrı ayrı cevap vermek kodların hem çok uzamasına hemde kodların durmadan tekrarlanmasına sebep olur.Express içerisinde statik/sabit dosyaların yolunu tanımlamak için biz static metodunu kullanıcağız.Uygulamada kullanılan dosyaların dosyalarım ismindeki klasörde css, js ve resimler klasöründe saklandığını varsayalım.Dosya içerisindeki statik dosyalarımızın http isteklerine cevap vermesi için kullanıcağımız kodlar

const express = require("express");
const app = express();

app.use(express.static(__dirname + "/dosyalar"));

//app.use(express.static("dosyalar"));

app.listen(1453, function () {

console.log("Sunucu çalışıyor..");

});
express 7.png

bu şekildedir.Bu kodlardan sonra dosyalar klasöründeki statik dosya ve klasörlere
localhost:1453/resimlerim/kompela144.jpg yoluna benzer bir yol ile ulaşabilirsiniz.
Statik dosyaları farklı bir ad ile çağırmak isterseniz önüne adını yazmanız yeterlidir.Bunuda bir örnek kodlama ile göstereyim.

const express = require("express");
const app = express();

app.use("/kompela144", express.static(__dirname + "/dosyalar"));

app.listen(1453, function () {

console.log("Sunucu çalışıyor...");

});
express 8.png

Artık dosyalar klasörüne kompela144 adıyla erişebiliriz.

Express Modülü İle Sayfa Yönlendirmek
Express modülü istek ve cevap parametrelerine çeşitli metotları ekliyerek isteklere daha esnek cevap verilmesini sağlamaktadır.
Express modülü cevap parametresi redirect metodu ile gelen bir isteği farklı bir web sitesine yönlendirebiliriz.Bunun için ise kullanıcağımız kod metodu

const express = require("express");
const app = express();

app.get("/", function (req, res) {

res.redirect("https://utopian.io/@kompela144");

});

app.listen(1453, function () {

console.log("Sunucu çalışıyor...");

});
express 9.png

bu şekildedir.Bundan sonra anasayfamıza gelen istekleri utopian.io/@kompela144 adresine yönlendirmiş olduk.

Peki siz yönlendirmeyi express modülü ile başka bir sayfaya değilde sayfa içerisinde bir dosyaya yapmak isterseniz sadece klasör ismini yazmanız yeterlidir.

const express = require("express");
const app = express();

app.get("/panel", function (req, res) {

res.redirect("/giris");

});

app.listen(1453, function () {

console.log("Sunucu çalışıyor..");

});
express 10.png

Bu şekilde klasör ismini değiştirerek gelen isteği sayfa içerisinde bir dosyaya yönlendirebilirsiniz.

Node.js için express modülü hakkında anlatıcaklarım bu kadardı iyi günler dilerim.Sonraki eğitimlerimizde görüşmek üzere.



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Thank you for the contribution. It has been approved.

  • Please put the codes in the code blocks.
  • Do remember to use code blocks in the future tutorials to avoid rejection.
    You can contact us on Discord.
    [utopian-moderator]

Hey @manishmike10, I just gave you a tip for your hard work on moderation. Upvote this comment to support the utopian moderators and increase your future rewards!

Detaylı bilgi için teşekkür ederim.

Ben teşekkür ederim size birşeyler katabildiysem ne mutlu :)

Your contribution cannot be approved because it does not follow the Utopian Rules, and is considered as plagiarism. Plagiarism is not allowed on Utopian, and posts that engage in plagiarism will be flagged and hidden forever.

You can contact us on Discord.
[utopian-moderator]

Coin Marketplace

STEEM 0.04
TRX 0.33
JST 0.078
BTC 62741.70
ETH 1659.93
USDT 1.00
SBD 0.42