fix: (#55) npm run dev 실행 시 발생하는 오류 해결, 라우팅 이슈 해결

frontend/src/App.tsx

@@ -1,20 +1,22 @@
 import { RouterProvider } from 'react-router-dom';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-
-import Home from '@pages/Home';
+import { ThemeProvider } from 'styled-components';
 
 import router from '@routes/router';
 
+import { GlobalStyle } from '@styles/globalStyle';
+import { theme } from '@styles/theme';
+
 const queryClient = new QueryClient();
 
 const App = () => (
- <QueryClientProvider client={queryClient}>
- <RouterProvider router={router} >
-  <Example />
- <Home />
- </RouterProvider>
- </QueryClientProvider>
+ <ThemeProvider theme={theme}>
+ <GlobalStyle />
+ <QueryClientProvider client={queryClient}>
+ <RouterProvider router={router} />
+ </QueryClientProvider>
+ </ThemeProvider>
 );
 
 export default App;

frontend/src/components/Example/style.ts

@@ -1,10 +1,8 @@
 import { styled } from 'styled-components';
 
-import { theme } from '@styles/theme';
-
 export const Button = styled.button`
  width: 80px;
- color: ${theme.color.white};
- background: ${theme.color.primary};
+
+ color: red;
  font-size: 1rem;
 `;

frontend/src/components/optionList/WritingVoteOptionList/WritingVoteOption/OptionUploadImageButton/OptionUploadImageButton.stories.tsx

@@ -10,5 +10,5 @@ export default meta;
 type Story = StoryObj<typeof OptionUploadImageButton>;
 
 export const Default: Story = {
- render: () => <OptionUploadImageButton labelId={123} />,
+ render: () => <OptionUploadImageButton optionId={123} />,
 };

frontend/src/routes/router.tsx

@@ -1,14 +1,14 @@
 import { createBrowserRouter } from 'react-router-dom';
 
-import PostDetail from '@pages/Post/PostDetail';
-import PostList from '@pages/Post/PostList';
-import WritePost from '@pages/Post/WritePost';
+import PostDetail from '@pages/post/PostDetail';
+import PostList from '@pages/post/PostList';
+import WritePost from '@pages/post/WritePost';
 
 const router = createBrowserRouter([
  {
  path: '/',
- element: <PostList />,
  children: [
+ { path: '', element: <PostList /> },
  {
  path: 'posts/write',
  element: <WritePost />,