diff --git a/docker-compose.yml b/docker-compose.yml
index 3fe5001..080a229 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,5 +1,3 @@
-version: '3.8'
-
 services:
   react-app:
     build:
diff --git a/src/components/common/ListCard/index.tsx b/src/components/common/ListCard/index.tsx
index 259b6c1..bb1b5db 100644
--- a/src/components/common/ListCard/index.tsx
+++ b/src/components/common/ListCard/index.tsx
@@ -5,7 +5,7 @@ import { Props } from './ListCard.types';
 export const ListCard = forwardRef<HTMLDivElement, Props>(({ children, ...props }, ref) => {
   return (
     <div
-      className="w-full max-h-[65dvh] h-fit py-5 pl-6 pr-5 rounded-2xl bg-gray-50  overflow-y-scroll"
+      className="w-full max-h-[65dvh] h-fit py-5 pl-6 pr-5 rounded-2xl bg-gray-50 overflow-y-scroll"
       {...props}
       ref={ref}
     >
diff --git a/src/components/common/Typography/index.tsx b/src/components/common/Typography/index.tsx
index 5134f89..be21810 100644
--- a/src/components/common/Typography/index.tsx
+++ b/src/components/common/Typography/index.tsx
@@ -1,5 +1,7 @@
 import { cva, type VariantProps } from 'class-variance-authority';
 
+import { cn } from '@/lib/core';
+
 import { Props, TypographyVariant } from './Typography.types';
 
 const variantClasses = cva('whitespace-pre-wrap select-none', {
@@ -37,10 +39,8 @@ const Typography = ({
   className,
   ...props
 }: Props & TypographyVariants) => {
-  const classes = variantClasses({ type: variant, weight, className });
-
   return (
-    <p className={classes} {...props}>
+    <p className={cn(variantClasses({ type: variant, weight }), className)} {...props}>
       {children}
     </p>
   );
diff --git a/src/components/features/BookmarkDetail/BookmarkDetail.tsx b/src/components/features/BookmarkDetail/BookmarkDetail.tsx
index 303dd70..49772ee 100644
--- a/src/components/features/BookmarkDetail/BookmarkDetail.tsx
+++ b/src/components/features/BookmarkDetail/BookmarkDetail.tsx
@@ -8,6 +8,7 @@ import { Body1, Body2, Body4 } from '@/components/common/Typography';
 import { markersAtom } from '@/contexts/MarkerAtom';
 import { useMarkerList } from '@/hooks/api/marker/useMarkerList';
 import { useAuth } from '@/hooks/auth/useAuth';
+import { Category } from '@/types/naver';
 
 type Props = { bookmarkId: number; onPrev: () => void };
 export const BookmarkDetail = ({ bookmarkId, onPrev }: Props) => {
@@ -46,8 +47,12 @@ export const BookmarkDetail = ({ bookmarkId, onPrev }: Props) => {
               <div className="flex flex-col gap-1 py-2">
                 <div className="flex flex-row gap-3 items-center">
                   <Body2 className="text-primary">{item.title}</Body2>
-                  {typeof item.category === 'object' && (
-                    <Chip variant="medium">{item.category.majorCategory}</Chip>
+                  {item.category && (
+                    <Chip variant="medium">
+                      {typeof item.category === 'object'
+                        ? (item.category as Category).majorCategory
+                        : item.category}
+                    </Chip>
                   )}
                 </div>
                 <Body4 className="pt-1 " weight="normal">
diff --git a/src/components/features/BottomSheetContent/BottomSheetContent.tsx b/src/components/features/BottomSheetContent/BottomSheetContent.tsx
index 71de4a9..8d15226 100644
--- a/src/components/features/BottomSheetContent/BottomSheetContent.tsx
+++ b/src/components/features/BottomSheetContent/BottomSheetContent.tsx
@@ -1,11 +1,11 @@
 import { FlowType } from '@/constants/funnelStep';
+import { ExtractResponse } from '@/hooks/api/link/useYoutubePlace';
 import { useBottomFunnel } from '@/hooks/common/useBottomFunnel';
 
 import { BottomSheetContentProps } from './types';
 
-import { YoutubeResponse } from '../../../hooks/api/link/useYoutubePlace';
 import { Place } from '../../../types/naver';
 
 export const BottomSheetContent = ({ type, data }: BottomSheetContentProps) => {
-  return useBottomFunnel({ type: type as FlowType, data: data as Place[] | YoutubeResponse });
+  return useBottomFunnel({ type: type as FlowType, data: data as Place[] | ExtractResponse });
 };
diff --git a/src/components/features/ExtractedPlacesList/ExtractedPlacesList.tsx b/src/components/features/ExtractedPlacesList/ExtractedPlacesList.tsx
index d38267c..b875f2e 100644
--- a/src/components/features/ExtractedPlacesList/ExtractedPlacesList.tsx
+++ b/src/components/features/ExtractedPlacesList/ExtractedPlacesList.tsx
@@ -5,21 +5,25 @@ import { Chip } from '@/components/common/Chip';
 import { Icon } from '@/components/common/Icon';
 import { ListCard } from '@/components/common/ListCard';
 import { Body2, Body3, Body4 } from '@/components/common/Typography';
+import { findyIconNames } from '@/constants/findyIcons';
+import { useNaverBookmark } from '@/hooks/api/bookmarks/useNaverBookmark';
 import { useYoutubeBookmark } from '@/hooks/api/bookmarks/useYoutubeBookmark';
-import { YoutubeResponse } from '@/hooks/api/link/useYoutubePlace';
+import { ExtractResponse } from '@/hooks/api/link/useYoutubePlace';
 import { useAuth } from '@/hooks/auth/useAuth';
 import { useMarkers } from '@/hooks/common/useMarkers';
+import { Category } from '@/types/naver';
 
 import { Login } from '../LoginModal';
 
-type Props = { places: YoutubeResponse; onNext: () => void };
-export const ExtractedPlacesList = ({ places, onNext }: Props) => {
+type Props = { data: ExtractResponse; onNext: () => void };
+export const ExtractedPlacesList = ({ data, onNext }: Props) => {
   const [selectedIds, setSelectedIds] = useState<number[]>([]);
   const [isOpen, setIsOpen] = useState<boolean>(false);
 
   const { token } = useAuth();
   const { clearMarkers } = useMarkers();
-  const { mutate: bookmarkMutate } = useYoutubeBookmark(token);
+  const { mutate: youtubeMutate } = useYoutubeBookmark(token);
+  const { mutate: naverMutate } = useNaverBookmark(token);
 
   const handleToggleSelect = (id: number) => {
     setSelectedIds((prev) =>
@@ -32,53 +36,69 @@ export const ExtractedPlacesList = ({ places, onNext }: Props) => {
       setIsOpen(true);
       return;
     }
-
-    const savePlaces = {
-      ...places,
-      places: places.places
+    const savePlaces: ExtractResponse = {
+      ...data,
+      places: data.places
         .filter((place) => selectedIds.includes(place.id as number))
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         .map(({ id, ...placeData }) => placeData),
     };
 
-    bookmarkMutate(savePlaces, {
-      onSuccess: () => {
-        sessionStorage.clear();
-        clearMarkers();
-        onNext();
-      },
-    });
+    if (data.youtuberId) {
+      youtubeMutate(savePlaces, {
+        onSuccess: () => {
+          sessionStorage.clear();
+          clearMarkers();
+          onNext();
+        },
+      });
+    }
+    if (data.name) {
+      naverMutate(savePlaces, {
+        onSuccess: () => {
+          sessionStorage.clear();
+          clearMarkers();
+          onNext();
+        },
+      });
+    }
   };
   return (
     <div className="flex flex-col gap-4 p-3">
       <div className="flex flex-row gap-4 py-2">
-        {/* TODO : 이미지가 없을 경우 대체 이미지 추가 */}
-        <img
-          src={places.youtuberProfile}
-          className="w-12 h-12 rounded-full"
-          alt={`${places.youtuberName}의 프로필 이미지`}
-        />
-        <div className="flex flex-col ">
-          <Body2 weight="medium">{places.youtuberName}</Body2>
+        {data.youtuberProfile ? (
+          <img
+            src={data.youtuberProfile || ''}
+            className="w-12 h-12 rounded-full "
+            alt={`${data.youtuberName}프로필 이미지`}
+          />
+        ) : (
+          <Icon name={findyIconNames[0]} className="w-11 h-11" />
+        )}
+        <div className="flex flex-col">
+          <Body2 weight="medium">{data.youtuberName ?? data.name}</Body2>
           <div className="flex flex-row items-center gap-1">
-            <Icon name="location" size={20} />
-            <Body3 className=" text-gray-500">{places.places.length}</Body3>
+            <Icon name="location" size={17} />
+            <Body3 className="text-gray-500">{data.places.length}</Body3>
           </div>
         </div>
       </div>
       <ListCard>
         {/* TODO 컴포넌트화 */}
-        {places.places.map((item, index) => (
-          <>
+        {data?.places.map((item, index) => (
+          <div key={`${item.title}-${item.address}`}>
             <div
-              key={`${item.title}-${item.address}`}
-              className={`flex flex-row justify-between items-center ${index !== places.places.length - 1 && 'pb-2'}`}
+              className={`flex flex-row justify-between items-center ${index !== data.places.length - 1 && 'pb-2'}`}
             >
               <div className="flex flex-col gap-1 py-2">
                 <div className="flex flex-row gap-3 items-center">
                   <Body2 className="text-primary">{item.title}</Body2>
-                  {typeof item.category === 'object' && (
-                    <Chip variant="medium">{item.category.majorCategory}</Chip>
+                  {item.category && (
+                    <Chip variant="medium">
+                      {typeof item.category === 'object'
+                        ? (item.category as Category).majorCategory
+                        : item.category}
+                    </Chip>
                   )}
                 </div>
                 <Body4 className="pt-1" weight="normal">
@@ -92,8 +112,8 @@ export const ExtractedPlacesList = ({ places, onNext }: Props) => {
                 onClick={() => handleToggleSelect(item.id as number)}
               />
             </div>
-            {index < places.places.length - 1 && <hr className="border-dashed pt-2" />}
-          </>
+            {index < data.places.length - 1 && <hr className="border-dashed pt-2" />}
+          </div>
         ))}
       </ListCard>
       <Button variant="primary" size="large" onClick={handleSave}>
diff --git a/src/components/features/LinkForm/LinkInput.tsx b/src/components/features/LinkForm/LinkInput.tsx
index 5f372b7..3b81d9f 100644
--- a/src/components/features/LinkForm/LinkInput.tsx
+++ b/src/components/features/LinkForm/LinkInput.tsx
@@ -11,26 +11,26 @@ import { LinkFormProps } from './types';
 export type LinkInputProp<T> = ContextProps<T> & LinkFormProps;
 
 export const LinkInput = ({ onNext, onHomeClick, context }: LinkInputProp<string>) => {
-  const { state: youtubeLink, setState: setYoutube } = context;
-  const { state, onChange, onClickReset, isValid, onBlur, ref } = useInput(youtubeLink);
+  const { state: link, setState: setLink } = context;
+  const { state: inputValue, onChange, onClickReset, isValid, onBlur, ref } = useInput(link);
 
   const handleSaveAndNext = () => {
-    setYoutube(state);
-    onNext();
+    setLink(inputValue);
+    onNext(inputValue);
   };
 
   return (
     <div className="flex flex-col items-center justify-between">
       <Header left={<Icon name="home" size={20} onClick={onHomeClick} />} />
-      <div className="w-full flex flex-col items-start gap-6 my-32 px-6">
+      <div className="w-full flex flex-col items-start gap-6 my-36 px-6">
         <Body1>{`아래에 링크를 입력해주시면,\n특별한 장소 정보를 추출해드릴게요.`}</Body1>
         <Input
-          value={state}
+          value={inputValue}
           onChange={onChange}
           onBlur={onBlur}
           onClickReset={() => {
             onClickReset();
-            setYoutube('');
+            setLink('');
           }}
           isValid={isValid}
           ref={ref}
@@ -41,7 +41,7 @@ export const LinkInput = ({ onNext, onHomeClick, context }: LinkInputProp<string
           variant="primary"
           size="large"
           onClick={handleSaveAndNext}
-          disabled={state.length === 0 || !isValid}
+          disabled={inputValue.length === 0 || !isValid}
           className="w-full"
         >
           장소 추출하기
diff --git a/src/components/features/LinkForm/types.ts b/src/components/features/LinkForm/types.ts
index 5703314..ddd2dd9 100644
--- a/src/components/features/LinkForm/types.ts
+++ b/src/components/features/LinkForm/types.ts
@@ -2,7 +2,7 @@ export type LinkFormProps = {
   /**
    * Function to be called when moving to the next step.
    */
-  onNext: () => void;
+  onNext: (value?: string) => void;
   /**
    * Function to be called when moving to the previous step.
    */
diff --git a/src/components/features/SearchResultsList/BookmarkSelectionList.tsx b/src/components/features/SearchResultsList/BookmarkSelectionList.tsx
index 2ad73b3..db6ba73 100644
--- a/src/components/features/SearchResultsList/BookmarkSelectionList.tsx
+++ b/src/components/features/SearchResultsList/BookmarkSelectionList.tsx
@@ -42,8 +42,8 @@ export const BookmarkSelectionList = ({ selectedPlace, onNext }: Props) => {
       <Body1 className="my-3 mx-3">북마크 리스트</Body1>
       <ListCard>
         {data?.data.map((item, index) => (
-          <>
-            <div key={item.bookmarkId} className={`flex flex-row justify-between items-center `}>
+          <div key={item.bookmarkId}>
+            <div className={`flex flex-row justify-between items-center `}>
               <div className="flex flex-row gap-4 py-2.5 items-center justify-center">
                 {item.youtuberProfile ? (
                   <img
@@ -72,7 +72,7 @@ export const BookmarkSelectionList = ({ selectedPlace, onNext }: Props) => {
               )}
             </div>
             {index < data.data.length - 1 && <hr className="border-dashed pt-2" />}
-          </>
+          </div>
         ))}
       </ListCard>
       <Button variant="primary" size="large" onClick={handleSave} disabled={bookmarkId === 0}>
diff --git a/src/components/features/SearchResultsList/SearchResultsList.tsx b/src/components/features/SearchResultsList/SearchResultsList.tsx
index 9c8b17d..f65e39e 100644
--- a/src/components/features/SearchResultsList/SearchResultsList.tsx
+++ b/src/components/features/SearchResultsList/SearchResultsList.tsx
@@ -7,7 +7,7 @@ import { ListCard } from '@/components/common/ListCard';
 import { Body1, Body2, Body4 } from '@/components/common/Typography';
 import { NewMarker } from '@/hooks/api/marker/useNewMarker';
 import { useAuth } from '@/hooks/auth/useAuth';
-import { Place } from '@/types/naver';
+import { Category, Place } from '@/types/naver';
 
 import { Login } from '../LoginModal';
 
@@ -47,7 +47,13 @@ export const SearchResultsList = ({ places, onNext, onSelect }: Props) => {
             <div className="flex flex-col gap-1 py-2">
               <div className="flex flex-row gap-3 items-center">
                 <Body2 className="text-primary">{item.title}</Body2>
-                {typeof item.category === 'string' && <Chip variant="medium">{item.category}</Chip>}
+                {item.category && (
+                  <Chip variant="medium">
+                    {typeof item.category === 'object'
+                      ? (item.category as Category).majorCategory
+                      : item.category}
+                  </Chip>
+                )}
               </div>
               <Body4 className="pt-1" weight="normal">
                 {item.address}
diff --git a/src/hooks/api/bookmarks/useNaverBookmark.ts b/src/hooks/api/bookmarks/useNaverBookmark.ts
new file mode 100644
index 0000000..0891cb4
--- /dev/null
+++ b/src/hooks/api/bookmarks/useNaverBookmark.ts
@@ -0,0 +1,15 @@
+import { useMutation } from '@tanstack/react-query';
+
+import { ExtractResponse } from '@/hooks/api/link/useYoutubePlace';
+import { post } from '@/lib/axios';
+
+export const useNaverBookmark = (token: string) => {
+  return useMutation({
+    mutationFn: (naverData: ExtractResponse) =>
+      post(`api/bookmarks/naver`, naverData, {
+        headers: {
+          Authorization: `Bearer ${token}`,
+        },
+      }),
+  });
+};
diff --git a/src/hooks/api/bookmarks/useYoutubeBookmark.ts b/src/hooks/api/bookmarks/useYoutubeBookmark.ts
index 0610001..ecaa4ae 100644
--- a/src/hooks/api/bookmarks/useYoutubeBookmark.ts
+++ b/src/hooks/api/bookmarks/useYoutubeBookmark.ts
@@ -1,12 +1,11 @@
 import { useMutation } from '@tanstack/react-query';
 
+import { ExtractResponse } from '@/hooks/api/link/useYoutubePlace';
 import { post } from '@/lib/axios';
 
-import { YoutubeResponse } from '../link/useYoutubePlace';
-
 export const useYoutubeBookmark = (token: string) => {
   return useMutation({
-    mutationFn: (youtubeData: YoutubeResponse) =>
+    mutationFn: (youtubeData: ExtractResponse) =>
       post(`api/bookmarks/youtube`, youtubeData, {
         headers: {
           Authorization: `Bearer ${token}`,
diff --git a/src/hooks/api/link/useNaverMapPlace.ts b/src/hooks/api/link/useNaverMapPlace.ts
new file mode 100644
index 0000000..9522c4d
--- /dev/null
+++ b/src/hooks/api/link/useNaverMapPlace.ts
@@ -0,0 +1,19 @@
+import { useMutation } from '@tanstack/react-query';
+
+import { post } from '@/lib/external';
+
+import { ExtractResponse } from './useYoutubePlace';
+
+export type NaverMapLink = {
+  url: string;
+};
+
+export const useNaverMapPlace = () => {
+  return useMutation<ExtractResponse, Error, NaverMapLink>({
+    mutationFn: ({ url }) =>
+      post<ExtractResponse>('naver_bookmark', {
+        url,
+      }),
+    retry: 1,
+  });
+};
diff --git a/src/hooks/api/link/useYoutubePlace.ts b/src/hooks/api/link/useYoutubePlace.ts
index c8ccb1b..5c3f201 100644
--- a/src/hooks/api/link/useYoutubePlace.ts
+++ b/src/hooks/api/link/useYoutubePlace.ts
@@ -3,18 +3,19 @@ import { useQuery } from '@tanstack/react-query';
 import { get } from '@/lib/external';
 import { Place } from '@/types/naver';
 
-export type YoutubeResponse = {
-  youtuberId: string;
-  youtuberName: string;
-  youtuberProfile: string;
-  youtubeLink: string;
+export type ExtractResponse = {
+  name?: string;
+  youtuberId?: string;
+  youtuberName?: string;
+  youtuberProfile?: string;
+  youtubeLink?: string;
   places: Place[];
 };
 
 export const useYoutubePlace = (youtubeLink: string) => {
-  return useQuery<YoutubeResponse>({
+  return useQuery<ExtractResponse>({
     queryKey: ['youtubeLink', youtubeLink],
-    queryFn: () => get<YoutubeResponse>(`video/place/${encodeURIComponent(youtubeLink)}`),
+    queryFn: () => get<ExtractResponse>(`video/place/${encodeURIComponent(youtubeLink)}`),
     enabled: !!youtubeLink,
     retry: 1,
   });
diff --git a/src/hooks/common/useBottomFunnel.tsx b/src/hooks/common/useBottomFunnel.tsx
index 8d7d186..5b6a201 100644
--- a/src/hooks/common/useBottomFunnel.tsx
+++ b/src/hooks/common/useBottomFunnel.tsx
@@ -6,17 +6,16 @@ import { ExtractedPlacesList } from '@/components/features/ExtractedPlacesList/E
 import { SearchResultsList } from '@/components/features/SearchResultsList';
 import { BookmarkSelectionList } from '@/components/features/SearchResultsList/BookmarkSelectionList';
 import { FLOW_CONFIGS, FlowType, STEPS, StepType } from '@/constants/funnelStep';
+import { ExtractResponse } from '@/hooks/api/link/useYoutubePlace';
+import { useFunnel } from '@/hooks/common/useFunnel';
 import { Place } from '@/types/naver';
 
-import { useFunnel } from './useFunnel';
-
-import { YoutubeResponse } from '../api/link/useYoutubePlace';
 import { NewMarker } from '../api/marker/useNewMarker';
 import { useAuth } from '../auth/useAuth';
 
 type bottomFunnelProps = {
   type: FlowType;
-  data?: Place[] | YoutubeResponse;
+  data?: Place[] | ExtractResponse;
 };
 export const useBottomFunnel = ({ type, data }: bottomFunnelProps) => {
   const { token } = useAuth();
@@ -57,7 +56,7 @@ export const useBottomFunnel = ({ type, data }: bottomFunnelProps) => {
     ),
     [STEPS.EXTRACTED_PLACES]: (
       <ExtractedPlacesList
-        places={data as YoutubeResponse}
+        data={data as ExtractResponse}
         onNext={() => handleStepChange(STEPS.LIST)}
       />
     ),
diff --git a/src/hooks/common/useYoutubeContext.tsx b/src/hooks/common/useYoutubeContext.tsx
index ea69bb8..e129655 100644
--- a/src/hooks/common/useYoutubeContext.tsx
+++ b/src/hooks/common/useYoutubeContext.tsx
@@ -1,29 +1,28 @@
 import { useReducer } from 'react';
 
-type Action = { type: 'SET_LINK'; payload: YoutubeLink };
+type Action = { type: 'SET_LINK'; payload: string };
 
 export type ContextProps<T> = {
   context: { state: T; setState: (newState: T) => void };
 };
 
-export type YoutubeLink = {
-  youtubeLink: string;
+export type Link = {
+  link: string;
 };
 
 export const useYoutubeContext = () => {
   const [linkData, dispatch] = useReducer(reducer, initial());
-
   return [linkData, dispatch] as const;
 };
 
-const initial = (): YoutubeLink => ({
-  youtubeLink: '',
+const initial = (): Link => ({
+  link: '',
 });
 
-const reducer = (state: YoutubeLink, action: Action): YoutubeLink => {
+const reducer = (state: Link, action: Action): Link => {
   switch (action.type) {
     case 'SET_LINK':
-      return { ...state, youtubeLink: action.payload.youtubeLink };
+      return { ...state, link: action.payload };
     default:
       return state;
   }
diff --git a/src/pages/Link.tsx b/src/pages/Link.tsx
index 165749f..8cab4aa 100644
--- a/src/pages/Link.tsx
+++ b/src/pages/Link.tsx
@@ -2,25 +2,44 @@ import { useCallback } from 'react';
 import { useNavigate } from 'react-router-dom';
 
 import { ExtractionStatus, Landing, LinkInput } from '@/components/features/LinkForm';
+import { useNaverMapPlace } from '@/hooks/api/link/useNaverMapPlace';
 import { useYoutubePlace } from '@/hooks/api/link/useYoutubePlace';
 import { useFunnel } from '@/hooks/common/useFunnel';
 import { useYoutubeContext } from '@/hooks/common/useYoutubeContext';
 import { Place } from '@/types/naver';
 
 export const Link = () => {
-  const [link, dispatch] = useYoutubeContext();
   const navigate = useNavigate();
+  const [extract, dispatch] = useYoutubeContext();
   const { Funnel, Step, setStep } = useFunnel<'입력전' | '링크입력' | '추출상태'>('입력전');
 
+  const {
+    refetch: fetchYoutubePlaces,
+    data: youtubeData,
+    isLoading: isYoutubeLoading,
+  } = useYoutubePlace(extract.link);
+  const {
+    mutate: fetchNaverPlace,
+    data: naverData,
+    isPending: isNaverLoading,
+  } = useNaverMapPlace();
+
+  const isNaverLink = extract.link.includes('naver');
+  const data = isNaverLink ? naverData : youtubeData;
+  const isLoading = isNaverLink ? isNaverLoading : isYoutubeLoading;
+
   const handleHomeClick = useCallback(() => {
     navigate('/map');
   }, [navigate]);
 
-  const { refetch: fetchPlaces, data, isLoading } = useYoutubePlace(link.youtubeLink);
-
-  const handleLinkSubmit = useCallback(() => {
-    fetchPlaces();
-  }, [fetchPlaces]);
+  const handleLinkSubmit = async (link: string) => {
+    if (link.includes('naver')) {
+      return await fetchNaverPlace({ url: link });
+    }
+    if (!link.includes('naver')) {
+      await fetchYoutubePlaces();
+    }
+  };
 
   return (
     <Funnel>
@@ -30,23 +49,21 @@ export const Link = () => {
 
       <Step name="링크입력">
         <LinkInput
-          onNext={() => {
-            handleLinkSubmit();
-            setStep('추출상태');
+          context={{
+            state: extract.link,
+            setState: (link) => dispatch({ type: 'SET_LINK', payload: link }),
           }}
           onHomeClick={handleHomeClick}
-          context={{
-            state: link.youtubeLink,
-            setState: (link) => {
-              dispatch({ type: 'SET_LINK', payload: { youtubeLink: link } });
-            },
+          onNext={(link) => {
+            handleLinkSubmit(link as string);
+            setStep('추출상태');
           }}
         />
       </Step>
 
       <Step name="추출상태">
         <ExtractionStatus
-          url={link.youtubeLink}
+          url={extract.link}
           place={data?.places as Place[]}
           onPrev={() => setStep('링크입력')}
           onNext={() => navigate('/map', { state: { data } })}
diff --git a/src/pages/MapView.tsx b/src/pages/MapView.tsx
index 8e922d8..dac376a 100644
--- a/src/pages/MapView.tsx
+++ b/src/pages/MapView.tsx
@@ -6,7 +6,7 @@ import { SearchInput } from '@/components/common/SearchInput';
 import { SideMenu } from '@/components/common/SideMenu';
 import { BottomSheetContent } from '@/components/features/BottomSheetContent/BottomSheetContent';
 import { NaverMap } from '@/components/features/NaverMap';
-import { YoutubeResponse } from '@/hooks/api/link/useYoutubePlace';
+import { ExtractResponse } from '@/hooks/api/link/useYoutubePlace';
 import { useNaverSearchResult } from '@/hooks/api/search/useNaverSearchResult';
 import { useAuth } from '@/hooks/auth/useAuth';
 import { useInput } from '@/hooks/common/useInput';
@@ -21,7 +21,7 @@ export const MapView = () => {
   const navigate = useNavigate();
 
   const [isInputDisabled, setIsInputDisabled] = useState(false);
-  const { state, setState } = useMapData<Place[] | YoutubeResponse>();
+  const { state, setState } = useMapData<Place[] | ExtractResponse>();
   const { addMarker, clearMarkers } = useMarkers();
   const { state: searchValue, onChange, onClickReset } = useInput();
   const { refetch } = useNaverSearchResult(searchValue);