fix: 파일 이름 충돌

src/app/appRouter.tsx

@@ -1,7 +1,7 @@
 import { createBrowserRouter } from 'react-router-dom';
 
 import { GatheringListPage } from '@/pages';
-// import WriteArchivePage from '@/pages';
+import { WriteArchivePage } from '@/pages';
 import { Layout } from '@/widgets';
 
 const AppRouter = () => {
@@ -19,7 +19,7 @@ const AppRouter = () => {
         },
         {
           path: '/archive',
-          // element: <WriteArchivePage />,
+          element: <WriteArchivePage />,
         },
         {
           path: '/gathering',

src/shared/ui/GatheringCard/GatheringCard.module.scss

@@ -0,0 +1,64 @@
+.card {
+  position: relative;
+  display: flex;
+  flex-shrink: 0;
+  flex-direction: column;
+  justify-content: center;
+  width: 21.875rem;
+  height: 18.75rem;
+  padding: 20px 25px 0;
+  font-family: inherit;
+  color: $secondary-color;
+  cursor: pointer;
+  background-color: $primary-color;
+  border-radius: 0.625rem;
+
+  &:hover {
+    background-color: $third-color;
+    transition: all 0.3s ease-in;
+    transform: scale(1.01);
+  }
+
+  &__title {
+    margin-bottom: 1.25rem;
+    overflow: hidden;
+    font-size: 1.25rem;
+    font-weight: 600;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &__name {
+    margin-bottom: 1.25rem;
+    font-size: 1rem;
+    font-weight: 500;
+  }
+
+  &__introduction {
+    display: -webkit-box; // 추가: Webkit 기반 브라우저 지원
+    display: -moz-box; // 추가: Firefox 지원
+    max-height: 2.4em; // 추가: line-height * 2
+    margin-bottom: 1.25rem;
+    overflow: hidden;
+    font-weight: 400;
+    line-height: 1.2; // 추가: 줄 높이 지정
+    text-overflow: ellipsis;
+    -webkit-line-clamp: 2; // 두 줄 말줄임
+    line-clamp: 2; // 두 줄 말줄임
+    word-break: break-word; // 긴 단어 처리
+    -webkit-box-orient: vertical;
+  }
+
+  &__tagCon {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.625rem;
+    margin-bottom: 1.25rem;
+  }
+
+  &__deadlineCon {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+  }
+}

src/shared/ui/GatheringCard/GatheringCard.tsx

@@ -0,0 +1,50 @@
+import cn from 'classnames';
+import { Link } from 'react-router-dom';
+
+import styles from './GatheringCard.module.scss';
+import { JobTag } from './JobTag';
+
+interface GatheringCardProps {
+  title: string;
+  className?: string; // 외부에서 추가 클래스 전달 가능
+  name?: string;
+  introduction?: string;
+  tag?: string[];
+  deadline?: string;
+}
+
+export const GatheringCard = ({
+  title,
+  className,
+  name,
+  introduction,
+  tag,
+  deadline,
+}: GatheringCardProps) => {
+  return (
+    <Link
+      className={cn(
+        styles.card,
+        {
+          //조건부 클래스 추가
+        },
+        className, // 외부 클래스 추가
+      )}
+      to='/gathering'
+    >
+      <li>
+        <h2 className={cn(styles.card__title)}>{title}</h2>
+        <h3 className={styles.card__name}>{name}</h3>
+        <article className={styles.card__introduction}>{introduction}</article>
+        <ul className={styles.card__tagCon}>{tag?.map((e, i) => <JobTag job={e} key={i} />)}</ul>
+        <section className={styles.card__deadlineCon}>
+          <div>마감일 {deadline}</div>
+          <div>
+            <img alt='heart icon' />
+            <img alt='contact icon' />
+          </div>
+        </section>
+      </li>
+    </Link>
+  );
+};

src/shared/ui/GatheringCard/JobTag.module.scss

@@ -0,0 +1,9 @@
+.jobTag {
+  display: flex;
+  padding: 0.3125rem 0.4375rem;
+  font-family: inherit;
+  color: $primary-color;
+  background-color: $secondary-color;
+  border: 1px solid $primary-color;
+  border-radius: 0.1875rem;
+}

src/shared/ui/GatheringCard/JobTag.tsx

@@ -0,0 +1,8 @@
+import styles from './JobTag.module.scss';
+
+interface JobTagProps {
+  job: string;
+}
+export const JobTag = ({ job }: JobTagProps) => {
+  return <div className={styles.jobTag}>{job}</div>;
+};

src/shared/ui/GatheringCard/index.ts

@@ -0,0 +1,2 @@
+export * from './GatheringCard';
+export * from './JobTag';

src/widgets/GatheringGrid/index.ts

@@ -0,0 +1 @@
+export * from './GatheringGrid';

src/widgets/index.ts

@@ -1,5 +1,3 @@
 export * from './Layout';
-
-export { GatheringGrid } from './GatheringGrid/GatheringGrid';
-
+export * from './GatheringGrid';
 export * from './WriteArchive';