From 3e5b73ffd77b457849fda7fa9b265276bad3d745 Mon Sep 17 00:00:00 2001 From: Pangmin2 Date: Tue, 12 Nov 2024 10:22:50 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=EB=A9=94=EC=9D=B8=ED=99=88=20=EC=A4=91?= =?UTF-8?q?=EA=B0=84=EC=BB=A4=EB=B0=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 32 ++++----- package.json | 2 +- src/App.jsx | 6 +- src/assets/Banner.png | Bin 0 -> 23674 bytes src/pages/Main/Main_Page.css | 115 ++++++++++++++++++++++++++++++ src/pages/Main/Main_Page.jsx | 134 +++++++++++++++++++++++++++++++++++ 6 files changed, 271 insertions(+), 18 deletions(-) create mode 100644 src/assets/Banner.png create mode 100644 src/pages/Main/Main_Page.css diff --git a/package-lock.json b/package-lock.json index a87d0a0..f23eadb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,7 @@ "eslint-plugin-react-hooks": "^5.1.0-rc.0", "eslint-plugin-react-refresh": "^0.4.9", "globals": "^15.9.0", - "vite": "^5.4.1" + "vite": "^5.4.8" } }, "node_modules/@ampproject/remapping": { @@ -3284,9 +3284,9 @@ "dev": true }, "node_modules/picocolors": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz", - "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==", + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.0.tgz", + "integrity": "sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw==", "dev": true }, "node_modules/possible-typed-array-names": { @@ -3299,9 +3299,9 @@ } }, "node_modules/postcss": { - "version": "8.4.41", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.41.tgz", - "integrity": "sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==", + "version": "8.4.47", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.47.tgz", + "integrity": "sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==", "dev": true, "funding": [ { @@ -3319,8 +3319,8 @@ ], "dependencies": { "nanoid": "^3.3.7", - "picocolors": "^1.0.1", - "source-map-js": "^1.2.0" + "picocolors": "^1.1.0", + "source-map-js": "^1.2.1" }, "engines": { "node": "^10 || ^12 || >=14" @@ -3670,9 +3670,9 @@ } }, "node_modules/source-map-js": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz", - "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==", + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", + "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==", "dev": true, "engines": { "node": ">=0.10.0" @@ -3966,13 +3966,13 @@ } }, "node_modules/vite": { - "version": "5.4.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.2.tgz", - "integrity": "sha512-dDrQTRHp5C1fTFzcSaMxjk6vdpKvT+2/mIdE07Gw2ykehT49O0z/VHS3zZ8iV/Gh8BJJKHWOe5RjaNrW5xf/GA==", + "version": "5.4.8", + "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.8.tgz", + "integrity": "sha512-FqrItQ4DT1NC4zCUqMB4c4AZORMKIa0m8/URVCZ77OZ/QSNeJ54bU1vrFADbDsuwfIPcgknRkmqakQcgnL4GiQ==", "dev": true, "dependencies": { "esbuild": "^0.21.3", - "postcss": "^8.4.41", + "postcss": "^8.4.43", "rollup": "^4.20.0" }, "bin": { diff --git a/package.json b/package.json index d58987a..c55a5f9 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,6 @@ "eslint-plugin-react-hooks": "^5.1.0-rc.0", "eslint-plugin-react-refresh": "^0.4.9", "globals": "^15.9.0", - "vite": "^5.4.1" + "vite": "^5.4.8" } } diff --git a/src/App.jsx b/src/App.jsx index bcffb8e..8260463 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,7 +1,11 @@ +import React from 'react'; +import MainPage from './pages/Main/Main_Page'; import "./App.css"; function App() { - return <>; + return ( + + ); } export default App; diff --git a/src/assets/Banner.png b/src/assets/Banner.png new file mode 100644 index 0000000000000000000000000000000000000000..1bd6da89dd250601e347885ca681a883e625e73a GIT binary patch literal 23674 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 FngBF2+NuBm literal 0 HcmV?d00001 diff --git a/src/pages/Main/Main_Page.css b/src/pages/Main/Main_Page.css new file mode 100644 index 0000000..bb4cc5e --- /dev/null +++ b/src/pages/Main/Main_Page.css @@ -0,0 +1,115 @@ +.main-page { + font-family: Arial, sans-serif; + } + + .header { + position: relative; + width: 100%; + height: 800px; + overflow: hidden; + padding: 20px; + display: flex; + justify-content: space-between; + } + + .logo { + font-size: 40px; + font-weight: bold; + color: #333; + } + + .highlight { + color: #0084ff; + } + + .login-link { + font-size: 14px; + color: #1F98FF; + text-decoration: none; + margin-right: 20px; + } + + .section-title { + font-size: 24px; + margin: 20px 0; + text-align: center; + } + + .notice-section, .free-board-section { + margin: 20px; + padding: 10px; + background-color: #fff; + border-radius: 8px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); + } + + .notice-list ul, .free-board-list ul { + list-style: none; + padding: 0; + } + + .notice-list li, .free-board-list li { + display: flex; + justify-content: space-between; + padding: 10px 0; + border-bottom: 1px solid #ddd; + cursor: pointer; + } + + .date { + color: #888; + } + + .activities-section, .resources-section { + margin: 20px; + padding: 10px; + } + + .activities, .resources { + display: flex; + justify-content: space-around; + } + + .activity-box, .resource-box { + width: 200px; + height: 200px; + background-color: #f9f9f9; + border: 1px solid #ddd; + border-radius: 8px; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); + } + + .banner { + width: 100%; + height: 100%; + object-fit: cover; + } + + .header-overlay { + position: absolute; + top: 0; + right: 0; + margin: 10px; + padding: 20px; + display: flex; + justify-content: flex-end; + align-items: flex-start; + width: 100%; + } + + .menu-icon { + font-size: 24px; + color: #1F98FF; + cursor: pointer; + } + + .footer { + position: relative; + width: 100%; + height: 300px; + overflow: hidden; + padding: 20px; + display: flex; + justify-content: space-between; + } + diff --git a/src/pages/Main/Main_Page.jsx b/src/pages/Main/Main_Page.jsx index e69de29..629fb0c 100644 --- a/src/pages/Main/Main_Page.jsx +++ b/src/pages/Main/Main_Page.jsx @@ -0,0 +1,134 @@ +import { useState, useEffect } from 'react'; +import axios from 'axios'; +import './Main_Page.css'; +import Banner from '../../assets/Banner.png'; + +const mockNotices = [ + { id: 1, content: "첫 번째 공지사항 내용", date: "2024-07-31" }, + { id: 2, content: "두 번째 공지사항 내용", date: "2024-08-01" }, + { id: 3, content: "세 번째 공지사항 내용", date: "2024-08-02" }, + { id: 4, content: "네 번째 공지사항 내용", date: "2024-08-03" }, + { id: 5, content: "다섯 번째 공지사항 내용", date: "2024-08-04" }, +]; + +const mockActivities = [ + { id: 1, title: "활동 1" }, + { id: 2, title: "활동 2" }, + { id: 3, title: "활동 3" }, + { id: 4, title: "활동 4" }, +]; + +const mockResources = [ + { id: 1, title: "자료 1" }, + { id: 2, title: "자료 2" }, + { id: 3, title: "자료 3" }, + { id: 4, title: "자료 4" }, +]; + +const mockFreeBoard = [ + { id: 1, content: "첫 번째 자유 게시판 내용", date: "2024-07-31" }, + { id: 2, content: "두 번째 자유 게시판 내용", date: "2024-08-01" }, + { id: 3, content: "세 번째 자유 게시판 내용", date: "2024-08-02" }, + { id: 4, content: "네 번째 자유 게시판 내용", date: "2024-08-03" }, + { id: 5, content: "다섯 번째 자유 게시판 내용", date: "2024-08-04" }, +]; + +const api = axios.create({ + baseURL: 'http://localhost:3000', +}); + +const fetchData = (endpoint, mockData) => { + return api.get(endpoint) + .then(response => response.data) + .catch(error => { + console.error('API 요청 실패:', error); + return mockData; + }); +}; + +const MainPage = () => { + const [notices, setNotices] = useState([]); + const [activities, setActivities] = useState([]); + const [resources, setResources] = useState([]); + const [freeBoard, setFreeBoard] = useState([]); + const [loading, setLoading] = useState(true); + + useEffect(() => { + Promise.all([ + fetchData('/notices', mockNotices), + fetchData('/activities', mockActivities), + fetchData('/resources', mockResources), + fetchData('/free-board', mockFreeBoard) + ]).then(([noticesData, activitiesData, resourcesData, freeBoardData]) => { + setNotices(noticesData); + setActivities(activitiesData); + setResources(resourcesData); + setFreeBoard(freeBoardData); + setLoading(false); + }); + }, []); + + if (loading) { + return
로딩 중...
; + } + + return ( +
+
+ CHIP_SAT + +
+ +

공지사항

+
+
+
    + {notices.map((notice) => ( +
  • + {notice.content} + {notice.date} +
    • + ))} +
+
+
+ +
+

활동

+
+ {activities.map((activity) => ( +
{activity.title}
+ ))} +
+
+ +
+

자료 공유

+
+ {resources.map((resource) => ( +
{resource.title}
+ ))} +
+
+ +

자유 게시판

+
+
+
    + {freeBoard.map((post) => ( +
  • + {post.content} + {post.date} +
    • + ))} +
+
+
+
+ ); +}; + +export default MainPage; \ No newline at end of file