init

src/pages/LoginPage.jsx

@@ -0,0 +1,39 @@
+import React, { useState } from 'react';
+import { useAuth } from '../context/AuthContext';
+
+export default function LoginPage({ onLoggedIn }) {
+  const { login } = useAuth();
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError('');
+    try {
+      await login(email.trim(), password);
+      onLoggedIn?.();
+    } catch (err) {
+      setError('이메일 또는 비밀번호가 올바르지 않습니다.');
+    }
+  };
+
+  return (
+    <section className="page" style={{ flex: 1, display:'flex', alignItems:'center', justifyContent:'center' }}>
+      <form onSubmit={handleSubmit} style={{ width:'100%', maxWidth:480, padding:'0 16px' }}>
+        <div style={{ marginBottom:16, background:'#f7f7f7', borderRadius:12, padding:'16px 18px' }}>
+          <input type="email" placeholder="이메일" value={email} onChange={(e)=>setEmail(e.target.value)}
+            style={{ width:'100%', background:'transparent', border:'none', outline:'none', fontSize:'1.1rem' }} required />
+        </div>
+        <div style={{ marginBottom:24, background:'#f7f7f7', borderRadius:12, padding:'16px 18px' }}>
+          <input type="password" placeholder="비밀번호" value={password} onChange={(e)=>setPassword(e.target.value)}
+            style={{ width:'100%', background:'transparent', border:'none', outline:'none', fontSize:'1.1rem' }} required />
+        </div>
+        {error && <div style={{ color:'#e53935', marginBottom:12, textAlign:'center' }}>{error}</div>}
+        <button type="submit" style={{ width:'100%', height:64, borderRadius:18, border:'none', background:'#111', color:'#fff', fontSize:'1.4rem', fontWeight:700, cursor:'pointer' }}>로그인</button>
+      </form>
+    </section>
+  );
+}
+
+