From e8ce3afb940b9d8f23ea56e5698015b3b3dc27d8 Mon Sep 17 00:00:00 2001
From: sungahChooo <170587664+sungahChooo@users.noreply.github.com>
Date: Wed, 24 Sep 2025 16:40:50 +0900
Subject: [PATCH 01/60] =?UTF-8?q?chore:=20=EA=B0=9C=EB=B0=9C=20=ED=99=98?=
=?UTF-8?q?=EA=B2=BD=20=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.gitignore | 24 +
.prettierrc | 12 +
README.md | 142 +-
eslint.config.js | 23 +
index.html | 12 +
package-lock.json | 4138 +++++++++++++++++++++++++++++++++++++++++++
package.json | 35 +
src/.prettierignore | 3 +
src/App.tsx | 11 +
src/index.css | 3 +
src/main.tsx | 10 +
tsconfig.app.json | 28 +
tsconfig.json | 7 +
tsconfig.node.json | 26 +
vite.config.ts | 8 +
15 files changed, 4413 insertions(+), 69 deletions(-)
create mode 100644 .gitignore
create mode 100644 .prettierrc
create mode 100644 eslint.config.js
create mode 100644 index.html
create mode 100644 package-lock.json
create mode 100644 package.json
create mode 100644 src/.prettierignore
create mode 100644 src/App.tsx
create mode 100644 src/index.css
create mode 100644 src/main.tsx
create mode 100644 tsconfig.app.json
create mode 100644 tsconfig.json
create mode 100644 tsconfig.node.json
create mode 100644 vite.config.ts
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 00000000..a547bf36
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 00000000..958d068c
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,12 @@
+{
+ "arrowParens": "always",
+ "bracketSpacing": true,
+ "endOfLine": "lf",
+ "printWidth": 120,
+ "semi": true,
+ "singleQuote": true,
+ "tabWidth": 2,
+ "trailingComma": "all",
+ "useTabs": false,
+ "plugins": ["prettier-plugin-tailwindcss"]
+}
diff --git a/README.md b/README.md
index 3363b5e5..4866cf0f 100644
--- a/README.md
+++ b/README.md
@@ -1,69 +1,73 @@
-# 3주차 과제: React Messenger
-
-# 서론
-
-안녕하세요 🙌🏻 22기 프론트엔트 운영진 **권동욱**입니다. 이번에는 드디어 투두리스트에서 벗어나 새로운 프로젝트인 **messenger** 만들기를 진행합니다.
-
-이번 주는 특별하게 **디자이너와의 협업**으로 진행되는 과제입니다. 디자이너분께서 열심히 리디자인 한 메신저 프로젝트를 여러분들께서 구현해주시면 됩니다.
-
-동시에, 이번 주부터는 **필수** **TypeScript** 와 **tailwind CSS**를 적용해보려고 합니다.
-
-프로젝트의 규모가 커지게 될수록, 컴포넌트가 가지는 props의 종류 또한 다양해지게 됩니다. 무지성 코딩을 하다 보면 가끔 이 props의 구성과 이름, 어떤 타입이 들어가야 하는지 헷갈리기 마련이죠. 보통 그럴 때 다시 컴포넌트 정의 부분으로 돌아가 props의 구성을 보고 오곤 합니다.
-
-하지만 이럴 때, typescript를 적용한다면 컴포넌트의 구성과 그 이름, 심지어 타입까지 한번에 자동완성으로 편리하게 관리할 수 있고, 생산성이 증대되겠죠.
-
-또한, **React Hooks**에 조금 더 익숙해지는 것을 목표로 합니다. 여러 Hook들이 있지만 그 중에서도 `useState`, `useEffect`, `useRef`를 중점적으로 사용해 보는 과제인데요, React를 사용하면서 굉장히 자주 쓰이는 Hook들이기 때문에 이 부분을 집중적으로 공부해 보아요!
-
-그럼 이번 과제도 파이팅입니다!!🎉
-
-# 과제
-
-## 목표
-
-- TypeScript를 사용해봅시다.
-- useState로 컴포넌트의 상태를 관리합니다.
-- useEffect와 useRef의 사용법을 이해합니다.
-- tailwind CSS의 사용법에 익숙해집니다.
-
-## 기한
-
-- 2025년 9월 27일 토요일 23:59까지
-
-## Review Questions
-
-- 디자이너로부터 전달받은 피그마 링크, 피그마 캡처본, 디자이너와의 소통 tmi 등
-- JSX, JS, TSX, TS 각각의 확장자 개념 사용이유와 차이점.
-- TypeScript를 사용하는 이유.
-- SSR과 CSR 특성 및 차이점.
-
-## 필수 구현 기능
-
-- 피그마를 보고 [결과화면](https://react-messenger-21th-kwondu.vercel.app/)과 같이 구현합니다.
-- 디자인 시스템을 구축합니다.
-- tailwind CSS를 사용합니다.
-- 메세지를 보내면 채팅방 하단으로 스크롤을 이동시킵니다.
-- 메세지에 유저 정보(프로필 사진, 이름)를 표시합니다.
-- user와 message 데이터를 json 파일에 저장합니다.
-- UI는 **반응형을 제외**하고 피그마파일을 따라서 진행합니다.
-
-### 추가 구현 기능
-
-- 채팅방 상단의 프로필을 클릭하면 사용자를 변경할 수 있습니다.
-- 더블 클릭 하면 감정표현을 추가합니다.
-- 그 외 추가하고 싶은 기능이 있다면 마음껏 추가해 주세요!
-
-참고로 이번 과제는 다음 과제까지 이어지는 과제이므로 **확장성**을 충분히 고려해 주세요. 참고로 **4주차 과제에서는 유저 및 기능 추가와 Routing을** 진행합니다. 이를 위해 [zustand](https://zustand.docs.pmnd.rs/getting-started/introduction)를 이용한 상태관리를 미리 해보시는 것을 추천합니다!!
-
-## 링크 및 참고자료
-
-- [React docs - Hook](https://ko.reactjs.org/docs/hooks-intro.html)
-- [React의 Hooks 완벽 정복하기](https://velog.io/@velopert/react-hooks#1-usestate)
-- [useEffect 완벽 가이드](https://overreacted.io/ko/a-complete-guide-to-useeffect/)
-- [코딩 컨벤션](https://ui.toast.com/fe-guide/ko_CODING-CONVENTION)
-- [타입스크립트 핸드북](https://joshua1988.github.io/ts/intro.html)
-- [리액트 프로젝트에서 타입스크립트 사용하기 (시리즈)](https://velog.io/@velopert/series/react-with-typescript)
-- [디자인 시스템 구축기](https://yozm.wishket.com/magazine/detail/1830/)
-- [[영상] : 컴포넌트에 대한 이해](https://www.youtube.com/watch?v=21eiJc90ggo)
-- [Styled Component로 디자인 시스템 구축하기](https://zaat.dev/blog/building-a-design-system-in-react-with-styled-components/)
-- [Tailwind CSS 장단점, 사용법](https://wonny.space/writing/dev/hello-tailwind-css)
-- [ts 절대경로 설정하기](https://tesseractjh.tistory.com/232)
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## React Compiler
+
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default defineConfig([
+ globalIgnores(['dist']),
+ {
+ files: ['**/*.{ts,tsx}'],
+ extends: [
+ // Other configs...
+
+ // Remove tseslint.configs.recommended and replace with this
+ tseslint.configs.recommendedTypeChecked,
+ // Alternatively, use this for stricter rules
+ tseslint.configs.strictTypeChecked,
+ // Optionally, add this for stylistic rules
+ tseslint.configs.stylisticTypeChecked,
+
+ // Other configs...
+ ],
+ languageOptions: {
+ parserOptions: {
+ project: ['./tsconfig.node.json', './tsconfig.app.json'],
+ tsconfigRootDir: import.meta.dirname,
+ },
+ // other options...
+ },
+ },
+])
+```
+
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
+
+```js
+// eslint.config.js
+import reactX from 'eslint-plugin-react-x'
+import reactDom from 'eslint-plugin-react-dom'
+
+export default defineConfig([
+ globalIgnores(['dist']),
+ {
+ files: ['**/*.{ts,tsx}'],
+ extends: [
+ // Other configs...
+ // Enable lint rules for React
+ reactX.configs['recommended-typescript'],
+ // Enable lint rules for React DOM
+ reactDom.configs.recommended,
+ ],
+ languageOptions: {
+ parserOptions: {
+ project: ['./tsconfig.node.json', './tsconfig.app.json'],
+ tsconfigRootDir: import.meta.dirname,
+ },
+ // other options...
+ },
+ },
+])
+```
diff --git a/eslint.config.js b/eslint.config.js
new file mode 100644
index 00000000..b19330b1
--- /dev/null
+++ b/eslint.config.js
@@ -0,0 +1,23 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+import { defineConfig, globalIgnores } from 'eslint/config'
+
+export default defineConfig([
+ globalIgnores(['dist']),
+ {
+ files: ['**/*.{ts,tsx}'],
+ extends: [
+ js.configs.recommended,
+ tseslint.configs.recommended,
+ reactHooks.configs['recommended-latest'],
+ reactRefresh.configs.vite,
+ ],
+ languageOptions: {
+ ecmaVersion: 2020,
+ globals: globals.browser,
+ },
+ },
+])
diff --git a/index.html b/index.html
new file mode 100644
index 00000000..ac1f50e1
--- /dev/null
+++ b/index.html
@@ -0,0 +1,12 @@
+
+
+
+
From 77a5070ee0940898ad44da3d10feaf2325112646 Mon Sep 17 00:00:00 2001
From: sungahChooo <170587664+sungahChooo@users.noreply.github.com>
Date: Fri, 26 Sep 2025 23:17:10 +0900
Subject: [PATCH 04/60] =?UTF-8?q?feat:=20friendList=ED=8E=98=EC=9D=B4?=
=?UTF-8?q?=EC=A7=80=20=EA=B5=AC=ED=98=84,=20=EC=82=AC=EC=9D=B4=EB=93=9C?=
=?UTF-8?q?=EB=B0=94=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/.prettierignore => .prettierignore | 0
index.html | 2 +
package-lock.json | 653 +++++++++++++++++++++++--
package.json | 8 +-
postcss.config.cjs | 6 +
src/App.css | 0
src/App.tsx | 24 +-
src/assets/addFriend.png | Bin 0 -> 433 bytes
src/assets/call.svg | 3 +
src/assets/callG.png | Bin 0 -> 476 bytes
src/assets/chatIcon.svg | 3 +
src/assets/chatIconG.svg | 3 +
src/assets/community.svg | 3 +
src/assets/communityG.png | Bin 0 -> 659 bytes
src/assets/find.png | Bin 0 -> 405 bytes
src/assets/friend.svg | 4 +
src/assets/friendIconG.svg | 4 +
src/assets/profileImage.png | Bin 0 -> 2063 bytes
src/assets/setting.svg | 3 +
src/assets/settingG.png | Bin 0 -> 536 bytes
src/assets/text-navigation.png | Bin 0 -> 537 bytes
src/custom.d.ts | 7 +
src/index.css | 9 +
src/pages/calls/Call.tsx | 8 +
src/pages/chat/Chatting.tsx | 8 +
src/pages/community/Community.tsx | 8 +
src/pages/friendList/FriendList.tsx | 44 ++
src/pages/settings/Setting.tsx | 8 +
src/pages/sidebar/Sidebar.tsx | 87 ++++
tailwind.config.js | 15 +
vite.config.ts | 10 +-
31 files changed, 867 insertions(+), 53 deletions(-)
rename src/.prettierignore => .prettierignore (100%)
create mode 100644 postcss.config.cjs
create mode 100644 src/App.css
create mode 100644 src/assets/addFriend.png
create mode 100644 src/assets/call.svg
create mode 100644 src/assets/callG.png
create mode 100644 src/assets/chatIcon.svg
create mode 100644 src/assets/chatIconG.svg
create mode 100644 src/assets/community.svg
create mode 100644 src/assets/communityG.png
create mode 100644 src/assets/find.png
create mode 100644 src/assets/friend.svg
create mode 100644 src/assets/friendIconG.svg
create mode 100644 src/assets/profileImage.png
create mode 100644 src/assets/setting.svg
create mode 100644 src/assets/settingG.png
create mode 100644 src/assets/text-navigation.png
create mode 100644 src/custom.d.ts
create mode 100644 src/pages/calls/Call.tsx
create mode 100644 src/pages/chat/Chatting.tsx
create mode 100644 src/pages/community/Community.tsx
create mode 100644 src/pages/friendList/FriendList.tsx
create mode 100644 src/pages/settings/Setting.tsx
create mode 100644 src/pages/sidebar/Sidebar.tsx
create mode 100644 tailwind.config.js
diff --git a/src/.prettierignore b/.prettierignore
similarity index 100%
rename from src/.prettierignore
rename to .prettierignore
diff --git a/index.html b/index.html
index ac1f50e1..23677463 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,8 @@
whats app
+
+
diff --git a/package-lock.json b/package-lock.json
index 87c5b512..dc1a9e84 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,12 +10,15 @@
"dependencies": {
"@tailwindcss/vite": "^4.1.13",
"react": "^19.1.1",
- "react-dom": "^19.1.1"
+ "react-dom": "^19.1.1",
+ "react-router-dom": "^7.9.2"
},
"devDependencies": {
"@eslint/js": "^9.36.0",
+ "@tailwindcss/postcss": "^4.1.13",
"@types/react": "^19.1.13",
"@types/react-dom": "^19.1.9",
+ "@types/react-router-dom": "^5.3.3",
"@vitejs/plugin-react": "^5.0.3",
"autoprefixer": "^10.4.21",
"eslint": "^9.36.0",
@@ -28,7 +31,21 @@
"tailwindcss": "^4.1.13",
"typescript": "~5.8.3",
"typescript-eslint": "^8.44.0",
- "vite": "^7.1.7"
+ "vite": "^7.1.7",
+ "vite-plugin-svgr": "^4.5.0"
+ }
+ },
+ "node_modules/@alloc/quick-lru": {
+ "version": "5.2.0",
+ "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
+ "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=10"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/@babel/code-frame": {
@@ -713,22 +730,6 @@
"node": ">=18"
}
},
- "node_modules/@esbuild/win32-x64": {
- "version": "0.25.10",
- "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.10.tgz",
- "integrity": "sha512-9KpxSVFCu0iK1owoez6aC/s/EdUQLDN3adTxGCqxMVhrPDj6bt5dbrHDXUuq+Bs2vATFBBrQS5vdQ/Ed2P+nbw==",
- "cpu": [
- "x64"
- ],
- "license": "MIT",
- "optional": true,
- "os": [
- "win32"
- ],
- "engines": {
- "node": ">=18"
- }
- },
"node_modules/@eslint-community/eslint-utils": {
"version": "4.9.0",
"resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.0.tgz",
@@ -1037,6 +1038,42 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/@rollup/pluginutils": {
+ "version": "5.3.0",
+ "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.3.0.tgz",
+ "integrity": "sha512-5EdhGZtnu3V88ces7s53hhfK5KSASnJZv8Lulpc04cWO3REESroJXg73DFsOmgbU2BhwV0E20bu2IDZb3VKW4Q==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@types/estree": "^1.0.0",
+ "estree-walker": "^2.0.2",
+ "picomatch": "^4.0.2"
+ },
+ "engines": {
+ "node": ">=14.0.0"
+ },
+ "peerDependencies": {
+ "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
+ },
+ "peerDependenciesMeta": {
+ "rollup": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@rollup/pluginutils/node_modules/picomatch": {
+ "version": "4.0.3",
+ "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+ "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=12"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/jonschlinkert"
+ }
+ },
"node_modules/@rollup/rollup-android-arm-eabi": {
"version": "4.52.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.52.2.tgz",
@@ -1310,18 +1347,230 @@
"win32"
]
},
- "node_modules/@rollup/rollup-win32-x64-msvc": {
- "version": "4.52.2",
- "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.52.2.tgz",
- "integrity": "sha512-ARz+Bs8kY6FtitYM96PqPEVvPXqEZmPZsSkXvyX19YzDqkCaIlhCieLLMI5hxO9SRZ2XtCtm8wxhy0iJ2jxNfw==",
- "cpu": [
- "x64"
- ],
+ "node_modules/@svgr/babel-plugin-add-jsx-attribute": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-8.0.0.tgz",
+ "integrity": "sha512-b9MIk7yhdS1pMCZM8VeNfUlSKVRhsHZNMl5O9SfaX0l0t5wjdgu4IDzGB8bpnGBBOjGST3rRFVsaaEtI4W6f7g==",
+ "dev": true,
"license": "MIT",
- "optional": true,
- "os": [
- "win32"
- ]
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-plugin-remove-jsx-attribute": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-remove-jsx-attribute/-/babel-plugin-remove-jsx-attribute-8.0.0.tgz",
+ "integrity": "sha512-BcCkm/STipKvbCl6b7QFrMh/vx00vIP63k2eM66MfHJzPr6O2U0jYEViXkHJWqXqQYjdeA9cuCl5KWmlwjDvbA==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-plugin-remove-jsx-empty-expression": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-remove-jsx-empty-expression/-/babel-plugin-remove-jsx-empty-expression-8.0.0.tgz",
+ "integrity": "sha512-5BcGCBfBxB5+XSDSWnhTThfI9jcO5f0Ai2V24gZpG+wXF14BzwxxdDb4g6trdOux0rhibGs385BeFMSmxtS3uA==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-plugin-replace-jsx-attribute-value": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-replace-jsx-attribute-value/-/babel-plugin-replace-jsx-attribute-value-8.0.0.tgz",
+ "integrity": "sha512-KVQ+PtIjb1BuYT3ht8M5KbzWBhdAjjUPdlMtpuw/VjT8coTrItWX6Qafl9+ji831JaJcu6PJNKCV0bp01lBNzQ==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-plugin-svg-dynamic-title": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-svg-dynamic-title/-/babel-plugin-svg-dynamic-title-8.0.0.tgz",
+ "integrity": "sha512-omNiKqwjNmOQJ2v6ge4SErBbkooV2aAWwaPFs2vUY7p7GhVkzRkJ00kILXQvRhA6miHnNpXv7MRnnSjdRjK8og==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-plugin-svg-em-dimensions": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-svg-em-dimensions/-/babel-plugin-svg-em-dimensions-8.0.0.tgz",
+ "integrity": "sha512-mURHYnu6Iw3UBTbhGwE/vsngtCIbHE43xCRK7kCw4t01xyGqb2Pd+WXekRRoFOBIY29ZoOhUCTEweDMdrjfi9g==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-plugin-transform-react-native-svg": {
+ "version": "8.1.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-transform-react-native-svg/-/babel-plugin-transform-react-native-svg-8.1.0.tgz",
+ "integrity": "sha512-Tx8T58CHo+7nwJ+EhUwx3LfdNSG9R2OKfaIXXs5soiy5HtgoAEkDay9LIimLOcG8dJQH1wPZp/cnAv6S9CrR1Q==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-plugin-transform-svg-component": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-transform-svg-component/-/babel-plugin-transform-svg-component-8.0.0.tgz",
+ "integrity": "sha512-DFx8xa3cZXTdb/k3kfPeaixecQLgKh5NVBMwD0AQxOzcZawK4oo1Jh9LbrcACUivsCA7TLG8eeWgrDXjTMhRmw==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=12"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/babel-preset": {
+ "version": "8.1.0",
+ "resolved": "https://registry.npmjs.org/@svgr/babel-preset/-/babel-preset-8.1.0.tgz",
+ "integrity": "sha512-7EYDbHE7MxHpv4sxvnVPngw5fuR6pw79SkcrILHJ/iMpuKySNCl5W1qcwPEpU+LgyRXOaAFgH0KhwD18wwg6ug==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@svgr/babel-plugin-add-jsx-attribute": "8.0.0",
+ "@svgr/babel-plugin-remove-jsx-attribute": "8.0.0",
+ "@svgr/babel-plugin-remove-jsx-empty-expression": "8.0.0",
+ "@svgr/babel-plugin-replace-jsx-attribute-value": "8.0.0",
+ "@svgr/babel-plugin-svg-dynamic-title": "8.0.0",
+ "@svgr/babel-plugin-svg-em-dimensions": "8.0.0",
+ "@svgr/babel-plugin-transform-react-native-svg": "8.1.0",
+ "@svgr/babel-plugin-transform-svg-component": "8.0.0"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@babel/core": "^7.0.0-0"
+ }
+ },
+ "node_modules/@svgr/core": {
+ "version": "8.1.0",
+ "resolved": "https://registry.npmjs.org/@svgr/core/-/core-8.1.0.tgz",
+ "integrity": "sha512-8QqtOQT5ACVlmsvKOJNEaWmRPmcojMOzCz4Hs2BGG/toAp/K38LcsMRyLp349glq5AzJbCEeimEoxaX6v/fLrA==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/core": "^7.21.3",
+ "@svgr/babel-preset": "8.1.0",
+ "camelcase": "^6.2.0",
+ "cosmiconfig": "^8.1.3",
+ "snake-case": "^3.0.4"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ }
+ },
+ "node_modules/@svgr/hast-util-to-babel-ast": {
+ "version": "8.0.0",
+ "resolved": "https://registry.npmjs.org/@svgr/hast-util-to-babel-ast/-/hast-util-to-babel-ast-8.0.0.tgz",
+ "integrity": "sha512-EbDKwO9GpfWP4jN9sGdYwPBU0kdomaPIL2Eu4YwmgP+sJeXT+L7bMwJUBnhzfH8Q2qMBqZ4fJwpCyYsAN3mt2Q==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/types": "^7.21.3",
+ "entities": "^4.4.0"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ }
+ },
+ "node_modules/@svgr/plugin-jsx": {
+ "version": "8.1.0",
+ "resolved": "https://registry.npmjs.org/@svgr/plugin-jsx/-/plugin-jsx-8.1.0.tgz",
+ "integrity": "sha512-0xiIyBsLlr8quN+WyuxooNW9RJ0Dpr8uOnH/xrCVO8GLUcwHISwj1AG0k+LFzteTkAA0GbX0kj9q6Dk70PTiPA==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/core": "^7.21.3",
+ "@svgr/babel-preset": "8.1.0",
+ "@svgr/hast-util-to-babel-ast": "8.0.0",
+ "svg-parser": "^2.0.4"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "type": "github",
+ "url": "https://github.com/sponsors/gregberge"
+ },
+ "peerDependencies": {
+ "@svgr/core": "*"
+ }
},
"node_modules/@tailwindcss/node": {
"version": "4.1.13",
@@ -1555,7 +1804,7 @@
"node": ">= 10"
}
},
- "node_modules/@tailwindcss/oxide-win32-x64-msvc": {
+ "node_modules/@tailwindcss/oxide/node_modules/@tailwindcss/oxide-win32-x64-msvc": {
"version": "4.1.13",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.1.13.tgz",
"integrity": "sha512-3+LKesjXydTkHk5zXX01b5KMzLV1xl2mcktBJkje7rhFUpUlYJy7IMOLqjIRQncLTa1WZZiFY/foAeB5nmaiTw==",
@@ -1571,6 +1820,20 @@
"node": ">= 10"
}
},
+ "node_modules/@tailwindcss/postcss": {
+ "version": "4.1.13",
+ "resolved": "https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.1.13.tgz",
+ "integrity": "sha512-HLgx6YSFKJT7rJqh9oJs/TkBFhxuMOfUKSBEPYwV+t78POOBsdQ7crhZLzwcH3T0UyUuOzU/GK5pk5eKr3wCiQ==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@alloc/quick-lru": "^5.2.0",
+ "@tailwindcss/node": "4.1.13",
+ "@tailwindcss/oxide": "4.1.13",
+ "postcss": "^8.4.41",
+ "tailwindcss": "4.1.13"
+ }
+ },
"node_modules/@tailwindcss/vite": {
"version": "4.1.13",
"resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.1.13.tgz",
@@ -1636,6 +1899,13 @@
"integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
"license": "MIT"
},
+ "node_modules/@types/history": {
+ "version": "4.7.11",
+ "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz",
+ "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/@types/json-schema": {
"version": "7.0.15",
"resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
@@ -1663,6 +1933,29 @@
"@types/react": "^19.0.0"
}
},
+ "node_modules/@types/react-router": {
+ "version": "5.1.20",
+ "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.20.tgz",
+ "integrity": "sha512-jGjmu/ZqS7FjSH6owMcD5qpq19+1RS9DeVRqfl1FeBMxTDQAGwlMWOcs52NDoXaNKyG3d1cYQFMs9rCrb88o9Q==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@types/history": "^4.7.11",
+ "@types/react": "*"
+ }
+ },
+ "node_modules/@types/react-router-dom": {
+ "version": "5.3.3",
+ "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.3.tgz",
+ "integrity": "sha512-kpqnYK4wcdm5UaWI3fLcELopqLrHgLqNsdpHauzlQktfkHL3npOSwtj1Uz9oKBAzs7lFtVkV8j83voAz2D8fhw==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@types/history": "^4.7.11",
+ "@types/react": "*",
+ "@types/react-router": "*"
+ }
+ },
"node_modules/@typescript-eslint/eslint-plugin": {
"version": "8.44.1",
"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.44.1.tgz",
@@ -2064,9 +2357,9 @@
"license": "MIT"
},
"node_modules/baseline-browser-mapping": {
- "version": "2.8.6",
- "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.6.tgz",
- "integrity": "sha512-wrH5NNqren/QMtKUEEJf7z86YjfqW/2uw3IL3/xpqZUC95SSVIFXYQeeGjL6FT/X68IROu6RMehZQS5foy2BXw==",
+ "version": "2.8.7",
+ "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.7.tgz",
+ "integrity": "sha512-bxxN2M3a4d1CRoQC//IqsR5XrLh0IJ8TCv2x6Y9N0nckNz/rTjZB3//GGscZziZOxmjP55rzxg/ze7usFI9FqQ==",
"dev": true,
"license": "Apache-2.0",
"bin": {
@@ -2141,10 +2434,23 @@
"node": ">=6"
}
},
+ "node_modules/camelcase": {
+ "version": "6.3.0",
+ "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz",
+ "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=10"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/sindresorhus"
+ }
+ },
"node_modules/caniuse-lite": {
- "version": "1.0.30001743",
- "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001743.tgz",
- "integrity": "sha512-e6Ojr7RV14Un7dz6ASD0aZDmQPT/A+eZU+nuTNfjqmRrmkmQlnTNWH0SKmqagx9PeW87UVqapSurtAXifmtdmw==",
+ "version": "1.0.30001745",
+ "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001745.tgz",
+ "integrity": "sha512-ywt6i8FzvdgrrrGbr1jZVObnVv6adj+0if2/omv9cmR2oiZs30zL4DIyaptKcbOrBdOIc74QTMoJvSE2QHh5UQ==",
"dev": true,
"funding": [
{
@@ -2222,6 +2528,42 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/cookie": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz",
+ "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==",
+ "license": "MIT",
+ "engines": {
+ "node": ">=18"
+ }
+ },
+ "node_modules/cosmiconfig": {
+ "version": "8.3.6",
+ "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz",
+ "integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "import-fresh": "^3.3.0",
+ "js-yaml": "^4.1.0",
+ "parse-json": "^5.2.0",
+ "path-type": "^4.0.0"
+ },
+ "engines": {
+ "node": ">=14"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/d-fischer"
+ },
+ "peerDependencies": {
+ "typescript": ">=4.9.5"
+ },
+ "peerDependenciesMeta": {
+ "typescript": {
+ "optional": true
+ }
+ }
+ },
"node_modules/cross-spawn": {
"version": "7.0.6",
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -2270,14 +2612,25 @@
"license": "MIT"
},
"node_modules/detect-libc": {
- "version": "2.1.0",
- "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.0.tgz",
- "integrity": "sha512-vEtk+OcP7VBRtQZ1EJ3bdgzSfBjgnEalLTp5zjJrS+2Z1w2KZly4SBdac/WDU3hhsNAZ9E8SC96ME4Ey8MZ7cg==",
+ "version": "2.1.1",
+ "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.1.tgz",
+ "integrity": "sha512-ecqj/sy1jcK1uWrwpR67UhYrIFQ+5WlGxth34WquCbamhFA6hkkwiu37o6J5xCHdo1oixJRfVRw+ywV+Hq/0Aw==",
"license": "Apache-2.0",
"engines": {
"node": ">=8"
}
},
+ "node_modules/dot-case": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz",
+ "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "no-case": "^3.0.4",
+ "tslib": "^2.0.3"
+ }
+ },
"node_modules/electron-to-chromium": {
"version": "1.5.223",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.223.tgz",
@@ -2298,6 +2651,29 @@
"node": ">=10.13.0"
}
},
+ "node_modules/entities": {
+ "version": "4.5.0",
+ "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+ "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+ "dev": true,
+ "license": "BSD-2-Clause",
+ "engines": {
+ "node": ">=0.12"
+ },
+ "funding": {
+ "url": "https://github.com/fb55/entities?sponsor=1"
+ }
+ },
+ "node_modules/error-ex": {
+ "version": "1.3.4",
+ "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.4.tgz",
+ "integrity": "sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "is-arrayish": "^0.2.1"
+ }
+ },
"node_modules/esbuild": {
"version": "0.25.10",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.10.tgz",
@@ -2339,6 +2715,22 @@
"@esbuild/win32-x64": "0.25.10"
}
},
+ "node_modules/esbuild/node_modules/@esbuild/win32-x64": {
+ "version": "0.25.10",
+ "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.10.tgz",
+ "integrity": "sha512-9KpxSVFCu0iK1owoez6aC/s/EdUQLDN3adTxGCqxMVhrPDj6bt5dbrHDXUuq+Bs2vATFBBrQS5vdQ/Ed2P+nbw==",
+ "cpu": [
+ "x64"
+ ],
+ "license": "MIT",
+ "optional": true,
+ "os": [
+ "win32"
+ ],
+ "engines": {
+ "node": ">=18"
+ }
+ },
"node_modules/escalade": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
@@ -2437,9 +2829,9 @@
}
},
"node_modules/eslint-plugin-react-refresh": {
- "version": "0.4.21",
- "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.21.tgz",
- "integrity": "sha512-MWDWTtNC4voTcWDxXbdmBNe8b/TxfxRFUL6hXgKWJjN9c1AagYEmpiFWBWzDw+5H3SulWUe1pJKTnoSdmk88UA==",
+ "version": "0.4.22",
+ "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.22.tgz",
+ "integrity": "sha512-atkAG6QaJMGoTLc4MDAP+rqZcfwQuTIh2IqHWFLy2TEjxr0MOK+5BSG4RzL2564AAPpZkDRsZXAUz68kjnU6Ug==",
"dev": true,
"license": "MIT",
"peerDependencies": {
@@ -2530,6 +2922,13 @@
"node": ">=4.0"
}
},
+ "node_modules/estree-walker": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz",
+ "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/esutils": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
@@ -2789,6 +3188,13 @@
"node": ">=0.8.19"
}
},
+ "node_modules/is-arrayish": {
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+ "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/is-extglob": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@@ -2878,6 +3284,13 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/json-parse-even-better-errors": {
+ "version": "2.3.1",
+ "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
+ "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/json-schema-traverse": {
"version": "0.4.1",
"resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -3137,7 +3550,7 @@
"url": "https://opencollective.com/parcel"
}
},
- "node_modules/lightningcss-win32-x64-msvc": {
+ "node_modules/lightningcss/node_modules/lightningcss-win32-x64-msvc": {
"version": "1.30.1",
"resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.30.1.tgz",
"integrity": "sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==",
@@ -3157,6 +3570,13 @@
"url": "https://opencollective.com/parcel"
}
},
+ "node_modules/lines-and-columns": {
+ "version": "1.2.4",
+ "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
+ "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/locate-path": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -3180,6 +3600,16 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/lower-case": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
+ "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "tslib": "^2.0.3"
+ }
+ },
"node_modules/lru-cache": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
@@ -3289,6 +3719,17 @@
"dev": true,
"license": "MIT"
},
+ "node_modules/no-case": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz",
+ "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "lower-case": "^2.0.2",
+ "tslib": "^2.0.3"
+ }
+ },
"node_modules/node-releases": {
"version": "2.0.21",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.21.tgz",
@@ -3369,6 +3810,25 @@
"node": ">=6"
}
},
+ "node_modules/parse-json": {
+ "version": "5.2.0",
+ "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
+ "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@babel/code-frame": "^7.0.0",
+ "error-ex": "^1.3.1",
+ "json-parse-even-better-errors": "^2.3.0",
+ "lines-and-columns": "^1.1.6"
+ },
+ "engines": {
+ "node": ">=8"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/sindresorhus"
+ }
+ },
"node_modules/path-exists": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -3389,6 +3849,16 @@
"node": ">=8"
}
},
+ "node_modules/path-type": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
+ "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
+ "dev": true,
+ "license": "MIT",
+ "engines": {
+ "node": ">=8"
+ }
+ },
"node_modules/picocolors": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -3618,6 +4088,44 @@
"node": ">=0.10.0"
}
},
+ "node_modules/react-router": {
+ "version": "7.9.2",
+ "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.9.2.tgz",
+ "integrity": "sha512-i2TPp4dgaqrOqiRGLZmqh2WXmbdFknUyiCRmSKs0hf6fWXkTKg5h56b+9F22NbGRAMxjYfqQnpi63egzD2SuZA==",
+ "license": "MIT",
+ "dependencies": {
+ "cookie": "^1.0.1",
+ "set-cookie-parser": "^2.6.0"
+ },
+ "engines": {
+ "node": ">=20.0.0"
+ },
+ "peerDependencies": {
+ "react": ">=18",
+ "react-dom": ">=18"
+ },
+ "peerDependenciesMeta": {
+ "react-dom": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/react-router-dom": {
+ "version": "7.9.2",
+ "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.9.2.tgz",
+ "integrity": "sha512-pagqpVJnjZOfb+vIM23eTp7Sp/AAJjOgaowhP1f1TWOdk5/W8Uk8d/M/0wfleqx7SgjitjNPPsKeCZE1hTSp3w==",
+ "license": "MIT",
+ "dependencies": {
+ "react-router": "7.9.2"
+ },
+ "engines": {
+ "node": ">=20.0.0"
+ },
+ "peerDependencies": {
+ "react": ">=18",
+ "react-dom": ">=18"
+ }
+ },
"node_modules/resolve-from": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
@@ -3680,6 +4188,19 @@
"fsevents": "~2.3.2"
}
},
+ "node_modules/rollup/node_modules/@rollup/rollup-win32-x64-msvc": {
+ "version": "4.52.2",
+ "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.52.2.tgz",
+ "integrity": "sha512-ARz+Bs8kY6FtitYM96PqPEVvPXqEZmPZsSkXvyX19YzDqkCaIlhCieLLMI5hxO9SRZ2XtCtm8wxhy0iJ2jxNfw==",
+ "cpu": [
+ "x64"
+ ],
+ "license": "MIT",
+ "optional": true,
+ "os": [
+ "win32"
+ ]
+ },
"node_modules/run-parallel": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@@ -3720,6 +4241,12 @@
"semver": "bin/semver.js"
}
},
+ "node_modules/set-cookie-parser": {
+ "version": "2.7.1",
+ "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
+ "integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==",
+ "license": "MIT"
+ },
"node_modules/shebang-command": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -3743,6 +4270,17 @@
"node": ">=8"
}
},
+ "node_modules/snake-case": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz",
+ "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "dot-case": "^3.0.4",
+ "tslib": "^2.0.3"
+ }
+ },
"node_modules/source-map-js": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
@@ -3778,6 +4316,13 @@
"node": ">=8"
}
},
+ "node_modules/svg-parser": {
+ "version": "2.0.4",
+ "resolved": "https://registry.npmjs.org/svg-parser/-/svg-parser-2.0.4.tgz",
+ "integrity": "sha512-e4hG1hRwoOdRb37cIMSgzNsxyzKfayW6VOflrwvR+/bzrkyxY/31WkbgnQpgtrNp1SdpJvpUAGTa/ZoiPNDuRQ==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/tailwindcss": {
"version": "4.1.13",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.13.tgz",
@@ -3893,6 +4438,13 @@
"typescript": ">=4.8.4"
}
},
+ "node_modules/tslib": {
+ "version": "2.8.1",
+ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+ "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+ "devOptional": true,
+ "license": "0BSD"
+ },
"node_modules/type-check": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
@@ -4059,6 +4611,21 @@
}
}
},
+ "node_modules/vite-plugin-svgr": {
+ "version": "4.5.0",
+ "resolved": "https://registry.npmjs.org/vite-plugin-svgr/-/vite-plugin-svgr-4.5.0.tgz",
+ "integrity": "sha512-W+uoSpmVkSmNOGPSsDCWVW/DDAyv+9fap9AZXBvWiQqrboJ08j2vh0tFxTD/LjwqwAd3yYSVJgm54S/1GhbdnA==",
+ "dev": true,
+ "license": "MIT",
+ "dependencies": {
+ "@rollup/pluginutils": "^5.2.0",
+ "@svgr/core": "^8.1.0",
+ "@svgr/plugin-jsx": "^8.1.0"
+ },
+ "peerDependencies": {
+ "vite": ">=2.6.0"
+ }
+ },
"node_modules/vite/node_modules/fdir": {
"version": "6.5.0",
"resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
diff --git a/package.json b/package.json
index e349eb2c..6c818e50 100644
--- a/package.json
+++ b/package.json
@@ -12,12 +12,15 @@
"dependencies": {
"@tailwindcss/vite": "^4.1.13",
"react": "^19.1.1",
- "react-dom": "^19.1.1"
+ "react-dom": "^19.1.1",
+ "react-router-dom": "^7.9.2"
},
"devDependencies": {
"@eslint/js": "^9.36.0",
+ "@tailwindcss/postcss": "^4.1.13",
"@types/react": "^19.1.13",
"@types/react-dom": "^19.1.9",
+ "@types/react-router-dom": "^5.3.3",
"@vitejs/plugin-react": "^5.0.3",
"autoprefixer": "^10.4.21",
"eslint": "^9.36.0",
@@ -30,6 +33,7 @@
"tailwindcss": "^4.1.13",
"typescript": "~5.8.3",
"typescript-eslint": "^8.44.0",
- "vite": "^7.1.7"
+ "vite": "^7.1.7",
+ "vite-plugin-svgr": "^4.5.0"
}
}
diff --git a/postcss.config.cjs b/postcss.config.cjs
new file mode 100644
index 00000000..b4bee663
--- /dev/null
+++ b/postcss.config.cjs
@@ -0,0 +1,6 @@
+module.exports = {
+ plugins: {
+ '@tailwindcss/postcss': {},
+ autoprefixer: {},
+ },
+};
diff --git a/src/App.css b/src/App.css
new file mode 100644
index 00000000..e69de29b
diff --git a/src/App.tsx b/src/App.tsx
index 5d3c1d71..09dc25c8 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,8 +1,26 @@
+import Call from './pages/calls/Call';
+import Chatting from './pages/chat/Chatting';
+import Community from './pages/community/Community';
+import FriendList from './pages/friendList/FriendList';
+import Setting from './pages/settings/Setting.tsx';
+import Sidebar from './pages/sidebar/Sidebar';
+import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
+
function App() {
return (
-
-
Hello React + Tailwind + TS 🚀
-
+
+
+
+ } />
+ } />
+ } />
+ } />
+ } />
+ } />
+
+ {/* 하단 고정 */}
+
+
);
}
diff --git a/src/assets/addFriend.png b/src/assets/addFriend.png
new file mode 100644
index 0000000000000000000000000000000000000000..4e80bc080ceaaf19d22e8671a4545732f4ce532d
GIT binary patch
literal 433
zcmV;i0Z#sjP)
X1^@s6D=Y3@00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP}sM^-uX
zWCaFt8a-!dO5{mjhW$#eC2XdB0TkD>zBTr4NpEOM+{r7NGR&g&3~jTm@>R082p7)`
zLodc9DJR{K?nsZM3(}nQ9N6E>ekr!hmAw0b1U1@bhl-D%!yacrkg>sQ8PH=YA(S?ExRFlIZh9
zX3C}5=3;-1MAk|XWHiBWQs2uCHH_vAKoeVc8S$?|Yv!>ZT1M9w;9ubYUhX~iV=M10
babyfXoLpj^LoIkQ00000NkvXXu0mjf^dhbr
literal 0
HcmV?d00001
diff --git a/src/assets/call.svg b/src/assets/call.svg
new file mode 100644
index 00000000..c28d56a4
--- /dev/null
+++ b/src/assets/call.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/assets/callG.png b/src/assets/callG.png
new file mode 100644
index 0000000000000000000000000000000000000000..99191a2738185b8860b9e54a9fd05dfd46745d6a
GIT binary patch
literal 476
zcmV<20VDp2P)P000;W1^@s654Bdt00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP(|W8(1XzmpK_#bU9i
zHXsb>cDtXLsu@4e_x-W1>mEr+NiO>Re$gT7a5#J;Nu?l~rZHrf=g28LpU)4}6cQhH
zDRM@wnx~6}0)KEvW$jTE8T0x4o7#Y|0MT=7DoH9Ag4(zkwi&Z=I-TyQEy&-7qVNTD
z6DE$tkpYRaP0O-IVHjrbjf-!JSK!AqO?5CBydafdtJP{R1!38?eIEpYlL2uf>@Z9K
zn8fP~<_5!SL&`vT;x0r~?@60N6~wKJ=VnUj8s!SnZ1K20*M?j{XoklsAozJw5Ei#K
zaz4g%Qv!2)y`Cctxr+ZUaa6nP9@4d$&1R|MS1Np&xXn>)emD(`9H~Y(HPJ8e9(ATH
Sz!o?F0000
+
+
diff --git a/src/assets/chatIconG.svg b/src/assets/chatIconG.svg
new file mode 100644
index 00000000..08776ffe
--- /dev/null
+++ b/src/assets/chatIconG.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/assets/community.svg b/src/assets/community.svg
new file mode 100644
index 00000000..f21290d5
--- /dev/null
+++ b/src/assets/community.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/assets/communityG.png b/src/assets/communityG.png
new file mode 100644
index 0000000000000000000000000000000000000000..a6a03a5704a87fab4d3589cc9e566a9f4897afc1
GIT binary patch
literal 659
zcmV;E0&M+>P)P000;W1^@s654Bdt00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP^9S+qoFLpFlM{?tv*6Em@Ck-F0iGKqC&05p0*P@J?8ym+IRTy<7$Fu&eDYpm
zNMoCrL|LY!R@>E8^{T30wGf~322n0G9FND}cDvoJq9|YY`~3{dXti4Rm-t=;G8hbs
zi9}-Vb5<0sUavod`Nza*w%5qkz-JL_wp=cM>bma4h`rLJDKEWkU`kdL24!xPvQ?%9bhYop@9JK?_M=OS~ea
zH{Uv0hr~{NA|8i3aav6ml)Mj^=qI6`=Lp)B)OIWu`*jwC&j)}?Zbdehn$PEdxKD^7
tUJ~GLP|tJm{IIgE2K;XrM|{eAX1^@s6D=Y3@00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP~8tKK3
z)BGWNcfJgs0jpqT=5S2?yG)@>`O!JqksTB?
zcx0BdaI%=`zBGF>oB@r#i(<#$A)r*8lpruy1H%kg2;eaR9k}Y7WJLEnKlUDkzy-X%
zZ<0X9`coB*seTJIPbIOUlic{B*D|B}<@*q>`
+
+
+
diff --git a/src/assets/friendIconG.svg b/src/assets/friendIconG.svg
new file mode 100644
index 00000000..fcc53e2f
--- /dev/null
+++ b/src/assets/friendIconG.svg
@@ -0,0 +1,4 @@
+
diff --git a/src/assets/profileImage.png b/src/assets/profileImage.png
new file mode 100644
index 0000000000000000000000000000000000000000..1607b4f3a0c364fa1a57373303ed94b34e239ae8
GIT binary patch
literal 2063
zcmV+q2=MobP)XFK+R9{jQ&4FLqyaG~q!=8Cz4RRnBVYg?I9fuz
zP%2IXroqn|tZPUxDZ0^vLL&9~`o7}`m_UWlGyM8CRd5nC@NO7F3q;|-z^1-05DE^hqg%Cgb+8z|d
zLHG=J<`HcWBB}4U+9RsjiBCvjDS>5%5=bOB?B091{Vpqn&*RbmJoV|UhhQ>%;3-I494=~
zobQ8`alCL5r*dPMRs}N+jtaQgwF+{^xVE@&R7v~*K!NN$+Hi&T
z0dC2vX{@J6k|lF81wEFnY!Y&A%nTB0kHaSCrr<5y*}{goK*^kRK8=7Sp-%tFEh!uueSO`i*VUQ-#
zfKSH0L%WPreGF^P&)Jjsl{PmH)eAz&s1%S<7^KZwg?In@3M2V3G?HppqYtZPGoC*2
z9!aOP}NfbtdvBT5Q4Qui6u{Ur!pP|$^vY=`3Hxb!LX3&V8L;Yxy4ff|
z;^in~yjaLm7CC`yN!70mcTx-xI5T|?N2f+~y4+z$YNP>|uu&uQz$keNlbUzQ4&+e4
z(BvsST#Fnb7fwu`_ADcfcNdD-be)U|lVGpT#S_;Kouu+>X^_s`ot8)+%Ke9oa{*m;
zyFu+x8A{1ShMfZfgiGLb_B0;qxD$_bbYorUfAqB7KUHq5{4ntgUisrAthSoTTufw;
zB4bnWlrF6y3Ir~dPfVS`$LpWRhHw|goN=uUUf?Kl%c_m|dQ(3hP47phZ~?0*i3(N_
zB28u|(g+Av;WP>0vkfnzE7Xp^3+LhIj*BKWg|p5CK3)F;+9|wpVHG4wI3xs#K?DRR
zMBGAKLm_WcDHU*+MShEK&?o#wY?4LYLj4dx+zO$-vWHKHqs~67NNy
z#PQsj;Lh(jN2rR-9nlfOC#R>+;;H{XpzT%&Gog+965OBI(Rv%Q2&T`F-1KrvCS!>V
zH9382L$lS0JDRVV>EXj{t+qux7g0L{I%M1P9EE+k*ZH?y6U5!
zHK7*V8QDyoD+j)?oP+#P>S<5=S_^p2xrncz#}b`&9zbwpq8}TtMuj>
z%Q;Z~b*6ygDXI8Sf67bexmouC!f2%8s8(=s)g-;O-jqN(8N0MLdR7&wwV~kNEZ7x3
zcx)d~;}W#kKK~Gx#E17qh2tFJDMr*890oZGEae0j!gB|N7lGH?+iWpx%(}rRkzXZH3`~@H1yZfW(JhjSE;$lX7;$7{LvG
z=8Q0aHWR3AH1WL4w?OoSu^3dAN^&pMi_KsD5;Y+H`>Wls{sC;%2BW@c2UY+8002ovPDHLkV1ksS#jpSX
literal 0
HcmV?d00001
diff --git a/src/assets/setting.svg b/src/assets/setting.svg
new file mode 100644
index 00000000..9fd1e096
--- /dev/null
+++ b/src/assets/setting.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/assets/settingG.png b/src/assets/settingG.png
new file mode 100644
index 0000000000000000000000000000000000000000..95588ec4ca248bf2db14592f1d73bcc9d5bad9a8
GIT binary patch
literal 536
zcmV+z0_XjSP)9m?or>}KdS2V!ka2Rl#<2ZvRT4R9SZuhX=
zZtv(hiXsorh6dVD=WI5cXOl0-;QSHgztJ=9X_l!c%#h&7JOR3o$K%h+3LrSIbtbeq
zC-{1Ge4k1IvNC;P0i5k|r4`=?@UgT8a9ww95~8Yor_=FK{ynY$ygu248FOm@WUw#^
zyWQ^7Xf*oH-@`DJtyU|ebK)}IUl)NJ
z>$V&H1sfNedN~U!vF0fStU4yJY;i%$34G%&gq%z!{X#%d&R}(p{y$Vw*rD{nL-nhY
zKW?D21fn^$TsBmJC5WVf%Lfn6gV}8M&Pk2_2iV|9un7fXEXSfw+vtCQ3`^5paa3G!
a8GZqJt+1C5FMtgI0000e9HWdZ`g5J4-IYE?`CT3`W;gh!>JFyu|
znrLQ6tJT}5{Yh2)wOlUq>-BnL7=}BW&G_kbdfINc3(ooT<#MqrmC8!Fv*6Pt919Hl
z{ocxEvo_Q&gsZA*<#IW(+wEEay0EP#lZgpkgo)1QbGy-KIM_WL8;{3L*h@G(Vi!2;
zh^`O9TY>1X+i)HPhGa4+!vLmfnsYoJH;F_-;7l(q7-L^}K#5sIDuP3~TrP$$HPq%E
zAzKtK$Rz1-_@v9j;ZUOVuLx~myMbK4=GAaG914(7%B~WvkFNX?A=NdVPV1=kFJUT`
zqE0$QI-O1nFnJLI*aFZFoPlZMk)McxmnfA)CL7WrE&~CPbs$AtKEPoP>D+2ctyY_x
zrpYl4)W{b<3wlUGwQ#>+GzO4Xyw{F>=`yDVVmdy6^-6;*^Ry#F&SIRXIUV{rNH1~$C#vHsR0j>=euNTR4-+#`
b{(F4`Hsk|FcfDHf00000NkvXXu0mjfwtd?W
literal 0
HcmV?d00001
diff --git a/src/custom.d.ts b/src/custom.d.ts
new file mode 100644
index 00000000..385160c5
--- /dev/null
+++ b/src/custom.d.ts
@@ -0,0 +1,7 @@
+declare module '*.svg' {
+ import * as React from 'react';
+ const ReactComponent: React.FunctionComponent>;
+ export { ReactComponent };
+ const src: string;
+ export default src;
+}
diff --git a/src/index.css b/src/index.css
index b5c61c95..5d095837 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,3 +1,12 @@
+@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
+@import 'tailwindcss';
@tailwind base;
@tailwind components;
@tailwind utilities;
+
+html,
+body,
+#root {
+ height: 100%;
+ background-color: black;
+}
diff --git a/src/pages/calls/Call.tsx b/src/pages/calls/Call.tsx
new file mode 100644
index 00000000..865c69ea
--- /dev/null
+++ b/src/pages/calls/Call.tsx
@@ -0,0 +1,8 @@
+function Call() {
+ return (
+
+
Call
+
+ );
+}
+export default Call;
diff --git a/src/pages/chat/Chatting.tsx b/src/pages/chat/Chatting.tsx
new file mode 100644
index 00000000..34683ce7
--- /dev/null
+++ b/src/pages/chat/Chatting.tsx
@@ -0,0 +1,8 @@
+function Chatting() {
+ return (
+
+
Chatting
+
+ );
+}
+export default Chatting;
diff --git a/src/pages/community/Community.tsx b/src/pages/community/Community.tsx
new file mode 100644
index 00000000..636c9e18
--- /dev/null
+++ b/src/pages/community/Community.tsx
@@ -0,0 +1,8 @@
+function Community() {
+ return (
+
+
Community
+
+ );
+}
+export default Community;
diff --git a/src/pages/friendList/FriendList.tsx b/src/pages/friendList/FriendList.tsx
new file mode 100644
index 00000000..27316124
--- /dev/null
+++ b/src/pages/friendList/FriendList.tsx
@@ -0,0 +1,44 @@
+import profile from '../../assets/profileImage.png';
+import findIcon from '../../assets/find.png';
+import addFriendIcon from '../../assets/addFriend.png';
+
+function FriendList() {
+ return (
+
+ {/* 상단 헤더 */}
+
+ 친구
+
+
+
+
+
+ {/* 내 프로필 */}
+
+
+
+
내이름
+
상태메시지 있는 경우입니다.
+
+
+ {/* 친구 리스트 */}
+
+ ㄱ
+ {[1, 2, 3, 4, 5, 6, 7].map((i) => (
+ -
+
+
+
친구이름
+
상태메시지 있는 경우입니다.
+
+
+ ))}
+
+
+ );
+}
+export default FriendList;
diff --git a/src/pages/settings/Setting.tsx b/src/pages/settings/Setting.tsx
new file mode 100644
index 00000000..1d5e98f5
--- /dev/null
+++ b/src/pages/settings/Setting.tsx
@@ -0,0 +1,8 @@
+function Setting() {
+ return (
+
+
Setting
+
+ );
+}
+export default Setting;
diff --git a/src/pages/sidebar/Sidebar.tsx b/src/pages/sidebar/Sidebar.tsx
new file mode 100644
index 00000000..3e41a6cf
--- /dev/null
+++ b/src/pages/sidebar/Sidebar.tsx
@@ -0,0 +1,87 @@
+import FriendIcon from '../../assets/friend.svg';
+import FriendIconG from '../../assets/friendIconG.svg';
+import chatIcon from '../../assets/chatIcon.svg';
+import chatIconG from '../../assets/chatIconG.svg';
+import communityIconG from '../../assets/communityG.png';
+import communityIcon from '../../assets/community.svg';
+import callIconG from '../../assets/callG.png';
+import callIcon from '../../assets/call.svg';
+import settingIconG from '../../assets/settingG.png';
+import settingsIcon from '../../assets/setting.svg';
+import { Link, useLocation } from 'react-router-dom';
+
+function Sidebar() {
+ const { pathname } = useLocation();
+
+ return (
+
+ );
+}
+
+export default Sidebar;
diff --git a/tailwind.config.js b/tailwind.config.js
new file mode 100644
index 00000000..961b08b2
--- /dev/null
+++ b/tailwind.config.js
@@ -0,0 +1,15 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+ content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
+ theme: {
+ extend: {
+ colors: {
+ 'light-gray': '#D9D9D9',
+ },
+ fontFamily: {
+ pretendard: ['Pretendard', 'Noto Sans KR', 'sans-serif'],
+ },
+ },
+ },
+ plugins: [],
+};
diff --git a/vite.config.ts b/vite.config.ts
index 4ff4f8fe..aec31999 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,8 +1,8 @@
-import { defineConfig } from "vite";
-import react from "@vitejs/plugin-react";
-import tailwindcss from "@tailwindcss/vite";
+import svgr from 'vite-plugin-svgr';
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import tailwindcss from '@tailwindcss/vite';
-// https://vite.dev/config/
export default defineConfig({
- plugins: [react(), tailwindcss()],
+ plugins: [react(), tailwindcss(), svgr()],
});
From 7e5fce4224652b1fcc8ecd0e184ea60e9c9cc8a3 Mon Sep 17 00:00:00 2001
From: sungahChooo <170587664+sungahChooo@users.noreply.github.com>
Date: Sat, 27 Sep 2025 00:31:18 +0900
Subject: [PATCH 05/60] =?UTF-8?q?fix:=20sidebar=20=EB=B2=84=EA=B7=B8=20?=
=?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/pages/sidebar/Sidebar.tsx | 8 ++++++--
1 file changed, 6 insertions(+), 2 deletions(-)
diff --git a/src/pages/sidebar/Sidebar.tsx b/src/pages/sidebar/Sidebar.tsx
index 3e41a6cf..f9e49140 100644
--- a/src/pages/sidebar/Sidebar.tsx
+++ b/src/pages/sidebar/Sidebar.tsx
@@ -17,11 +17,15 @@ function Sidebar() {
diff --git a/src/assets/banner.svg b/src/assets/banner.svg
new file mode 100644
index 00000000..92ec0701
--- /dev/null
+++ b/src/assets/banner.svg
@@ -0,0 +1,9 @@
+