diff --git a/src/context/ClientContext.tsx b/src/context/ClientContext.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..c1130185348c6ba33d919dec4da70b93a6d0a2b4
--- /dev/null
+++ b/src/context/ClientContext.tsx
@@ -0,0 +1,29 @@
+import React, { createContext } from 'react';
+import { Client, createClient } from '../client/client';
+
+export type ClientContextType = {
+  client: Client;
+};
+
+export const ClientContext = createContext<ClientContextType>({
+  client: createClient(),
+});
+
+type ClientContextProviderProps = {
+  baseUrl?: string;
+};
+
+export const ClientContextProvider: React.FC<ClientContextProviderProps> = ({
+  children,
+  baseUrl = '',
+}) => {
+  return (
+    <ClientContext.Provider
+      value={{
+        client: createClient(baseUrl),
+      }}
+    >
+      {children}
+    </ClientContext.Provider>
+  );
+};
diff --git a/src/context/index.tsx b/src/context/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8577543dbc08fe049b8acc239df36a3eb958b549
--- /dev/null
+++ b/src/context/index.tsx
@@ -0,0 +1,2 @@
+export * from './ClientContext';
+export * from './UserContext';
diff --git a/src/hooks/useClientContext.ts b/src/hooks/useClientContext.ts
new file mode 100644
index 0000000000000000000000000000000000000000..67f603c15ac1888d7e60ec6cef503ca9f8ba99c7
--- /dev/null
+++ b/src/hooks/useClientContext.ts
@@ -0,0 +1,13 @@
+import { useContext } from 'react';
+import { ClientContext } from '../context';
+import type { ClientContextType } from '../context';
+
+function useClientContext(): ClientContextType {
+  const clientContext = useContext(ClientContext);
+  if (!clientContext) {
+    throw new Error('You must use `ClientContextProvider` to access the `ClientContext`.');
+  }
+  return clientContext;
+}
+
+export default useClientContext;