diff --git a/my-app/public/index.html b/my-app/public/index.html index 95e1e00..4dbfa29 100644 --- a/my-app/public/index.html +++ b/my-app/public/index.html @@ -3,7 +3,7 @@ - + - NTNU CSIE CAMP + + + + + + + + 2024 臺師大資工營 NTNU CSIE Camp diff --git a/my-app/src/Nav.js b/my-app/src/Nav.js index 03820a6..a7e7dce 100644 --- a/my-app/src/Nav.js +++ b/my-app/src/Nav.js @@ -184,6 +184,12 @@ const Nav = () => { block: "start", inline: "nearest", }); + window.setTimeout(function () { + window.scrollTo({ + top: window.scrollY - 75, + behavior: "smooth", + }); + }, 700); } } function smoothScrollToTop(event) { diff --git a/my-app/src/image/bg_nobg.png b/my-app/src/image/bg_nobg.png new file mode 100644 index 0000000..f334fc5 Binary files /dev/null and b/my-app/src/image/bg_nobg.png differ diff --git a/my-app/src/image/bg_nobg_long.png b/my-app/src/image/bg_nobg_long.png new file mode 100644 index 0000000..ccd2504 Binary files /dev/null and b/my-app/src/image/bg_nobg_long.png differ diff --git a/my-app/src/image/google_icon/hotel.png b/my-app/src/image/google_icon/hotel.png new file mode 100644 index 0000000..e9f57af Binary files /dev/null and b/my-app/src/image/google_icon/hotel.png differ diff --git a/my-app/src/image/google_icon/hotel.svg b/my-app/src/image/google_icon/hotel.svg new file mode 100644 index 0000000..20c4694 --- /dev/null +++ b/my-app/src/image/google_icon/hotel.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/my-app/src/page/About.js b/my-app/src/page/About.js index 4d46cfd..7eeb306 100644 --- a/my-app/src/page/About.js +++ b/my-app/src/page/About.js @@ -70,7 +70,24 @@ const About = () => {

資訊安全

- 在當今數位時代，資訊安全已成為一門不可或缺的學問。營隊間將開設一門資訊安全課程，旨在培養學生對於網路安全的基本認知與實戰技能。在課程中，我們引入滲透測試的概念，透過模擬攻擊的方式，讓學生深入了解系統漏洞和弱點可能帶來的風險。隨著近期頻繁發生的網絡攻擊事件，本課程也聚焦於資訊安全技術與防禦策略，更細緻地探討了人類行為模式對安全防護的影響。並透過營期間的活動，學生將領悟安全防範不僅限於技術層面，更需洞察人性的弱點。 + 想知道什麼是資訊安全中名為滲透測試的東西嗎？ 想知道駭客如何從多個看似不起眼的 Bug + 串成一條攻擊鏈嗎？又或者是想盡辦法如何打下一台主機，在受害方加載惡意程式嗎？ + 我們會先介紹網路的概念，了解網路協定的程式漏洞，接著透過實戰的方式入侵一台受害者的電腦，在其中蘊含了資安最有名的競賽 + CTF（Capture The + Flag）各種類型的結合，包括密碼學（Cryptography）、逆向工程（Reverse）、有漏洞的服務（Pwn）等，甚至還有利用惡意蠕蟲使病毒橫向移動！ + 當然最後也會教大家如何從中防禦，有興趣的話簡報最後的部分也會講到課後延伸學習的知識點喔～ + 在這堂課你會學到： +

diff --git a/my-app/src/page/FAQ.js b/my-app/src/page/FAQ.js index a6934eb..7884dad 100644 --- a/my-app/src/page/FAQ.js +++ b/my-app/src/page/FAQ.js @@ -113,7 +113,7 @@ export const FAQ = () => {

- 以最後點選「申請報名」的時間為準，也就是 5/23 00:00 開始不要亂玩「取消報名」按鈕哦！ + 以最後點選「申請報名」的時間為準，也就是 5/1 00:00 開始不要亂玩「取消報名」按鈕哦！

diff --git a/my-app/src/page/Home.js b/my-app/src/page/Home.js index a18d071..ec348bb 100644 --- a/my-app/src/page/Home.js +++ b/my-app/src/page/Home.js @@ -1,26 +1,48 @@ -import React, { useState } from "react"; -import camp_introduction_img from "../image/draw_icon/camp_introduction.png"; -import registration_information_img from "../image/draw_icon/registration_information.png"; -import faq_img from "../image/draw_icon/faq.png"; -import traffic_information_img from "../image/draw_icon/traffic_information.png"; -import review_img from "../image/draw_icon/review.png"; +import React from "react"; +// import camp_introduction_img from "../image/draw_icon/camp_introduction.png"; +// import registration_information_img from "../image/draw_icon/registration_information.png"; +// import faq_img from "../image/draw_icon/faq.png"; +// import traffic_information_img from "../image/draw_icon/traffic_information.png"; +// import review_img from "../image/draw_icon/review.png"; import banner from "../image/banner.png"; import About from "./About"; import Info from "./Info"; import FAQ from "./FAQ"; import Traffic from "./Traffic"; import Review from "./Review"; - +const menuItems = [ + { + name: "營隊介紹", + eng_name: "about", + }, + { + name: "報名資訊", + eng_name: "info", + }, + { + name: "常見問題", + eng_name: "faq", + }, + { + name: "交通資訊", + eng_name: "traffic", + }, + { + name: "歷屆回顧", + eng_name: "review", + }, +]; const Home = () => { - - const [descriptions, setDescriptions] = useState({ - image1: { visible: true, content: }, - image2: { visible: true, content: }, - image3: { visible: true, content: }, - image4: { visible: true, content: }, - image5: { visible: true, content: }, - }); + const pages = [, , , , ]; + // const [descriptions, setDescriptions] = useState({ + // image1: { visible: true, content: }, + // image2: { visible: true, content: }, + // image3: { visible: true, content: }, + // image4: { visible: true, content: }, + // image5: { visible: true, content: }, + // }); + /* const toggleDescription = (imageId) => { setDescriptions((prevState) => ({ ...prevState, @@ -30,9 +52,9 @@ const Home = () => { }, })); }; +*/ return ( -