,

Learning Express JS | 8. Adding new data (Create – POST Method)

Posted by






Belajar Express JS | 8. Menambahkan data baru (Create – POST Method)

Belajar Express JS | 8. Menambahkan data baru (Create – POST Method)

Selamat datang kembali! Di tutorial kali ini, kita akan belajar bagaimana cara menambahkan data baru menggunakan metode POST di Express JS. Metode POST digunakan untuk menambahkan data baru ke dalam server atau database.

Langkah pertama: Persiapan form HTML

Pertama-tama, kita perlu membuat sebuah form HTML yang akan digunakan untuk mengirim data ke server menggunakan metode POST. Berikut adalah contoh kode form HTML yang bisa kita gunakan:


<form action="/addData" method="post">
<input type="text" name="nama" placeholder="Nama">
<input type="text" name="email" placeholder="Email">
<button type="submit">Tambahkan Data</button>
</form>

Dalam contoh di atas, kita membuat sebuah form dengan dua input field (nama dan email) serta sebuah tombol submit. Form tersebut akan mengirimkan data ke endpoint “/addData” dengan metode POST.

Langkah kedua: Menghandle request POST di server

Selanjutnya, kita perlu menangani request POST yang dikirimkan oleh form tersebut di server. Berikut adalah contoh kode untuk menangani request POST di Express JS:


app.post('/addData', (req, res) => {
let newData = {
nama: req.body.nama,
email: req.body.email
};

// Simpan newData ke dalam database atau server
// ...

res.send('Data baru berhasil ditambahkan');
});

Dalam contoh di atas, kita menggunakan method post pada object app untuk menangani request POST ke endpoint “/addData”. Setelah itu, kita mengambil data yang dikirimkan melalui request dan menyimpannya ke dalam variabel newData. Kemudian, kita dapat menyimpan data tersebut ke dalam database atau server, dan mengirimkan respon kembali ke client.

Langkah terakhir: Melakukan validasi data (opsional)

Selain itu, kita juga dapat melakukan validasi data sebelum menyimpannya ke dalam database untuk memastikan bahwa data yang dikirimkan adalah data yang valid. Berikut adalah contoh kode untuk melakukan validasi data menggunakan library Joi di Express JS:


const Joi = require('joi');

const schema = Joi.object({
nama: Joi.string().required(),
email: Joi.string().email().required()
});

app.post('/addData', (req, res) => {
const { error } = schema.validate(req.body);
if (error) return res.status(400).send(error.details[0].message);

let newData = {
nama: req.body.nama,
email: req.body.email
};

// Simpan newData ke dalam database atau server
// ...

res.send('Data baru berhasil ditambahkan');
});

Dalam contoh di atas, kita menggunakan library Joi untuk membuat schema validasi data. Setelah itu, kita mengecek apakah data yang dikirimkan sesuai dengan schema yang telah dibuat. Jika tidak, kita akan mengirimkan respon dengan status 400 beserta pesan error. Jika data valid, kita dapat menyimpan data tersebut ke dalam database atau server.

Itulah langkah-langkah untuk menambahkan data baru menggunakan metode POST di Express JS. Semoga tutorial ini bermanfaat!