Merge pull request #301 from woowacourse-teams/dev/fe

3차 데모데이 - 인증인가, 카테고리, 태그 기능

.github/workflows/frontend_cd.yml

@@ -19,6 +19,14 @@ jobs:
         with:
           node-version: 20
 
+      - name: Create .env.production file
+        run: |
+          echo "REACT_APP_API_URL=${{ secrets.REACT_APP_API_URL }}" > ${{ env.frontend-directory }}/.env.production
+          echo "REACT_APP_BASE_URL=${{ secrets.REACT_APP_BASE_URL }}" >> ${{ env.frontend-directory }}/.env.production
+
+      - name: Set environment file permissions
+        run: chmod 644 ${{ env.frontend-directory }}/.env.production
+
       - name: Install Dependencies
         run: npm install
         working-directory: ${{ env.frontend-directory }}
@@ -48,4 +56,3 @@ jobs:
         run: |
           aws s3 cp --recursive ${{ secrets.FRONT_DIRECTORY }} s3://techcourse-project-2024/code-zap
           rm -rf ${{ secrets.FRONT_DIRECTORY }}
-        

frontend/.gitignore

@@ -4,6 +4,4 @@ node_modules
 
 dist
 
-.env
-.env.development
-.env.production
+.env*

frontend/.storybook/preview.tsx

@@ -1,6 +1,7 @@
 import type { Preview } from '@storybook/react';
-import GlobalStyles from '../src/style/GlobalStyles';
 import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import GlobalStyles from '../src/style/GlobalStyles';
 
 const preview: Preview = {
   parameters: {
@@ -16,14 +17,16 @@ const preview: Preview = {
     (Story) => (
       <>
         <GlobalStyles />
-        <div style={{ display: 'flex', gap: '1.6rem', flexWrap: 'wrap' }}>
-          <div style={{ border: '0.2rem solid black', borderRadius: '8px', padding: '3.2rem', background: 'white' }}>
-            <Story />
-          </div>
-          <div style={{ border: '0.2rem solid black', borderRadius: '8px', padding: '3.2rem', background: 'black' }}>
-            <Story />
+        <MemoryRouter>
+          <div style={{ display: 'flex', gap: '1rem', flexWrap: 'wrap' }}>
+            <div style={{ border: '2px solid black', borderRadius: '8px', padding: '2rem', background: 'white' }}>
+              <Story />
+            </div>
+            <div style={{ border: '2px solid black', borderRadius: '8px', padding: '2rem', background: 'black' }}>
+              <Story />
+            </div>
           </div>
-        </div>
+        </MemoryRouter>
       </>
     ),
   ],