Fix: QA 사항 반영

.gitignore

@@ -24,3 +24,4 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+.vercel

src/components/Footer/Footer.tsx

@@ -1,8 +1,8 @@
 import * as S from './Footer.styled';
-import GitHubIcon from '../../assets/Icons/Github_white.svg';
-import InstagramIcon from '../../assets/Icons/Instagram_white.svg';
-import LinktreeIcon from '../../assets/Icons/Linktree_white.svg';
-import DGUIcon from "../../assets/Icons/DguLogo_small.svg";
+import GitHubIcon from '../../assets/Github_white.png';
+import InstagramIcon from '../../assets/instagram_white.png';
+import LinktreeIcon from '../../assets/Linktree_white.png';
+import DGUIcon from "../../assets/DGU.png";
 import Logo from '@/assets/Icons/FarmLogo_green.svg';
 
 import useMediaQueries from '@/hooks/useMediaQueries';

src/pages/FAQ/Question.styled.ts

@@ -21,8 +21,6 @@ export const QParent = styled.div`
 
 export const Q = styled.b<{ $isApp: boolean; }>`
   position: relative;
-  left: 2px;
-  top: ${({ $isApp}) => ($isApp ? '-15px' : '0px')};
   font-size: ${({ $isApp}) => ($isApp ? '28px' : '28px')};
 `;
 
@@ -34,6 +32,7 @@ export const A = styled.b`
 `;
 
 export const FarmSystem = styled.b`
