feat: 프로젝트 아키텍처 기본 세팅

DingX2 · May 6, 2024 · 694f304 · 694f304
1 parent 4f935f0
commit 694f304
Show file tree

Hide file tree

Showing 13 changed files with 114 additions and 197 deletions.
diff --git a/bun.lockb b/bun.lockb
diff --git a/index.html b/index.html
@@ -1,13 +1,13 @@
 <!doctype html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Solid + TS</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/index.tsx"></script>
-  </body>
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Vite + Solid + TS</title>
+    </head>
+    <body>
+        <div id="root"></div>
+        <script type="module" src="/src/index.tsx"></script>
+    </body>
 </html>
diff --git a/package.json b/package.json
@@ -1,52 +1,61 @@
 {
-    "name": "devxuan",
-    "private": true,
-    "version": "0.0.0",
-    "type": "module",
-    "scripts": {
-        "dev": "vite",
-        "build": "tsc && vite build",
-        "preview": "vite preview",
-        "prepare": "husky",
-        "prettier": "prettier --write .",
-        "type-check": "tsc --noEmit",
-        "type-check:watch": "tsc --noEmit --watch"
-    },
-    "dependencies": {
-        "solid-js": "^1.8.15"
-    },
-    "devDependencies": {
-        "@eslint/js": "^9.1.1",
-        "eslint": "^8.56.0",
-        "eslint-config-airbnb": "^19.0.4",
-        "eslint-config-airbnb-base": "^15.0.0",
-        "eslint-config-airbnb-typescript": "^18.0.0",
-        "eslint-config-prettier": "^9.1.0",
-        "eslint-import-resolver-typescript": "^3.6.1",
-        "eslint-plugin-jsx-a11y": "^6.8.0",
-        "eslint-plugin-solid": "^0.14.0",
-        "globals": "^15.1.0",
-        "husky": "^9.0.11",
-        "lint-staged": "^15.2.2",
-        "prettier": "^3.2.5",
-        "typescript": "^5.2.2",
-        "typescript-eslint": "^7.8.0",
-        "vite": "^5.2.0",
-        "vite-plugin-eslint": "^1.8.1",
-        "vite-plugin-solid": "^2.10.2"
-    },
-    "lint-staged": {
-        "*.{js,jsx,ts,tsx}": [
-            "bash -c 'eslint --fix'",
-            "bash -c 'prettier --write'",
-            "bash -c 'bun lint'",
-            "bash -c 'bun type-check'"
-        ],
-        "*.css": [
-            "bash -c 'bun prettier'"
-        ],
-        "*.{json,md}": [
-            "bash -c 'bun prettier'"
-        ]
-    }
+  "name": "devxuan",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "prepare": "husky",
+    "lint": "eslint .",
+    "prettier": "prettier .",
+    "type-check": "tsc --noEmit",
+    "type-check:watch": "tsc --noEmit --watch"
+  },
+  "dependencies": {
+    "@tanstack/solid-query": "^5.35.1",
+    "@tanstack/solid-query-devtools": "^5.35.1",
+    "framer-motion": "^11.1.8",
+    "ky": "^1.2.4",
+    "solid-js": "^1.8.15",
+    "solid-styled-components": "^0.28.5"
+  },
+  "devDependencies": {
+    "@commitlint/config-conventional": "^19.2.2",
+    "@eslint/js": "^9.1.1",
+    "commitlint": "^19.3.0",
+    "eslint": "^8.56.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-airbnb-base": "^15.0.0",
+    "eslint-config-airbnb-typescript": "^18.0.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-import-resolver-typescript": "^3.6.1",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-solid": "^0.14.0",
+    "globals": "^15.1.0",
+    "husky": "^9.0.11",
+    "lint-staged": "^15.2.2",
+    "prettier": "^3.2.5",
+    "typescript": "^5.2.2",
+    "typescript-eslint": "^7.8.0",
+    "vite": "^5.2.0",
+    "vite-plugin-babel": "^1.2.0",
+    "vite-plugin-eslint": "^1.8.1",
+    "vite-plugin-solid": "^2.10.2"
+  },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx}": [
+      "bash -c 'bun prettier'",
+      "bash -c 'bun lint'",
+      "bash -c 'bun type-check'"
+    ],
+    "*.css": [
+      "bash -c 'bun prettier'"
+    ],
+    "*.{json,md}": [
+      "bash -c 'bun prettier'"
+    ]
+  }
 }
