feat: 부드러운 스크롤 추가

apps/web/package.json

@@ -13,6 +13,7 @@
   "dependencies": {
     "@react-three/drei": "^9.79.3",
     "@react-three/fiber": "^8.13.5",
+    "@studio-freight/react-lenis": "^0.0.23",
     "@trpc/client": "^10.35.0",
     "@trpc/server": "^10.35.0",
     "axios": "^1.4.0",

apps/web/src/app/page.tsx

@@ -1,4 +1,7 @@
 'use client';
+
+import { ReactLenis } from '@studio-freight/react-lenis';
+
 import MakersLogo3D from '@/components/common/MakersLogo3D';
 import Header from '@/components/header/Header';
 import Archive from '@/components/mainpage/Archive';
@@ -10,15 +13,17 @@ import RecruitBanner from '@/components/mainpage/RecruitBanner';
 
 export default function Page() {
   return (
-    <div>
-      <Header />
-      <Greeting />
-      <MakersLogo3D />
-      <MakersIntodution />
-      <CoreValue />
-      <Product />
-      <Archive />
-      <RecruitBanner />
-    </div>
+    <ReactLenis root>
+      <div>
+        <Header />
+        <Greeting />
+        <MakersLogo3D />
+        <MakersIntodution />
+        <CoreValue />
+        <Product />
+        <Archive />
+        <RecruitBanner />
+      </div>
+    </ReactLenis>
   );
 }

yarn.lock

@@ -2770,6 +2770,49 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@studio-freight/hamo@npm:^0.6.19":
+  version: 0.6.19
+  resolution: "@studio-freight/hamo@npm:0.6.19"
+  dependencies:
+    "@studio-freight/tempus": ^0.0.38
+    rimraf: ^5.0.1
+    throttle-debounce: ^5.0.0
+  peerDependencies:
+    react: ^18.2.0
+    react-dom: ^18.2.0
+  checksum: ea9fac351805dd342e9e3eae29b3a5fa54ed0e299ab48c17ad479cdfb7c9a256ea91178d2dddce68901fb2a041cf938bcb9d8538d4bc93553c4909edf31c81d0
+  languageName: node
+  linkType: hard
+
+"@studio-freight/lenis@npm:^1.0.16":
+  version: 1.0.19
+  resolution: "@studio-freight/lenis@npm:1.0.19"
+  checksum: 552844b23ebf8af0dedf655a102bfaf453d80a7d2b702e7632c28f65cec0d673d138776a937119470442ffda50132827d806dead19d92b896d1fbedb35b0f1b9
+  languageName: node
+  linkType: hard
+
+"@studio-freight/react-lenis@npm:^0.0.23":
+  version: 0.0.23
+  resolution: "@studio-freight/react-lenis@npm:0.0.23"
+  dependencies:
+    "@studio-freight/hamo": ^0.6.19
+    "@studio-freight/lenis": ^1.0.16
+    prop-types: ^15.8.1
+    zustand: ^4.3.9
+  peerDependencies:
+    react: ^18.2.0
+    react-dom: ^18.2.0
+  checksum: 0d929c7d9072f7db4c8e611b6b6fe9888631b64b691b4156f414436495c8bb9c9795cfbd2e203292f1f96b11d9c348a850b13d1622e54187224baea27ed10ff2
+  languageName: node
+  linkType: hard
+
+"@studio-freight/tempus@npm:^0.0.38":
+  version: 0.0.38
+  resolution: "@studio-freight/tempus@npm:0.0.38"
+  checksum: 32610867d95944067878a09b78b6f86195cae5c81e8c4591736dafc2e2f9d4123f8a1ede8c2cd00d17f79413e0690955c143609f1cd0901850f7948ac9677412
+  languageName: node
+  linkType: hard
+
 "@swc/helpers@npm:0.5.1":
   version: 0.5.1
   resolution: "@swc/helpers@npm:0.5.1"
@@ -7470,6 +7513,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"glob@npm:^10.2.5":
+  version: 10.3.3
+  resolution: "glob@npm:10.3.3"
+  dependencies:
+    foreground-child: ^3.1.0
+    jackspeak: ^2.0.3
+    minimatch: ^9.0.1
+    minipass: ^5.0.0 || ^6.0.2 || ^7.0.0
+    path-scurry: ^1.10.1
+  bin:
+    glob: dist/cjs/src/bin.js
+  checksum: 29190d3291f422da0cb40b77a72fc8d2c51a36524e99b8bf412548b7676a6627489528b57250429612b6eec2e6fe7826d328451d3e694a9d15e575389308ec53
+  languageName: node
+  linkType: hard
+
 "glob@npm:^7.1.3, glob@npm:^7.1.4":
   version: 7.2.3
   resolution: "glob@npm:7.2.3"
@@ -9873,6 +9931,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"minipass@npm:^5.0.0 || ^6.0.2 || ^7.0.0":
+  version: 7.0.2
+  resolution: "minipass@npm:7.0.2"
+  checksum: 46776de732eb7cef2c7404a15fb28c41f5c54a22be50d47b03c605bf21f5c18d61a173c0a20b49a97e7a65f78d887245066410642551e45fffe04e9ac9e325bc
+  languageName: node
+  linkType: hard
+
 "minizlib@npm:^2.1.1, minizlib@npm:^2.1.2":
   version: 2.1.2
   resolution: "minizlib@npm:2.1.2"
@@ -10712,6 +10777,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"path-scurry@npm:^1.10.1":
+  version: 1.10.1
+  resolution: "path-scurry@npm:1.10.1"
+  dependencies:
+    lru-cache: ^9.1.1 || ^10.0.0
+    minipass: ^5.0.0 || ^6.0.2 || ^7.0.0
+  checksum: e2557cff3a8fb8bc07afdd6ab163a92587884f9969b05bbbaf6fe7379348bfb09af9ed292af12ed32398b15fb443e81692047b786d1eeb6d898a51eb17ed7d90
+  languageName: node
+  linkType: hard
+
 "path-to-regexp@npm:0.1.7":
   version: 0.1.7
   resolution: "path-to-regexp@npm:0.1.7"
@@ -11838,6 +11913,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rimraf@npm:^5.0.1":
+  version: 5.0.1
+  resolution: "rimraf@npm:5.0.1"
+  dependencies:
+    glob: ^10.2.5
+  bin:
+    rimraf: dist/cjs/src/bin.js
+  checksum: bafce85391349a2d960847980bf9b5caa2a8887f481af630f1ea27e08288217293cec72d75e9a2ba35495c212789f66a7f3d23366ba6197026ab71c535126857
+  languageName: node
+  linkType: hard
+
 "rollup-plugin-inject@npm:^3.0.0":
   version: 3.0.2
   resolution: "rollup-plugin-inject@npm:3.0.2"
@@ -12865,6 +12951,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"throttle-debounce@npm:^5.0.0":
+  version: 5.0.0
+  resolution: "throttle-debounce@npm:5.0.0"
+  checksum: aa8bf25828b4f8645ce863589de05d6807ea3debc147ce7d89624638ff8a16792d6d0baa0f8a32a260f0b163444d74020c6087b713ae561fde594b97b6e51f28
+  languageName: node
+  linkType: hard
+
 "through2@npm:^2.0.3":
   version: 2.0.5
   resolution: "through2@npm:2.0.5"
@@ -13566,6 +13659,15 @@ turbo@latest:
   languageName: node
   linkType: hard
 
+"use-sync-external-store@npm:1.2.0":
+  version: 1.2.0
+  resolution: "use-sync-external-store@npm:1.2.0"
+  peerDependencies:
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0
+  checksum: 5c639e0f8da3521d605f59ce5be9e094ca772bd44a4ce7322b055a6f58eeed8dda3c94cabd90c7a41fb6fa852210092008afe48f7038792fd47501f33299116a
+  languageName: node
+  linkType: hard
+
 "util-deprecate@npm:^1.0.1, util-deprecate@npm:^1.0.2, util-deprecate@npm:~1.0.1":
   version: 1.0.2
   resolution: "util-deprecate@npm:1.0.2"
@@ -13778,6 +13880,7 @@ turbo@latest:
     "@cloudflare/workers-types": ^4.20230628.0
     "@react-three/drei": ^9.79.3
     "@react-three/fiber": ^8.13.5
+    "@studio-freight/react-lenis": ^0.0.23
     "@trpc/client": ^10.35.0
     "@trpc/server": ^10.35.0
     "@types/date-fns": ^2.6.0
@@ -14161,6 +14264,23 @@ turbo@latest:
   languageName: node
   linkType: hard
 
+"zustand@npm:^4.3.9":
+  version: 4.3.9
+  resolution: "zustand@npm:4.3.9"
+  dependencies:
+    use-sync-external-store: 1.2.0
+  peerDependencies:
+    immer: ">=9.0"
+    react: ">=16.8"
+  peerDependenciesMeta:
+    immer:
+      optional: true
+    react:
+      optional: true
+  checksum: fc83d653913fa537c354ba8b95d3a4fdebe62d2ebd3d9f5aeff2edf062811c0f5af48e02ab4da32b666752fd4f3e78c2b44624e445254f48503595435d4a7d70
+  languageName: node
+  linkType: hard
+
 "zwitch@npm:^2.0.0":
   version: 2.0.4
   resolution: "zwitch@npm:2.0.4"