✅ feat: next js 마이그레이션

package.json

@@ -16,12 +16,14 @@
     "nextjs": "^0.0.3",
     "react": "^18",
     "react-dom": "^18",
-    "sass": "^1.69.4"
+    "sass": "^1.69.4",
+    "shared-utils": "^2.0.1"
   },
   "devDependencies": {
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
+    "encoding": "^0.1.13",
     "eslint": "^8",
     "eslint-config-next": "13.5.6",
     "typescript": "^5"

pages/FolderPage.tsx → pages/folder/index.tsx

@@ -1,18 +1,18 @@
-import { useGetFolders } from '@/folder/data-access-folder';
-import { useGetLinks } from '@/link/data-access-link';
-import { Layout } from '@/sharing/feature-layout';
-import { FolderLayout } from '@/page-layout/FolderLayout';
-import { FolderToolBar } from '@/folder/feature-folder-tool-bar';
-import { SearchBar } from '@/link/ui-search-bar';
+import { useGetFolders } from '@/src/folder/data-access-folder';
+import { useGetLinks } from '@/src/link/data-access-link';
+import { Layout } from '@/src/sharing/feature-layout';
+import { FolderLayout } from '@/src/page-layout/FolderLayout';
+import { FolderToolBar } from '@/src/folder/feature-folder-tool-bar';
+import { SearchBar } from '@/src/link/ui-search-bar';
 import { useState } from 'react';
-import { ALL_LINKS_ID } from '@/link/data-access-link/constant';
-import { LinkForm } from '@/link/feature-link-form';
-import { CardList } from '@/link/feature-card-list';
-import { SelectedFolderId } from '@/folder/type';
-import { useSearchLink } from '@/link/util-search-link/useSearchLink';
-import { useIntersectionObserver } from '@/sharing/util/useIntersectionObserver';
+import { ALL_LINKS_ID } from '@/src/link/data-access-link/constant';
+import { LinkForm } from '@/src/link/feature-link-form';
+import { CardList } from '@/src/link/feature-card-list';
+import { SelectedFolderId } from '@/src/folder/type';
+import { useSearchLink } from '@/src/link/util-search-link';
+import { useIntersectionObserver } from '@/src/sharing/util';
 
-export const FolderPage = () => {
+const FolderPage = () => {
   const { data: folders } = useGetFolders();
   const [selectedFolderId, setSelectedFolderId] =
     useState<SelectedFolderId>(ALL_LINKS_ID);
@@ -44,3 +44,4 @@ export const FolderPage = () => {
     </Layout>
   );
 };
+export default FolderPage;