diff --git a/src/App.css b/src/App.css
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,35 +1,29 @@
-import { createSignal } from 'solid-js'
-import solidLogo from './assets/solid.svg'
-import viteLogo from '/vite.svg'
-import './App.css'
+import { type Component, createSignal } from 'solid-js';
+import { styled } from 'solid-styled-components';
+import { Button } from './components/atoms';
+import solidLogo from './assets/solid.svg';
 
-function App() {
-  const [count, setCount] = createSignal(0)
+const Box = styled.div``;
 
-  return (
-    <>
-      <div>
-        <a href="https://vitejs.dev" target="_blank">
-          <img src={viteLogo} class="logo" alt="Vite logo" />
-        </a>
-        <a href="https://solidjs.com" target="_blank">
-          <img src={solidLogo} class="logo solid" alt="Solid logo" />
-        </a>
-      </div>
-      <h1>Vite + Solid</h1>
-      <div class="card">
-        <button onClick={() => setCount((count) => count + 1)}>
-          count is {count()}
-        </button>
-        <p>
-          Edit <code>src/App.tsx</code> and save to test HMR
-        </p>
-      </div>
-      <p class="read-the-docs">
-        Click on the Vite and Solid logos to learn more
-      </p>
-    </>
-  )
-}
+export const App: Component = () => {
+    const [count, setCount] = createSignal(0);
 
-export default App
+    return (
+        <>
+            <div>
+                <a href="https://solidjs.com" target="_blank" rel="noreferrer">
+                    <img src={solidLogo} class="logo solid" alt="Solid logo" />
+                </a>
+            </div>
+            <Box>Vite + Solid</Box>
+            <Button>버튼</Button>
+            <div class="card">
+                <button onClick={() => setCount((count) => count + 1)}>count is {count()}</button>
+                <p>
+                    Edit <code>src/App.tsx</code> and save to test HMR
+                </p>
+            </div>
+            <p class="read-the-docs">Click on the Vite and Solid logos to learn more</p>
+        </>
+    );
+};
diff --git a/src/components/atoms/Button.ts b/src/components/atoms/Button.ts
@@ -0,0 +1,3 @@
+import { styled } from 'solid-styled-components';
+
+export const Button = styled.button``;
diff --git a/src/components/atoms/index.ts b/src/components/atoms/index.ts
@@ -0,0 +1 @@
+export * from './Button';
diff --git a/src/constants/Query.ts b/src/constants/Query.ts
@@ -0,0 +1,6 @@
+export const QUERY_OPTIONS = {
+    retry: 2,
+    refetchOnWindowFocus: false,
+    staleTime: 10 * 60 * 1000,
+    cacheTime: 30 * 60 * 1000,
+};
diff --git a/src/hooks/apis/post-query/respository.ts b/src/hooks/apis/post-query/respository.ts
@@ -1,7 +1,7 @@
-import axios from 'axios';
+import ky from 'ky';
 
 export class PostRepository {
     static getPost() {
-        return axios.get('');
+        return ky.get('');
     }
 }
diff --git a/src/hooks/apis/post-query/type.ts b/src/hooks/apis/post-query/type.ts
diff --git a/src/index.css b/src/index.css
diff --git a/src/index.tsx b/src/index.tsx
@@ -1,9 +1,6 @@
-/* @refresh reload */
-import { render } from 'solid-js/web'
+import { render } from 'solid-js/web';
+import { App } from './App';
 
-import './index.css'
-import App from './App'
+const root = document.getElementById('root');
 
-const root = document.getElementById('root')
-
-render(() => <App />, root!)
+render(() => <App />, root!);
diff --git a/tsconfig.json b/tsconfig.json
@@ -5,6 +5,7 @@
         "module": "ESNext",
         "lib": ["ES2020", "DOM", "DOM.Iterable"],
         "skipLibCheck": true,
+        "allowJs": false,
         "baseUrl": ".",
         "paths": {
             "@/*": ["./*"]
@@ -13,9 +14,10 @@
         /* Bundler mode */
         "moduleResolution": "bundler",
         "allowImportingTsExtensions": true,
+        "declaration": true,
+        "noEmit": true,
         "resolveJsonModule": true,
         "isolatedModules": true,
-        "noEmit": true,
         "jsx": "preserve",
         "jsxImportSource": "solid-js",
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import { styled } from 'solid-styled-components';

		export const Button = styled.button``;