diff --git a/.gitignore b/.gitignore
index 78ab7aa..1389464 100644
--- a/.gitignore
+++ b/.gitignore
@@ -28,3 +28,9 @@ build
 
 # Miscellaneous
 *.local
+
+
+# env
+
+.env.development
+.env.production
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..94a25f7
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/src/App.tsx b/src/App.tsx
index af575b2..3ff9b11 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -7,6 +7,7 @@ import { createTheme, ThemeProvider } from "@mui/material"
 import { useAppDispatch, useAppSelector } from "@/app/hooks"
 import { useEffect } from "react"
 import { appActions } from "@/features/app/app.slice"
+import { instance } from "@/app/instance"
 
 export const Test = () => {
   const isLoading = useAppSelector((state) => state.app.isLoading)
@@ -21,6 +22,7 @@ export const Test = () => {
     setTimeout(() => {
       dispatch(appActions.setIsLoading({ isLoading: false }))
     }, 3000)
+    instance.get("/ping")
   }, [dispatch])
 
   if (isLoading) return <div>loading...</div>
diff --git a/src/app/instance.ts b/src/app/instance.ts
new file mode 100644
index 0000000..34e6e1e
--- /dev/null
+++ b/src/app/instance.ts
@@ -0,0 +1,9 @@
+import axios from "axios"
+
+export const instance = axios.create({
+  baseURL:
+    process.env.NODE_ENV === "development"
+      ? "http://localhost:7542/2.0/"
+      : "https://neko-back.herokuapp.com/2.0/",
+  withCredentials: true,
+})
diff --git a/src/constants/api_url.ts b/src/constants/api_url.ts
new file mode 100644
index 0000000..e69de29
diff --git a/src/features/app/app.slice.ts b/src/features/app/app.slice.ts
index a4455bb..75c10c2 100644
--- a/src/features/app/app.slice.ts
+++ b/src/features/app/app.slice.ts
@@ -1,12 +1,16 @@
 import { createSlice, PayloadAction } from "@reduxjs/toolkit"
 
+const initialAppState = {
+  error: null as null | string,
+  isLoading: true,
+  isAppInitialized: false,
+}
+
+export type InitialAppState = typeof initialAppState
+
 const slice = createSlice({
   name: "app",
-  initialState: {
-    error: null as null | string,
-    isLoading: true,
-    isAppInitialized: false,
-  },
+  initialState: initialAppState,
   reducers: {
     setIsLoading: (state, action: PayloadAction<{ isLoading: boolean }>) => {
       state.isLoading = action.payload.isLoading
@@ -14,11 +18,11 @@ const slice = createSlice({
     setError: (state, action: PayloadAction<{ error: string | null }>) => {
       state.error = action.payload.error
     },
-    setIsAppInitialized: (
+    setAppInitialized: (
       state,
-      action: PayloadAction<{ isInitialized: boolean }>,
+      action: PayloadAction<{ isAppInitialized: boolean }>,
     ) => {
-      state.isAppInitialized = action.payload.isInitialized
+      state.isAppInitialized = action.payload.isAppInitialized
     },
   },
 })
diff --git a/src/features/auth/auth.api.ts b/src/features/auth/auth.api.ts
new file mode 100644
index 0000000..9f10798
--- /dev/null
+++ b/src/features/auth/auth.api.ts
@@ -0,0 +1,7 @@
+import { AuthInstance } from "@/features/auth/auth.instance"
+
+export const AuthApi = () => ({
+  register: (params: any) => {
+    return AuthInstance.post(params)
+  },
+})
diff --git a/src/features/auth/auth.instance.ts b/src/features/auth/auth.instance.ts
new file mode 100644
index 0000000..4b60f91
--- /dev/null
+++ b/src/features/auth/auth.instance.ts
@@ -0,0 +1,6 @@
+import axios from "axios"
+
+export const AuthInstance = axios.create({
+  baseURL: import.meta.env.BASE_URL + "auth/",
+  withCredentials: true,
+})