DEV Community

Ryunze
Ryunze

Posted on

Bikin web dengan Express + EJS

Instal yang dibutuhkan 🧩

Express: Framework utama untuk handle request dan response
EJS: Templating Engine HTML
Nodemon: Hot Restart

npm install express ejs nodemon
Enter fullscreen mode Exit fullscreen mode

Buat file dengan nama 📑index.js sebagai file utama yang akan dijalankan server.

const express = require('express')
const app = express()
const port = 3000
const path = require('path')

app.listen(3000, console.log(`Server run on port ${port}`))
Enter fullscreen mode Exit fullscreen mode

Set EJS sebagai View Engine untuk Express :

const express = require('express')
const app = express()
const port = 3000
const path = require('path')

// Set View Engine
app.set('view engine', 'ejs')
app.set('views', path.join(__dirname, 'app/views'))

app.listen(3000, console.log(`Server run on port ${port}`))
Enter fullscreen mode Exit fullscreen mode

Buat view baru dengan ekstensi .ejs seperti 📑home.ejs dan simpan ke folder 📁app/views agar mudah dimaintenance.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Belajar Express</title>
</head>
<body>

<h1>Selamat datang di website Belajar Express!</h1>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Coba handle request GET / :

app.get('/', (req, res) => {
    res.render('home')
})
Enter fullscreen mode Exit fullscreen mode

Terakhir, jangan lupa tambahkan script untuk menjalankan Nodemon npm run dev :

{
  // ...
  "scripts": {
    // ...
    "dev": "nodemon index.js"
  }
  // ...
}
Enter fullscreen mode Exit fullscreen mode

Source Code:

const express = require('express')
const app = express()
const port = 3000
const path = require('path')

app.set('view engine', 'ejs')
app.set('views', path.join(__dirname, 'app/views'))

app.get('/', (req, res) => {
    res.render('home')
})

app.listen(3000, console.log(`Server run on port ${port}`))
Enter fullscreen mode Exit fullscreen mode

Top comments (0)