Web sitesi gelişiminde back-end nasıl çalışıyor?

bitdark · 17 Kasım 2019

Merhaba

Bazen bir konuyu okursunuz okursunuz ama anlamazsınız ve sinir olursunuz. İşte ben şu an tam o durumdayım.

Web sitesi gelişiminde back-end kısmı tam olarak nasıl çalışıyor, NodeJS, Django gibi web frameworkler ne işe yarıyor anlamadım.

Şimdi size anladıklarımı söyleyeyim: web sitesi geliştirirken html ile "çatıyı" oluşturuyoruz. Burası tamam. Eğer sitemizi renklendirmek, tablo filan oluşturmak istiyorsak CSS kullanıyoruz. Eğer sitemizi dinamik yapmak istiyorsak JavaScript kullanıyoruz. Bunlar herhangi bir web sitesini açtığımda görebileceğim şeyler, yani front-end oluyor. Ama back-end kısmını bir türlü anlayamadım. Web sitesinin serveri nasıl çalışıyor, web sitesi ile nasıl bir ilişkisi var falan... Ya da neden Django, NodeJs gibi şeylere ihtiyacımız var.

Bu konulardan anlayan biri basitçe anlatabilir mi? Çok detaya girmeye gerek yok. Programlama mantığını az çok biliyorum. Daha önceden C dilini çalışmıştım.

berk1937 · 17 Kasım 2019

Ana kullanım amacı, veritabanı ile ilgili işlemleri, yönlendirmeleri yapmak denebilir. REST gibi servisleri yazmak için de kullanıyoruz.

Örneğin back-end kullanmayan bir web sitesine girelim. Bu sitede sadece bir adet jpeg dosyası olsun. Bu jpeg dosyasını el ile eklemek zorundayız. Fakat işin içine back-end girdiği zaman, bu jpeg dosyasını el ile eklemek yerine veritabanından çekip, kullanıcıya gösterebiliriz. Bu dosyayı veritabanından çekerken de bir fonksiyon yazıyoruz. Bu fonksiyonları yazarken de, veritabanı işlerini kolaylaştırmak adına ORM framework'lerini kullanıyoruz (Örneğin MongoDB için Mongoose).

Bir örnek daha; mesela ".com/urunler" linkine HTTP GET isteği göndermiş olsun kullanıcı. Bu isteği karşılayıp, uygulamaya yani hazırlamış olduğumuz statik sayfalara ürünleri göndermemiz gerekiyor. Bu durumda yine bir veritabanı işlemi var. NodeJs'de işleri front-end tarafında biraz kolaylaştırmak için Pug template engine kullanılıyor. Mesela bir adet kart oluşturduk diyelim Bootstrap ile (CSS). kaç tane ürün olduğunu bilemeyeceğimiz için, pug dosyası içerisinde bir foreach yapısı oluşturup, bütün ürünleri ayrı kartlara ekleyebiliriz.

Pug dosyasının döngü kısmına örnek:

Kod:

each product in products
    #{product.name}

Bunu yaptığımızda bütün ürünlerin isimlerini yazdıracaktır. Peki bu products nereden geliyor diyecek olursan, express'in render methodu ile kullanıcıya bir sayfa sunarken, o sayfaya belli parametreler sunabiliyoruz, oraya products'ı eklersek, bu şekilde ürünlerin özelliklerine pug dosyasından ulaşabiliyoruz.

JavaScript:

res.render('products', { //buradaki products, views klasörü altındaki products.pug dosyası
        products: products, //veritabanından gelen ürünleri products'a atıyoruz. yukarıdaki producs ile aynı değil. yukarıdaki, dosya ismi
        title: 'Admin Products', //buradan gönderebileceklerimize bir diğer örnek title, bildiğimiz sayfa title'ı, yani title'ın değerini buradan değiştirebiliyoruz
});

Pug ile ayrıca sayfa kısımlarını bölümlendirebiliyoruz.

Veritabanı ihtiyacı yok ise uygulamada, back-end yapılarını kullanmadan da Javascript ile web uygulamaları yapılabiliyor.

Django'yu henüz kullanmadım fakat NodeJs aşırı zor değil. Özellikle ExpressJs ve MongooseJs kullanıp MVC yapısında uygulama yazmak.

bitdark · 17 Kasım 2019

berk1937 dedi:
Ana kullanım amacı, veritabanı ile ilgili işlemleri, yönlendirmeleri yapmak denebilir. REST gibi servisleri yazmak için de kullanıyoruz.

Örneğin back-end kullanmayan bir web sitesine girelim. Bu sitede sadece bir adet jpeg dosyası olsun. Bu jpeg dosyasını el ile eklemek zorundayız. Fakat işin içine back-end girdiği zaman, bu jpeg dosyasını el ile eklemek yerine veritabanından çekip, kullanıcıya gösterebiliriz. Bu dosyayı veritabanından çekerken de bir fonksiyon yazıyoruz. Bu fonksiyonları yazarken de, veritabanı işlerini kolaylaştırmak adına ORM framework'lerini kullanıyoruz (Örneğin MongoDB için Mongoose).

