++

Added already existing code for further development

frontend/src/pages/register.jsx

@@ -0,0 +1,56 @@
+import React, { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import axios from 'axios';
+
+function Register({ setIsLoggedIn }) {
+    const [username, setUsername] = useState('');
+    const [email, setEmail] = useState('');
+    const [password, setPassword] = useState('');
+    const [message, setMessage] = useState('');
+    const navigate = useNavigate();
+
+    const handleRegister = async (e) => {
+        e.preventDefault();
+        try {
+            const res = await axios.post('http://localhost:5000/register', { username, email, password });
+            setMessage(res.data.message);
+            setIsLoggedIn(true);
+            navigate('/');
+        } catch (err) {
+            setMessage(err.response.data.error);
+        }
+    };
+
+    return (
+        <div className="form-container">
+            <h2>Register</h2>
+            <form onSubmit={handleRegister}>
+                <input
+                    type="text"
+                    placeholder="Username"
+                    value={username}
+                    onChange={(e) => setUsername(e.target.value)}
+                    required
+                />
+                <input
+                    type="email"
+                    placeholder="Email"
+                    value={email}
+                    onChange={(e) => setEmail(e.target.value)}
+                    required
+                />
+                <input
+                    type="password"
+                    placeholder="Password"
+                    value={password}
+                    onChange={(e) => setPassword(e.target.value)}
+                    required
+                />
+                <button className="btn" type="submit">Register</button>
+            </form>
+            <p>{message}</p>
+        </div>
+    );
+}
+
+export default Register;