+  position: relative; 
   font-size: 19px;
   color: #000;
 `;

src/pages/Main/Tracks/InfoBox.styled.ts

@@ -80,18 +80,15 @@ export const PhaseTitle = styled.h3<{ $isMobile: boolean }>`
 export const PhaseContent = styled.ul<{ $isMobile: boolean }>`
   display: flex;
   width: 100%;
-  height: ${({ $isMobile }) => ($isMobile ? "150px" : "170px")};
+  height: ${({ $isMobile }) => ($isMobile ? "180px" : "200px")};
   flex-direction: column;
-  justify-content: left;
-  text-align: left;
-  font-size: ${({ $isMobile }) => ($isMobile ? "14px" : "18px")};
+  justify-content: flex-start;
+  text-align: center;
+  font-size: ${({ $isMobile }) => ($isMobile ? "13px" : "18px")};
   color: var(--FarmSystem_Black, #191919);
   font-style: normal;
   font-weight: 400;
   line-height: 30px; /* 150% */
-
-  padding-left: 20px;
-
 `;
 
 export const Li = styled.li<{ $isMobile: boolean }>`

src/pages/Main/Tracks/TracksData.ts

@@ -44,14 +44,16 @@ export const TracksData: TrackDataInterface[] = [
         "월별 트랙 정기 세미나",
       ],
       phase2: [
-        "클론코딩 프로젝트",
-        "게임 개발 공모전 준비팀",
+        "개인별 클론코딩 프로젝트",
+        "교외 게임 개발 공모전",
       ],
       phase3: [
-        "트랙 연합 프로젝트",
-        "게임 개발 공모전",
+        "기업 연계 프로젝트",
+        "교외 게임 개발 공모전 및 대회 참가",
+        "게임 회사 채용설명회",
         "월별 트랙 정기 세미나",
-      ],
+        "FARM 전시회",
+    ],
     },
   },
   {
@@ -67,25 +69,25 @@ export const TracksData: TrackDataInterface[] = [
       research:
         "동형암호, zk-SNARK, 안전한 다자간 계산 등 개인정보보호 강화 기술, 개인정보보호 기계학습",
     },
-    description:
-      "보안/웹 트랙에서는 웹 프로젝트에 보안 기술을 적용하여 안전성과 신뢰성을 강화하는 것을 목표로 합니다. 자신이 개발한 웹 애플리케이션의 보안 취약점을 진단하고, 최신 보안 동향과 국내 보안 학회 논문을 참고하여 실질적인 보안 솔루션을 프로젝트에 적용합니다. 이를 통해 보안 위협으로부터 안전한 웹 환경을 구축하고, 보다 신뢰할 수 있는 웹 서비스 개발을 경험할 수 있습니다.",
+    description: "보안/웹 트랙은 웹 프로젝트에 보안 기술을 적용하여 안전성과 신뢰성을 강화하는 것을 목표로 합니다. 자신이 개발한 웹 애플리케이션의 보안 취약점을 진단하고, 최신 보안 동향과 국내 보안 학회 논문 주제를 통해 실질적인 보안 솔루션을 프로젝트에 적용합니다. 이를 통해 보안 위협으로부터 안전한 웹 환경을 구축하고, 보다 신뢰할 수 있는 웹 서비스 개발을 경험할 수 있습니다. ",
     phases: {
       phase1: [
-        "보안 전문가 초청 강의",
-        "미니 프로젝트",
-        "자율 스터디",
+        "보안 전문가 초청 세미나 (금융결제원)",
+        "1차 프로젝트",
+        "월별 트랙 정기 세미나",
+        "기업 연계 프로그램",
       ],
       phase2: [
-        "트랙 연합 프로젝트",
-        "자율 스터디",
-        "공개 SW 개발자 대회",
+        "인공지능 트랙 연합 프로젝트",
         "기업 연계 프로젝트",
+        "자율 스터디 (보안, CS, 알고리즘, 면접 대비, 사이드 프로젝트 등)",
+        "공개 SW 개발자 대회 참가",
       ],
       phase3: [
-        "트랙 연합 프로젝트",
-        "자율 스터디",
-        "공개 SW 개발자 대회",
+        "인공지능 트랙 연합 프로젝트",
         "기업 연계 프로젝트",
+        "공개 SW 개발자 대회 세미나",
+        "FARM 전시회",
       ],
     },
   },
@@ -101,25 +103,24 @@ export const TracksData: TrackDataInterface[] = [
       major: "생물정보학, 화학정보학",
       research: "인공지능 기반 신약개발, 유전체 빅데이터 분석",
     },
-    description:
-      "인공지능 트랙에서는 단계적인 프로젝트와 협업 경험을 통해 SW 심화 역량을 기를 수 있습니다. NLP, CV, 강화학습 등 원하는 세부 분야를 선택하여 프로젝트를 진행하며, 더 나아가 기업 연계 프로젝트를 통해 실무 역량을 기를 수 있습니다.",
-    phases: {
+    description:"인공지능 트랙은 머신러닝, 딥러닝 등 AI 핵심 기술을 습득하고, 단계적인 프로젝트를 통해 실전 문제 해결 능력을 기르는 데 중점을 둡니다. NLP, 컴퓨터 비전, 강화학습 등의 세부 분야별 프로젝트를 진행하며 독자적인 AI 솔루션을 구현할 수 있습니다. 이를 통해 인공지능 프로젝트, 자율 스터디, AI 세미나 등의 실무 역량 및 협업 능력을 키울 수 있는 다양한 경험을 제공 받을 수 있습니다.",    phases: {
       phase1: [
         "1차 프로젝트",
         "인공지능 전문가 초청 세미나",
-        "자율 스터디 진행",
+        "자율 스터디(NLP, CV, 강화학습 등)",
       ],
       phase2: [
-        "1차 프로젝트 발표회",
-        "2차 프로젝트 (기업 연계, 트랙 연합)",
-        "자율 스터디 진행",
-        "외부 공모전, 대회 참여",
+        "보안/웹 트랙 연합 프로젝트",
+        "기업 연계 프로젝트",
+        "자율 스터디 (NLP, CV, 강화학습 등)",
+        "교외 인공지능 공모전 및 대회 참가",
       ],
       phase3: [
-        "2차 프로젝트 (기업 연계, 트랙 연합)",
-        "자율 스터디 진행",
-        "외부 공모전, 대회 참여",
-        "2차 프로젝트 발표회",
+        "보안/웹 트랙 연합 프로젝트",
+        "기업 연계 프로젝트",
+        "자율 스터디 (NLP, CV, 강화학습 등)",
+        "교외 인공지능 공모전 및 대회 참가",
+        "FARM 전시회",
       ],
     },
   },
@@ -135,19 +136,18 @@ export const TracksData: TrackDataInterface[] = [
       major: "디지털 트윈, 사이버-물리 시스템",
       research: "모델 검증, 시뮬레이션 기반 최적화, 병렬/분산 컴퓨팅, 머신러닝",
     },
-    description:
-      "사물인터넷/로봇 트랙은 최신 IoT 기술과 로봇 시스템 학습, 실전 프로젝트를 수행을 통해 스마트 IoT 환경을 구축하고 자동화 기술을 연구하는 트랙입니다. 라즈베리파이, 센서 네트워크 등으로 IoT 환경을 구축하고, ROS2와 SLAM을 활용해 로봇 시스템을 설계합니다. IoT와 로봇 기술을 체계적으로 익히고, 실무 프로젝트 경험을 쌓으며 성장하고자 하는 학생들을 환영합니다.",
-    phases: {
+    description:"사물인터넷/로봇 트랙은 최신 IoT 기술과 로봇 시스템 학습, 실전 프로젝트를 수행을 통해 스마트 IoT 환경을 구축하고 자동화 기술을 연구하는 트랙입니다. 사물인터넷과 로봇 파트로 나누어 구성되어 있습니다. 사물인터넷 파트에서는 라즈베리파이, 센서 네트워크, 클라우드 연동 기술을 활용하여 IoT 환경 구축 및 데이터 분석을 실습합니다. 로봇 파트에서는 ROS2, SLAM을 기반으로 로봇 시스템을 설계하고, 로봇팔 및 AGV(자율 주행 로봇) 제어 기술을 익힙니다. 뿐만 아니라 프로젝트를 통해 스마트 양식장, 스마트 홈 등과 같은 산업 분야에서 활용이 가능한 IoT 솔루션을 연구합니다.",    phases: {
       phase1: [
         "전체 이론/실습 스터디",
-        "IoT/로봇 전문가 초청 강의",
+        "IoT/로봇 전문가 초청 세미나",
       ],
       phase2: [
-        `기업 연계 및 프로젝트(설계)`,
+        `기업 연계 및 자율 팀 프로젝트`,
       ],
       phase3: [
-        `기업 연계 및 프로젝트(심화)`,
-        "팀별 자율 심화 스터디",
+        `기업 연계 및 자율 팀 프로젝트`,
+        "사물인터넷/로봇 심화 스터디",
+        "FARM 전시회",
       ],
     },
   },
@@ -163,25 +163,22 @@ export const TracksData: TrackDataInterface[] = [
       major: "의료인공지능",
       research: "의료영상, 생체 신호 처리",
     },
-    description:
-      "빅데이터 트랙은 대용량 데이터를 다루는 방법을 학습하고, 데이터 분석을 통해 인사이트를 도출하는 역량을 키우는 데 집중합니다. 머신러닝, 데이터 시각화, SQL, 그리고 Elastic Search 등 다양한 분석 기법을 실습할 수 있습니다. 또한 기업 연계 프로젝트 및 외부 공모전 참여를 통해 실전 경험을 쌓아나갈 수 있습니다. 뿐만 아니라 빅데이터 팀 프로젝트, 자율 스터디, 해커톤 등을 통해 협업 역량을 강화하고 네트워킹 기회를 제공합니다.",
-    phases: {
+    description:"빅데이터 트랙은 대용량 데이터를 다루는 방법을 학습하고, 데이터 분석을 통해 인사이트를 도출하는 역량을 키우는 데 집중합니다. 머신러닝, 데이터 시각화, SQL, 그리고 Elastic Search 등 다양한 분석 기법을 실습할 수 있습니다. 또한  프로젝트 및 외부 공모전 참여를 통해 실전 경험을 쌓아나갈 수 있습니다. 뿐만 아니라 자율 스터디, 빅데이터 해커톤 등을 통해 협업 역량을 강화하고 네트워킹 기회를 제공합니다.",    phases: {
       phase1: [
-        "Peer-멘토링",
-        "팀 빌딩 및 외부 공모전 참여",
-        "데이터분석, SW 교육",
+        "Peer-멘토링 : 머신러닝, SQL, 시각화, ELK 멘토링 및 kaggle 실습",
+        "교외 빅데이터 공모전 및 대회 참가",
+        "트랙 내부 해커톤",
       ],
       phase2: [
-        "ADsP, SQLD 자격증 취득 스터디",
-        "ELK 스택을 활용한 기업 연계 프로젝트",
-        "팀 빌딩 및 외부 공모전 참여",
-        "데이터분석, SW 교육",
+        "자격증 취득 스터디(ADsP, SQLD)",
+        "ELK 스택을 활용한 기업 연계 실전 프로젝트",
+        "교외 빅데이터 공모전 및 대회 참가",
       ],
       phase3: [
-        "Peer-멘토링",
-        "ELK 스택을 활용한 기업 연계 프로젝트",
-        "팀 빌딩 및 외부 공모전 참여",
-        "데이터분석, SW 교육",
+        "Peer-멘토링 : 머신러닝, SQL, 시각화, ELK 멘토링 및 kaggle 실습",
+        "ELK 스택을 활용한 기업 연계 실전 프로젝트",
+        "교외 빅데이터 공모전 및 대회 참가",
+        "FARM 전시회",
       ],
     },
   },

src/pages/Main/Union/ContentBox.styled.ts

@@ -70,6 +70,12 @@ export const ContentInfoTextBox = styled.div<{ $isMobile: boolean }>`
   margin-bottom:  ${(props) => (props.$isMobile ? "13px" : "35px")};
   padding-top: ${(props) => (props.$isMobile ? "20px" : "0")};
   padding-bottom: ${(props) => (props.$isMobile ? "20px" : "0")};
