Merge branch 'dev'

Author: jyn

.github/workflows/deploy.yml

@@ -0,0 +1,48 @@
+name: Deploy
+
+on:
+  push:
+    branches: ['main']
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    container: pandoc/latex
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Install mustache (to update the date)
+
+        run: apk add ruby && gem install mustache
+
+      - name: creates output
+
+        run: sh ./build.sh
+
+      - name: Pushes to another repository
+
+        id: push_directory
+
+        uses: cpina/github-action-push-to-another-repository@main
+
+        env:
+          API_TOKEN_GITHUB: ${{ secrets.AUTO_ACTIONS }}
+
+        with:
+          source-directory: 'output'
+
+          destination-github-username: TopiaYu
+
+          destination-repository-name: nomadia
+
+          user-email: ${{ secrets.EMAIL }}
+
+          commit-message: ${{ github.event.commits[0].message }}
+
+          target-branch: main
+
+      - name: Test get variable exported by push-to-another-repository
+
+        run: echo $DESTINATION_CLONED_DIRECTORY

build.sh

@@ -0,0 +1,9 @@
+#!/bin/sh
+
+cd ../
+
+mkdir output
+
+cp -R ./nomadia/* ./output
+
+cp -R ./output ./nomadia/

next.config.ts

@@ -2,7 +2,14 @@ import type { NextConfig } from 'next';
 
 const nextConfig: NextConfig = {
   images: {
-    domains: ['sprint-fe-project.s3.ap-northeast-2.amazonaws.com'],
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: 'sprint-fe-project.s3.ap-northeast-2.amazonaws.com',
+        port: '',
+        pathname: '/**',
+      },
+    ],
   },
 };
 

public/images/sad-laptop.svg

@@ -5,7 +5,7 @@ import { LoginForm } from '@/features/auth/login/components/LoginForm';
 
 const Login = () => {
   return (
-    <div className="mx-6 mt-9 mb-10 flex w-full max-w-[343px] flex-col items-center md:max-w-[460px]">
+    <div className="mx-6 mt-[3.6rem] mb-10 flex w-full max-w-[34.3rem] flex-col items-center md:mt-[10rem] md:max-w-[46rem]">
       <Image
         src="/images/icons/logo-desktop.png"
         alt="Signup logo image"
@@ -16,15 +16,17 @@ const Login = () => {
 
       <LoginForm />
 
-      <p className="txt-16-medium mt-4 mb-12 text-gray-400">
-        아직 계정이 없으신가요?{' '}
-        <Link
-          href="/signup"
-          className="text-main txt-16-medium cursor-pointer underline"
-        >
-          가입하기
-        </Link>
-      </p>
+      <div className="flex w-full justify-center gap-20">
+        <p className="mt-4 mb-12 text-[1.4rem] text-gray-950 md:text-[1.6rem]">
+          아직 계정이 없으신가요?{' '}
+          <Link
+            href="/signup"
+            className="text-main cursor-pointer text-[1.4rem] underline md:text-[1.6rem]"
+          >
+            가입하기
+          </Link>
+        </p>
+      </div>
 
       <div className="my-6 flex w-full items-center">
         <hr className="border-main flex-1" />

src/app/(auth)/login/page.tsx

@@ -5,7 +5,7 @@ import { SignupForm } from '@/features/auth/signup/components/SignupForm';
 
 const Signup = () => {
   return (
-    <div className="mx-6 mt-9 mb-10 flex w-full max-w-[343px] flex-col items-center md:mt-[100px] md:max-w-[460px]">
+    <div className="mx-6 mt-[3.6rem] mb-10 flex w-full max-w-[34.3rem] flex-col items-center md:mt-[10rem] md:max-w-[46rem]">
       <Image
         src="/images/icons/logo-desktop.png"
         alt="Signup logo image"
@@ -16,9 +16,12 @@ const Signup = () => {
 
       <SignupForm />
 
-      <p className="txt-16-medium my-6 text-gray-400">
-        이미 회원이신가요?{'  '}
-        <Link href="/login" className="cursor-pointer text-gray-600 underline">
+      <p className="my-[4rem] text-[1.4rem] text-gray-950 md:text-[1.6rem]">
+        회원이신가요?{'  '}
+        <Link
+          href="/login"
+          className="text-main cursor-pointer text-[1.4rem] underline md:text-[1.6rem]"
+        >
           로그인하기
         </Link>
       </p>

src/app/(auth)/signup/page.tsx

@@ -0,0 +1,42 @@
+// // 🖥️ 클라이언트 컴포넌트에서의 에러 처리
+// 'use client';
+
+// import { isAxiosError } from 'axios';
+
+// import { useErrorQuery } from '@/features/(test)/useErrorQuery';
+
+// export default function Page() {
+//   const { data, error, isError } = useErrorQuery(); //-> 401 에러
+
+//   if (isError && error && isAxiosError(error)) {
+//     const status = error?.response?.status;
+//     throw new Error(String(status));
+//   }
+//   return <></>;
+// }
+
+// 💿 서버 컴포넌트에서의 에러 처리
+import { isAxiosError } from 'axios';
+
+import { testInstance } from '@/features/(test)/testInstance';
+
+const fetchData = async () => {
+  try {
+    const res = await testInstance.post('activities/7/reservations'); //401 에러
+    // const res = await testInstance.get('https://api.example.com/data'); // 500 & undefined 에러
+    return res.data;
+  } catch (error) {
+    if (isAxiosError(error)) {
+      const status = error.response?.status;
+      throw new Error(String(status));
+    }
+    // 비-Axios 에러의 경우 일반적인 에러로 재발생
+    throw new Error('500');
+  }
+};
+
+export default async function Page() {
+  const data = await fetchData();
+
+  return <div>{data.title}</div>;
+}

src/app/(test)/test-error/page.tsx

@@ -1,8 +1,9 @@
+//테스트 파일입니다. test-scroll
 'use client';
 
 import { useRef } from 'react';
 
-import { getApi } from '@/app/(test)/test-scroll/getApi';
+import { getTestApi } from '@/features/(test)/getTestApi';
 import { useItemInfiniteQuery } from '@/shared/libs/hooks/infiniteScroll/useInfiniteQuery';
 import { useInfiniteScroll } from '@/shared/libs/hooks/infiniteScroll/useInfiniteScroll';
 
@@ -17,7 +18,7 @@ export default function Page() {
   const { data, fetchNextPage, hasNextPage, isLoading, isError } =
     useItemInfiniteQuery({
       keyName: 'activities',
-      getFn: getApi,
+      getFn: getTestApi,
       params: {
         sort: 'most_reviewed' as const,
         size: 5,

src/app/(test)/test-scroll/getApi.ts

@@ -1,15 +1,32 @@
+'use client';
+
+import { useSearchParams } from 'next/navigation';
+
 import AllActivities from '@/features/activities/components/all-activities';
 import BannerCarousel from '@/features/activities/components/banner-carousel';
 import BestActivities from '@/features/activities/components/best-activities';
+import Search from '@/features/activities/components/search';
+import SearchResults from '@/features/activities/components/search-result';
 
 const ActivitiesPage = () => {
+  const searchParams = useSearchParams();
+  const keyword = searchParams.get('search')?.trim() || '';
+  const isSearching = keyword.trim().length > 0;
+
   return (
     <main className="bg-background flex w-full flex-col gap-10">
       <div className="mx-auto w-full max-w-[120rem]">
         <BannerCarousel />
-        {/* <Search /> */}
-        <BestActivities />
-        <AllActivities />
+        <Search />
+
+        {isSearching ? (
+          <SearchResults keyword={keyword} />
+        ) : (
+          <>
+            <BestActivities />
+            <AllActivities />
+          </>
+        )}
       </div>
     </main>
   );