diff --git a/public/js/register.js b/public/js/register.js
new file mode 100644
index 0000000000000000000000000000000000000000..b2f8ffa490883e3c016314dc44c9daca831702b8
--- /dev/null
+++ b/public/js/register.js
@@ -0,0 +1,40 @@
+const register = async function (e) {
+ e.preventDefault();
+
+ try {
+ const username = document.getElementById("username").value;
+ const email = document.getElementById("email").value;
+ const password = document.getElementById("password").value;
+ const profilePicture = document.getElementById("profilePicture").files[0];
+
+ const formData = new FormData();
+ formData.append("username", username);
+ formData.append("email", email);
+ formData.append("password", password);
+ formData.append("profilePicture", profilePicture);
+
+ const response = await fetch("/register", {
+ method: "POST",
+ body: formData,
+ credentials: "include",
+ });
+
+ if (response.status === 200) {
+ const result = await response.json();
+
+ if (result.success === true) {
+ alert("Registration success");
+ window.location.href = "/login.html"; // Redirect to the login page
+ } else {
+ alert("Registration failed");
+ }
+ } else {
+ console.log("Request failed");
+ }
+ } catch (error) {
+ console.log(error);
+ }
+};
+
+// Menggunakan event submit pada form untuk menjalankan fungsi register
+document.getElementById("registerForm").addEventListener("submit", register);
diff --git a/public/view/register.php b/public/view/register.php
new file mode 100644
index 0000000000000000000000000000000000000000..d0e4eb77f0265530e739a1c5e527093ba75f6eb0
--- /dev/null
+++ b/public/view/register.php
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Register</title>
+ <link rel="stylesheet" href="public/css/styles.css">
+</head>
+<body>
+ <?php require_once(PROJECT_ROOT_PATH.'/public/components/Navbar.php'); ?>
+ <h1 id="registerTitle">Register</h1>
+ <form id="registerForm" enctype="multipart/form-data" method="POST" action="register.php">
+ <label for="username" id="usernameLabel">Username:</label>
+ <input type="text" id="username" name="username" required /><br /><br />
+
+ <label for="email" id="emailLabel">Email:</label>
+ <input type="email" id="email" name="email" required /><br /><br />
+
+ <label for="password" id="passwordLabel">Password:</label>
+ <input type="password" id="password" name="password" required /><br /><br />
+
+ <label for="profilePicture" id="profilePictureLabel">Profile Picture:</label>
+ <input type="file" id="profilePicture" name="profilePicture" accept="image/*" required /><br /><br />
+
+ <button type="submit" id="registerButton">Register</button>
+ </form>
+</body>
+</html>