1차 dev->main

.env.development

@@ -0,0 +1,2 @@
+NEXT_PUBLIC_API_URL=https://api.modumozu.com/
+NEXT_PUBLIC_KAKAO_KEY="5d83cd0432c767f46c20dceb0f8f3947"

.env.production

@@ -1 +1 @@
-NEXT_PUBLIC_API_URL=URL
+NEXT_PUBLIC_API_URL=https://api.modumozu.com/

.eslintrc.json

@@ -1,6 +1,4 @@
 {
-  "extends": [
-    "next/core-web-vitals",
-    "plugin:storybook/recommended"
-  ]
+  "extends": ["next/core-web-vitals", "plugin:storybook/recommended"],
+  "ignorePatterns": ["src/stories"]
 }

.github/workflows/chromatic.yml

@@ -0,0 +1,26 @@
+# Workflow name
+name: "Chromatic Deployment"
+
+# Event for the workflow
+on:
+  push:
+    branches:
+      - develop
+
+# List of jobs
+jobs:
+  test:
+    # Operating System
+    runs-on: ubuntu-latest
+    # Job steps
+    steps:
+      - uses: actions/checkout@v1
+      - run: npm i -g pnpm
+      - run: pnpm install
+        #👇 Adds Chromatic as a step in the workflow
+      - uses: chromaui/action@v1
+        # Options required for Chromatic's GitHub Action
+        with:
+          #👇 Chromatic projectToken, see https://storybook.js.org/tutorials/intro-to-storybook/react/ko/deploy/ to obtain it
+          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
+          token: ${{ secrets.GITHUB_TOKEN }}

.storybook/main.ts

@@ -1,4 +1,5 @@
 import type { StorybookConfig } from "@storybook/nextjs";
+import TsconfigPathsPlugin from "tsconfig-paths-webpack-plugin";
 
 const config: StorybookConfig = {
   stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
@@ -7,6 +8,7 @@ const config: StorybookConfig = {
     "@storybook/addon-essentials",
     "@storybook/addon-onboarding",
     "@storybook/addon-interactions",
+    "@storybook/addon-viewport",
   ],
   framework: {
     name: "@storybook/nextjs",
@@ -15,5 +17,17 @@ const config: StorybookConfig = {
   docs: {
     autodocs: "tag",
   },
+  staticDirs: ["../src/app"],
+  webpackFinal: async (config) => {
+    if (config.resolve) {
+      config.resolve.plugins = [
+        ...(config.resolve.plugins || []),
+        new TsconfigPathsPlugin({
+          extensions: config.resolve.extensions,
+        }),
+      ];
+    }
+    return config;
+  },
 };
 export default config;

.storybook/preview.tsx

@@ -0,0 +1,30 @@
+import type { Preview } from "@storybook/react";
+import React from "react";
+import { INITIAL_VIEWPORTS } from "@storybook/addon-viewport/preview";
+import "../src/app/globals.css";
+
+const preview: Preview = {
+  parameters: {
+    actions: { argTypesRegex: "^on[A-Z].*" },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/,
+      },
+    },
+    viewport: {
+      viewports: INITIAL_VIEWPORTS,
+      defaultViewport: "iphone12",
+    },
+  },
+
+  decorators: [
+    (Story) => (
+      <>
+        <Story />
+      </>
+    ),
+  ],
+};
+
+export default preview;

next.config.js

@@ -1,4 +1,11 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {}
+const nextConfig = {
+  compiler: {
+    styledComponents: true,
+  },
+  images: {
+    domains: ["d2u3dcdbebyaiu.cloudfront.net", "teamblindstatics.s3.ap-northeast-1.amazonaws.com"],
+  },
+};
 
-module.exports = nextConfig
+module.exports = nextConfig;

package.json

@@ -9,17 +9,23 @@
     "lint": "next lint",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "preinstall": "npx only-allow pnpm"
+    "preinstall": "npx only-allow pnpm",
+    "chromatic": "npx chromatic --project-token=chpt_a2dbd92234c64c2"
   },
   "dependencies": {
+    "@storybook/addon-viewport": "^7.4.0",
+    "@tanstack/react-query": "^4.36.1",
     "@types/node": "20.4.10",
     "@types/react": "18.2.20",
     "@types/react-dom": "18.2.7",
     "axios": "^1.4.0",
+    "dayjs": "^1.11.10",
     "eslint": "8.47.0",
     "eslint-config-next": "13.4.13",
+    "korean-business-day": "^3.1.0",
     "next": "13.4.13",
     "react": "18.2.0",
+    "react-datepicker": "^4.19.0",
     "react-dom": "18.2.0",
     "recoil": "^0.7.7",
     "styled-components": "^6.0.7",
@@ -35,7 +41,12 @@
     "@storybook/react": "^7.2.3",
     "@storybook/test-runner": "^0.13.0",
     "@storybook/testing-library": "^0.2.0",
+    "@types/react-datepicker": "^4.15.1",
+    "chromatic": "^6.23.0",
     "eslint-plugin-storybook": "^0.6.13",
-    "storybook": "^7.2.3"
-  }
+    "storybook": "^7.2.3",
+    "tsconfig-paths-webpack-plugin": "^4.1.0"
+  },
+  "readme": "ERROR: No README data found!",
+  "_id": "[email protected]"
 }