Merge branch 'main' of github.com:devyunja/kafuncha-frontend into yunja

.eslintrc

@@ -0,0 +1,17 @@
+{
+  "extends": ["react-app", "eslint:recommended"],
+  "ignorePatterns": ["node_modules"],
+  "rules": {
+    "no-use-before-define": ["error"],
+    "no-unused-vars": [
+      "error",
+      {
+        "vars": "all",
+        "varsIgnorePattern": "^_",
+        "argsIgnorePattern": "^_",
+        "args": "all",
+        "ignoreRestSiblings": false
+      }
+    ]
+  }
+}

.prettierrc

@@ -0,0 +1,8 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "arrowParens": "avoid",
+  "endOfLine": "auto",
+  "jsxSingleQuote": false,
+  "jsxBracketSameLine": true
+}

.vscode/settings.json

@@ -0,0 +1,12 @@
+{
+  "editor.formatOnSave": true,
+  "editor.tabSize": 2,
+  "files.insertFinalNewline": true,
+  "files.trimFinalNewlines": true,
+  "files.trimTrailingWhitespace": true,
+  "javascript.validate.enable": false,
+  "prettier.configPath": ".prettierrc",
+  "prettier.prettierPath": "node_modules/prettier",
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "eslint.alwaysShowStatus": true
+}

package.json

@@ -9,6 +9,7 @@
     "axios": "^0.21.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
+    "react-router-dom": "^5.2.1",
     "react-scripts": "4.0.3",
     "web-vitals": "^1.0.1"
   },
@@ -35,5 +36,9 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "eslint": "^7.32.0",
+    "prettier": "^2.3.2"
   }
 }

src/App.js

@@ -1,23 +1,18 @@
-import axios from 'axios';
-import { useEffect, useState } from 'react';
-
-function App() {
-  const [history, setHistory] = useState([]);
-
-  useEffect(() => {
-    fetchChatHistory();
-  }, []);
-
-  const fetchChatHistory = async () => {
-    const res = await axios('https://programming.coffee/history');
-    setHistory(res.data);
-  };
+import Intro from './pages/Intro';
+import Dashboard from './pages/Dashboard';
+import {BrowserRouter,Route, Switch} from 'react-router-dom';
 
+export default function App(){
   return (
-    <div>
-      {history.map((history, index) => <div key={index}>[{history.date}] {history.user}: {history.message}</div>)}
-    </div>
+      <BrowserRouter>
+        <Switch>
+          <Route exact path ="/">
+            <Intro />
+          </Route>
+          <Route path="/dashboard">
+            <Dashboard />
+          </Route>
+        </Switch>
+      </BrowserRouter>
   );
 }
-
-export default App;

src/components/cardHeader/CardHeader.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import './CardHeader.css'
+
+const CardHeader = (props) => {
+    return(
+        <div>
+            채팅 랭킹
+        </div>
+    )
+};
+
+export default CardHeader;

src/components/chatMembersIntro/ChatMembersIntro.jsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import './ChatMembersIntro.css'
+
+const ChatMembersIntro = (props) => {
+    return(
+        <div>
+            안녕하세요.<br />
+            현재 채팅에 참여중인 사람은 <br />
+            모두 30명 입니다 :)<br /><br />
+            그럼 굿바이~
+        </div>
+    )
+};
+
+export default ChatMembersIntro;

src/components/chattingCount/ChattingCount.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import './ChattingCount.css';
+
+const ChattingCount = (props) => {
+    return(
+        <div>
+            전체 채팅 횟수 : 
+        </div>
+    )
+};
+
+export default ChattingCount;

src/components/circleGraph/CircleGraph.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import './CircleGraph.css'
+
+const CircleGraph = (props) => {
+    return(
+        <div></div>
+    )
+};
+
+export default CircleGraph;

src/components/header/Header.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import './Header.css'
+
+const Header = () => {
+    return (
+        <div>
+            Kafuncha
+        </div>
+    );
+};
+
+export default Header;

src/components/members/Members.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import './Members.css'
+
+const Members = (props) => {
+    return(
+        <div>
+            김코순님
+        </div>
+    )
+};
+
+export default Members;

src/components/rankMember/RankMember.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import './RankMember.css'
+
+const RankMember = (props) => {
+    return(
+        <div>1위</div>
+    )
+};
+
+export default RankMember;