Web formları Node.js ve Express ile sunucu tarafında işlemek

Bugünün öğreticisinde, Node.js ve Express kullanarak bir sunucuda form verilerini nasıl alabileceğini göstereceğim. Birlikte basit bir sunucu yapılandıracağız ve bu sunucuya veri gönderen formaları oluşturmak için gerekli adımları geçeceğiz. Bu kılavuz, JavaScript ve Node.js'yi temel düzeyde anlayan ve web geliştirme alanındaki becerilerini genişletmek isteyen herkese yöneliktir.

Önemli Bilgiler:

• Bir Node.js sunucusu oluşturmak için Temel Bilgiler ve Express
• Proje dizinini yapılandırın ve gerekli paketleri yükleyin
• Gönderilen verileri işleyen sunucu taraflı işleme

Adım Adım Kılavuz

İlk olarak, gelen form verilerini işlemek için bir sunucu oluşturmamız gerekiyor. Bu nedenle yeni bir Node.js projesi oluşturmaya başlıyoruz.

Örneğin Visual Studio Code gibi bir editörü açın ve bir terminal açın. Alternatif olarak, normal bir terminal kullanabilirsiniz. Bilgisayarınızda Node.js'in yüklü olduğundan emin olun.

Ana dizine giderek sunucu uygulamanız için yeni bir alt dizin oluşturun. Önerim, dizinin adını "FormSunucuUygulaması" koymandır.

Oluşturulan yeni dizine gidin ve npm init komutu ile yeni bir Node.js projesi başlatın. Projekti oluşturduktan sonra, projenin adı, sürümü ve giriş noktası dosyası gibi bazı bilgileri girmeniz istenecektir. Varsayılan değerleri kullanabilir veya kendi bilgilerinizi girebilirsiniz.

Proje oluşturulduktan sonra, dizinde bir package.json dosyası göreceksiniz. Bu dosya projenizin tüm meta verilerini içerir. Şimdi Express'i yüklememiz gerekiyor, bu yüzden npm install express komutunu çalıştırıyoruz.

Kurulum tamamlandıktan sonra, Express'in bağımlılıklar arasında package.json dosyasında listelendiğinden emin olun. Devam etmeden önce kurulumun başarılı olduğundan emin olun.

Şimdi uygulamamızın giriş noktası olarak işlev görecek index.js adlı yeni bir dosya oluşturacağız. Bu dosya, Express sunucumuz için temel mantığı içerecektir.

Başlangıçta, her şeyin düzgün çalıştığından emin olmak için index.js dosyasına console.log("FormSunucu"); yazarak kısa bir test yapabilir ve bunu node index.js ile çalıştırabilirsiniz.

Şimdi Express'i index.js dosyanızda kullanmanın zamanı geldi. Express'i içe aktarmak için gerekli kodu ekleyin ve bir Express uygulaması oluşturun. Bir Express uygulamasını başlatmak ve belirli bir bağlantı noktasında dinlemek için basit bir kod aşağıda verilmiştir:

Sunucunuzu belirli bir (örneğin 3000) bağlantı noktasında çalıştığından emin olun. Tarayıcınızda localhost:3000 adresine giderek uygulamanın doğru çalışıp çalışmadığını kontrol edin. "Hello World" çıktısını görmelisiniz.

Uygulamanızda formaları desteklemek için, şimdi sunucumuza veri gönderecek olan form HTML yapısını içeren bir index.html dosyasına ihtiyacımız var. İlk olarak, "public" adında yeni bir klasör oluşturun ve içine index.html dosyasını yerleştirin.

İndex.html dosyasında, formunuzu sunucuya gönderecek olan basit bir HTML çerçeve ekleyebilirsiniz. Form, daha sonra sunucuya gönderilen verileri içerecektir.

Express sunucusu aracılığıyla (HTML, CSS, JS) statik dosyaları sunmak için, "public" klasörünü statik bir dizin olarak belirlemek için app.use() yöntemini kullanın. Bu sayede tarayıcı, localhost:3000/index.html adresini çağırdığınızda index.html dosyasını isteyebilecektir.

Sunucuyu başlattıktan ve tarayıcıda index.html dosyasını yükledikten sonra formun doğru şekilde görüntülendiğini görmelisiniz. Formu doldurup gönderdiğinizde ancak henüz bir şey olmaz, çünkü henüz sunucu tarafındaki mantığı uygulamadık.

Bir sonraki adımda, form verilerinin sunucu tarafında nasıl işleneceğine odaklanacağız. Bu, formun gönderdiği verileri alacak ve işleyecek bir yol eklememiz gerektiği anlamına gelir. Web uygulamanızı geliştirmek ve işlevsellik eklemek için bir sonraki adımları bekleyin!

Özet

Bu öğreticide, Node.js ve Express ile basit bir sunucu nasıl oluşturacağınızı öğrendiniz. Bir Node.js projesi oluşturma temellerini, bağımlılıkların yüklenmesini ve HTML formlarına giriş yapmayı öğrendiniz. Web formlarını sunucu tarafında ele almanın temel adımları önemlidir.