Bir örnek daha; mesela ".com/urunler" linkine HTTP GET isteği göndermiş olsun kullanıcı. Bu isteği karşılayıp, uygulamaya yani hazırlamış olduğumuz statik sayfalara ürünleri göndermemiz gerekiyor. Bu durumda yine bir veritabanı işlemi var. NodeJs'de işleri front-end tarafında biraz kolaylaştırmak için Pug template engine kullanılıyor. Mesela bir adet kart oluşturduk diyelim Bootstrap ile (CSS). kaç tane ürün olduğunu bilemeyeceğimiz için, pug dosyası içerisinde bir foreach yapısı oluşturup, bütün ürünleri ayrı kartlara ekleyebiliriz.

Pug dosyasının döngü kısmına örnek:

Kod:

each product in products #{product.name}

Bunu yaptığımızda bütün ürünlerin isimlerini yazdıracaktır. Peki bu products nereden geliyor diyecek olursan, express'in render methodu ile kullanıcıya bir sayfa sunarken, o sayfaya belli parametreler sunabiliyoruz, oraya products'ı eklersek, bu şekilde ürünlerin özelliklerine pug dosyasından ulaşabiliyoruz.

JavaScript:

res.render('products', { //buradaki products, views klasörü altındaki products.pug dosyası products: products, //veritabanından gelen ürünleri products'a atıyoruz. yukarıdaki producs ile aynı değil. yukarıdaki, dosya ismi title: 'Admin Products', //buradan gönderebileceklerimize bir diğer örnek title, bildiğimiz sayfa title'ı, yani title'ın değerini buradan değiştirebiliyoruz });

Pug ile ayrıca sayfa kısımlarını bölümlendirebiliyoruz.

Veritabanı ihtiyacı yok ise uygulamada, back-end yapılarını kullanmadan da Javascript ile web uygulamaları yapılabiliyor.

Django'yu henüz kullanmadım fakat NodeJs aşırı zor değil. Özellikle ExpressJs ve MongooseJs kullanıp MVC yapısında uygulama yazmak.

Sizce bu, hiç bilmeyen birinin anlayabileceği bir yazı mı?

berk1937 · 17 Kasım 2019

bitdark dedi:
Sizce bu, hiç bilmeyen birinin anlayacabileceği bir yazı mı?

Oturup o kadar detaylıca yazmışım, verdiğiniz cevaba bir bakın. Bilmediğiniz terimleri, anlattıklarım ile "Google"ı birleştirerek öğrenebilirdiniz. Başarılar.

bitdark · 17 Kasım 2019

berk1937 dedi:
Oturup o kadar detaylıca yazmışım, verdiğiniz cevaba bir bakın. Bilmediğiniz terimleri, anlattıklarım ile "Google"ı birleştirerek öğrenebilirdiniz. Başarılar.

İyi de verdiğiniz terim mi? Sanki bilmediğim bir kelimenin anlamına sözlükten bakabilecekmişim gibi konuşuyorsunuz.

berk1937 · 17 Kasım 2019

bitdark dedi:
İyi de verdiğiniz terim mi? Sanki bilmediğim bir kelimenin anlamına sözlükten bakabilecekmişim gibi konuşuyorsunuz.

Aşırı saçmalıyorsunuz şu an, bir sürü mesleki terim var mesajımda.
Şunları Google'a yazsanız yüzlerce sayfa çıkar Türkçe/İngilizce. Hatta Vikipedi bile gösteriyor sağ tarafta:

MVC
ORM
ExpressJs
Pugjs
MongooseJs
MongoDB
HTTP
Bootstrap

Bunları uyduruyor muyum şu an ben? Bence okumamışsınız. Araştırmadan ve ukalaca davranarak hiçbir şey öğrenemezsiniz. Bunlar ayağımıza gelmiyor.

Boris7503 · 19 Kasım 2019

PHP öğrenemeye başlamak bu sorunuzu cevaplayacaktır.

bitwise · 20 Kasım 2019

Web sitesi request - response mantigiyla calisiyor. ( client - server architecture )
Sen bir istek yaparsin, backend response doner, iste o response icinde html, css, js , json , xml artik yaptigin istege gore bir veri gonderir sana.

Gelen veri, ham haliyle biz insanlar icin genelde anlamsizdir, bunun islenip bir seye donusmesi gerekiyor. Browser bunu render eder, Javascript dinamik olarak on yuz processing ini yapar, CSS styling verir vs.

Ama en temelde, yapilan istege cevap vermesi gereken bir backend 'e ihtiyac vardir. Hangi istege ne cevap vermesine karar veren merkez burasidir.

Buraya kadar olan kisim, neden backend e ihtiyac var olan kisminin temel aciklamasi.

Bahsettigin framework'ler, backend yazarken kullandigin seyleri yazmana kolaylik saglayan fonksiyonlari saglarlar.

Ornegin hangi istek, hangi kod blogunu cagiracak, hangi istekler hangi guvenlik filtrelerinden gecirilecekler vs.

C++ ile 2000 satirda yazacagin kodu, Python ile 20 satirda yazmana olanak saglar. Hepsinin yaptigi uc asagi bes yukari ayni sey.

Ornegin nodejs ile asagidaki kodu calistirip en temel "Hello World" backendini yazabilirsin:

Kod:

const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World\n');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

Web sitesi gelişiminde back-end nasıl çalışıyor?

Ayrıntılı düzenleme

bitdark

Centipat

berk1937

Kilopat

bitdark

Centipat

berk1937

Kilopat

bitdark

Centipat

berk1937

Kilopat

Boris7503

Kilopat

bitwise

Megapat

Benzer konular

Yeni konular

Yeni mesajlar

Gizliliğinize önem veriyoruz