diff --git a/src/client/auth.ts b/src/client/auth.ts
index 891eebd1668f6066b173ad07abbecb7e159cedf2..933450e4ce5ab5a75dff9149cc1e2ee3eb23ff3b 100644
--- a/src/client/auth.ts
+++ b/src/client/auth.ts
@@ -3,10 +3,17 @@ import { UserResponse } from './types';
 
 type MeQuery = () => Promise<UserResponse>;
 type LogoutQuery = () => Promise<any>;
+type RegisterQuery = (data: ProfileData) => Promise<any>;
+
+export type ProfileData = {
+  studentCardNumber: string;
+  roomNumber: number;
+};
 
 export type AuthClient = {
   me: MeQuery;
   logout: LogoutQuery;
+  register: RegisterQuery;
 };
 
 export function auth(config: AxiosRequestConfig): AuthClient {
@@ -23,8 +30,13 @@ export function auth(config: AxiosRequestConfig): AuthClient {
     return (await axios.get<any>('/logout')).data;
   };
 
+  const register: RegisterQuery = async (data: ProfileData): Promise<any> => {
+    return (await axios.post('/users/me', data)).data;
+  };
+
   return {
     me,
     logout,
+    register,
   };
 }
diff --git a/src/hooks/useRegister.ts b/src/hooks/useRegister.ts
new file mode 100644
index 0000000000000000000000000000000000000000..c94b9e081069acd94aeb997f9977517868266751
--- /dev/null
+++ b/src/hooks/useRegister.ts
@@ -0,0 +1,11 @@
+import { useMutation, UseMutationResult } from 'react-query';
+import { ProfileData } from '../client/auth';
+import useClientContext from './useClientContext';
+
+export default function useRegister(): UseMutationResult<any, Error, ProfileData> {
+  const client = useClientContext();
+
+  return useMutation<any, Error, ProfileData>('register', async (data: ProfileData) =>
+    client.client.auth.register(data),
+  );
+}
diff --git a/src/pages/Page.tsx b/src/pages/Page.tsx
index 68da73431ad805f8aca34e50ce323a104d377ced..096615c5393660ee14d072423c4a873dce4abb72 100644
--- a/src/pages/Page.tsx
+++ b/src/pages/Page.tsx
@@ -1,10 +1,11 @@
 import { Box, makeStyles, Theme, useMediaQuery } from '@material-ui/core';
-import React from 'react';
+import React, { useEffect } from 'react';
 import DrawerMenu from '../components/DrawerMenu';
 import Footer from '../components/Footer';
 import Header from '../components/Header';
 import MobileHeader from '../components/MobileHeader';
 import useLogout from '../hooks/useLogout';
+import useRegister from '../hooks/useRegister';
 import { useToggle } from '../hooks/useToggle';
 
 const useStyles = makeStyles((theme) => ({
@@ -22,6 +23,12 @@ const Page: React.FC = ({ children }) => {
   const { refetch: logout } = useLogout({ enabled: false });
   const classes = useStyles();
 
+  const { mutate } = useRegister();
+
+  useEffect(() => {
+    mutate({ roomNumber: 1300, studentCardNumber: '122223455' });
+  }, [mutate]);
+
   const handleLogout = (): void => {
     logout();
   };