사용자 더미 추가

• db.json

  	{
    "user": [
      {
        "id": 1,
        "username": "test",
        "password": "1234",
        "email": "[email protected]",
        "createdAt": "2025-06-10"
      },
     ...
  

뷰 추가

• LoginView.vue

  <template>
    <div class="login-container">
      <form @submit.prevent="userLogin">
        <h2>로그인</h2>
        <div class="form-group">
          <label for="username">아이디</label>
          <input
            type="text"
            id="username"
            v-model="username"
            required
          >
        </div>
        <div class="form-group">
          <label for="password">비밀번호</label>
          <input
            type="password"
            id="password"
            v-model="password"
            required
          >
        </div>
        <button type="submit">로그인</button>
    </form>
    </div>
  </template>
  
  <script>
  import { ref } from 'vue'
  import { useRouter } from 'vue-router'
  
  export default {
    name: 'LoginView',
    setup() {
      const router = useRouter()
      const username = ref('')
      const password = ref('')
  
      const handleLogin = async () => {
        try {
          const response = await fetch('<http://localhost:3000/users>')
          const users = await response.json()
  
          const user = users.find(u =>
              u.username === username.value &&
              u.password === password.value
          )
  
          if (user) {
              localStorage.setItem('user', JSON.stringify(user))
              router.push('/')
          } else {
              alert('로그인 실패')
          }
        } catch (err) {
          console.error('로그인 에러:', err)
        }
      }
  
      return {
          username,
          password,
          handleLogin
      }
  }
  }
  </script>
  
  <style scoped>
  
  </style>
  
  

라우트 설정

• index.js

  const routes = [
      {
        path: '/login',
        name: 'Login',
        component: LoginView
      },
      ...