✨ feat: 공고리스트 구현

src/App.tsx

@@ -1,4 +1,4 @@
-import { Routes, Route, useLocation } from 'react-router-dom';
+import { Routes, Route, useLocation, useSearchParams } from 'react-router-dom';
 import Navbar from './components/layout/Navbar';
 import Login from './pages/account/Login';
 import Signup from './pages/account/Signup';
@@ -11,6 +11,12 @@ import ProfileForm from './pages/profile/ProfileForm';
 import NoticeList from './pages/notice/NoticeList';
 import Notice from './pages/notice/Notice';
 
+function SearchPage() {
+  const [params] = useSearchParams();
+  const query = params.get('query') || '';
+  return <NoticeList search={query} />;
+}
+
 export default function App() {
   const { pathname } = useLocation();
 
@@ -20,6 +26,7 @@ export default function App() {
       <Routes>
         {/* 공통 페이지 */}
         <Route path="/" element={<NoticeList />} />
+        <Route path="/search" element={<SearchPage />} />
         <Route path=":shopId/:noticeId" element={<Notice />} />
         <Route path="login" element={<Login />} />
         <Route path="signup" element={<Signup />} />

src/components/common/Filter.tsx

@@ -29,9 +29,14 @@ export default function Filter({
   const [address, setAddress] = useState<string[]>(
     defaultValues?.address ?? [],
   );
-  const [startsAt, setStartsAt] = useState<string>(
-    defaultValues?.startsAt ?? '',
-  );
+
+  const [startsAt, setStartsAt] = useState<string>(() => {
+    if (!defaultValues?.startsAt) return '';
+    const utcDate = new Date(defaultValues.startsAt);
+    const kstDate = new Date(utcDate.getTime() + 9 * 60 * 60 * 1000); // UTC → KST
+    return kstDate.toISOString().slice(0, 10); // YYYY-MM-DD
+  });
+
   const [hourlyPay, setHourlyPay] = useState<string>(
     defaultValues?.hourlyPay?.toString() ?? '',
   );
@@ -62,9 +67,20 @@ export default function Filter({
 
   const handleApply = () => {
     const cleanPay = hourlyPay.replace(/,/g, '');
+
+    let startsAtISO: string | null = null;
+
+    if (startsAt) {
+      const [year, month, day] = startsAt.split('-').map(Number);
+      const kstMidnight = new Date(Date.UTC(year, month - 1, day, 0, 0, 0));
+      startsAtISO = new Date(
+        kstMidnight.getTime() - 9 * 60 * 60 * 1000,
+      ).toISOString(); // KST → UTC
+    }
+
     onApply({
       address,
-      startsAt: startsAt || null,
+      startsAt: startsAtISO,
       hourlyPay: cleanPay ? Number(cleanPay) : null,
     });
     onClose();
@@ -73,7 +89,7 @@ export default function Filter({
   if (!open) return null;
 
   return (
-    <div className="fixed inset-0 z-5 flex w-full flex-col gap-24 overflow-y-auto border border-gray-20 bg-white px-12 py-24 shadow-custom md:static md:max-w-390 md:rounded-xl md:px-19">
+    <div className="fixed inset-0 z-5 scrollbar-hide flex w-full flex-col gap-24 overflow-y-auto border border-gray-20 bg-white px-12 py-24 shadow-custom md:static md:inset-auto md:w-390 md:rounded-xl md:px-19">
       <div className="flex flex-row items-center justify-between">
         <h3 className="text-h3 font-bold text-black">상세 필터</h3>
         <button

src/components/common/Post.tsx

@@ -118,7 +118,7 @@ export default function Post({ data }: { data: NoticeShopItem }) {
           <div
             className={`${isInactive ? 'text-gray-30' : 'text-gray-50'} flex flex-col gap-8 text-caption/16 font-regular md:text-body2/22`}
           >
-            <div className="flex items-center gap-6">
+            <div className="flex gap-6 md:items-center">
               <img
                 src={clockIcon}
                 alt="시계 아이콘"

src/components/layout/Navbar.tsx

@@ -1,5 +1,6 @@
 import { Link } from 'react-router-dom';
 import { useRef, useState, useEffect, useContext } from 'react';
+import { useNavigate } from 'react-router-dom';
 import { AuthContext } from '@/context/AuthContext';
 import NotificationModal from '../common/notification-modal/NotificationModal';
 import logo from '@/assets/images/logo.svg';
@@ -13,6 +14,8 @@ export default function Navbar() {
   const [isShowModal, setIsShowModal] = useState(false);
   const modalRef = useRef<HTMLDivElement>(null);
   const buttonRef = useRef<HTMLButtonElement>(null);
+  const [searchValue, setSearchValue] = useState('');
+  const navigate = useNavigate();
 
   const unreadAlarmCount = alarms.items.filter(
     (alert) => !alert.item.read,
@@ -70,6 +73,15 @@ export default function Navbar() {
           <input
             type="text"
             placeholder="가게 이름으로 찾아보세요"
+            value={searchValue}
+            onChange={(e) => setSearchValue(e.target.value)}
+            onKeyDown={(e) => {
+              if (e.key === 'Enter' && searchValue.trim()) {
+                navigate(
+                  `/search?query=${encodeURIComponent(searchValue.trim())}`,
+                );
+              }
+            }}
             className="h-36 w-full rounded-[10px] bg-gray-10 pt-10 pb-10 pl-40 placeholder:text-body2 placeholder:text-gray-40 md:h-40 md:w-344 lg:w-450"
           />
         </div>