@

Initial commit: SB 프론트엔드 (Vue 3 + Vite)

- axios 공통 인스턴스 및 사용자 CRUD API 연동
- Pinia 사용자 스토어, 사용자 관리 화면(UsersView)
- /api -> Spring Boot(8080) dev 프록시 구성

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@

src/api/http.js

@@ -0,0 +1,37 @@
+import axios from 'axios'
+
+// 공통 axios 인스턴스
+const http = axios.create({
+  baseURL: import.meta.env.VITE_API_BASE_URL || '/api',
+  timeout: 10000,
+  headers: {
+    'Content-Type': 'application/json',
+  },
+})
+
+// 요청 인터셉터 (예: 토큰 주입)
+http.interceptors.request.use(
+  (config) => {
+    const token = localStorage.getItem('token')
+    if (token) {
+      config.headers.Authorization = `Bearer ${token}`
+    }
+    return config
+  },
+  (error) => Promise.reject(error),
+)
+
+// 응답 인터셉터 (공통 에러 처리)
+http.interceptors.response.use(
+  (response) => response.data,
+  (error) => {
+    const status = error.response?.status
+    if (status === 401) {
+      // 인증 만료 처리 등
+      console.warn('인증이 필요합니다.')
+    }
+    return Promise.reject(error)
+  },
+)
+
+export default http

src/api/userApi.js

@@ -0,0 +1,20 @@
+import http from './http'
+
+// 백엔드 /api/users 엔드포인트와 매핑
+export const userApi = {
+  list() {
+    return http.get('/users')
+  },
+  get(id) {
+    return http.get(`/users/${id}`)
+  },
+  create(payload) {
+    return http.post('/users', payload)
+  },
+  update(id, payload) {
+    return http.put(`/users/${id}`, payload)
+  },
+  remove(id) {
+    return http.delete(`/users/${id}`)
+  },
+}