+
+
+`;
+
+export const Bold = styled.span`
+  font-weight: 700;
 `;
 
 export const HighlightOrange = styled.span<{ $isMobile: boolean }>`

src/pages/Main/Union/ContentBox.tsx

@@ -14,15 +14,15 @@ export default function ContentBox() {
         <S.Content $isMobile={isMobile}>
           <S.ContentInfoTextBox $isMobile={isMobile}>
           {isMobile ? (
-              <p><S.HighlightOrange $isMobile={isMobile}>Union</S.HighlightOrange>은 SW/AI 기초 역량을 다지기 위한 과정으로, 트랙 구분 없이 다섯 가지 트랙의 다양한 주제에 대한 SW 기본 역량을 다집니다. 각 트랙의 멘토가 제공하는 프로젝트와 스터디에 멘티로서 참여하게 됩니다.</p>
+              <p><S.HighlightOrange $isMobile={isMobile}>Union</S.HighlightOrange>은 <S.Bold>SW/AI 기초 역량</S.Bold>을 다지기 위한 과정으로, <S.Bold>트랙 구분 없이</S.Bold> 다섯 가지 트랙의 다양한 주제에 대한 <S.Bold>SW 기본 역량</S.Bold>을 다집니다. 각 트랙의 멘토가 제공하는 프로젝트와 스터디에 멘티로서 참여하게 됩니다.</p>
             ) : (
               <>
                 <p>
                   <S.HighlightOrange $isMobile={isMobile}>Union</S.HighlightOrange>은
                 </p>
-                <p>SW/AI 기초 역량을 다지기 위한 과정으로,</p>
-                <p>트랙 구분 없이 다섯 가지 트랙의 다양한 주제에 대한</p>
-                <p>SW 기본 역량을 다집니다.</p>
+                <p><S.Bold>SW/AI 기초 역량</S.Bold>을 다지기 위한 과정으로,</p>
+                <p><S.Bold>트랙 구분 없이</S.Bold> 다섯 가지 트랙의 다양한 주제에 대한</p>
+                <p><S.Bold>SW 기본 역량</S.Bold>을 다집니다.</p>
                 <p>각 트랙의 멘토가 제공하는 프로젝트와 스터디에</p>
                 <p>멘티로서 참여하게 됩니다.</p>
               </>

src/pages/News/News.styles.ts

@@ -8,8 +8,27 @@ export const Container = styled.div`
   text-align: center;
 `;
 
-export const Message = styled.p`
-  font-size: 1.5rem;
-  color: #333;
+export const DescriptionContainer = styled.div`
+  width: 100%;
+  margin: 20px;
+  display: block;
+`;
+
+export const Message = styled.div<{$isMobile: boolean;}>`
+  padding-top: 20vh;
+  height: 100px;
+  display: flex;
+  justify-content: center;
+  text-align: center;
+  flex-direction: column;
+  color: black;
+  font-size: ${(props) => (props.$isMobile ? "20px" : "32px")};
   font-weight: 600;
+  margin-bottom: 35px; 
+
+  a {
+    font-size: ${(props) => (props.$isMobile ? "10px" : "14px")};
+    font-weight: 300;
+    margin-top: 10px; 
+  }
 `;

src/pages/News/index.tsx

@@ -1,11 +1,18 @@
 import React from 'react';
-import { Container, Message } from './News.styles';
+import useMediaQueries from '@/hooks/useMediaQueries';
+import * as S from './News.styles';
+
 
 const News: React.FC = () => {
+  const { isMobile} = useMediaQueries();
+
   return (
-    <Container>
-      <Message>아직 등록된 소식이 없어요.</Message>
-    </Container>
+    <S.Container>
+      <S.DescriptionContainer>
+        <S.Message $isMobile={isMobile}>아직 등록된 소식이 없어요.</S.Message>
+        <a>곧 FarmSystem의 다양한 소식을 알려드릴게요!</a>
+        </S.DescriptionContainer>
+    </S.Container>
   );
 };