๐ค next/router์ push("/") ๋ฌธ์ ๋ฐ ํด๊ฒฐ ( ์์ธ๋ถ๋ช )
๋ก๊ทธ์ธ ์ฑ๊ณต ์ ๋ก๊ทธ์ธ ํ์ด์ง์์ ๋ฒ์ด๋ ๋ฉ์ธ ํ์ด์ง๋ก ๊ฐ์ ๋ก ์ด๋์ํค๋ ๋ก์ง์ ๋ง๋๋ ์ค ์๊ธด ๋ฒ๊ทธ(?)์
๋๋ค.
npm run dev
๋ก ์คํํ ๊ฒฝ์ฐ ์ ํ ๋ฌธ์ ๊ฐ ๋์ง ์์ผ๋ฉฐ, npm run build
, npm run start
๋ก ์คํํ๋ ๊ฒฝ์ฐ ๋ฐ์ํ์ต๋๋ค.
์ค์ ์ฝ๋๋ ์๋์ ์์์ ๊ฐ์ ๋ฐฉ์์ผ๋ก ๋ง๋ค์ง๋ ์์์ง๋ง ๋งฅ๋ฝ์ ๊ฑฐ์ ๊ฐ๋ค๊ณ ์๊ฐํฉ๋๋ค.
์ด์ํ๊ฒ๋ "/"
๋ฅผ ์ฌ์ฉ ์ ๋ธ๋ผ์ฐ์ ์ ํ์ฌ ํญ ์์ฒด๊ฐ ๋ฉ์ถฐ๋ฒ๋ฆฌ๊ณ ์๋ฌด ๋์๋ ์คํํ์ง ์๋ ์ํ๊ฐ ๋๋ ๋ฌธ์ ์
๋๋ค.
์๋ฌ ๋ก๊ทธ๋ ์ ํ ์์ด์ ๋ฌธ์ ์ ์์ธ์ ํ์
ํ๋ ๋ฐ ์๊ฐ์ด ๊ฑธ๋ ค์ ๊ธฐ๋กํฉ๋๋ค.
- enter.tsx ( ๋ก๊ทธ์ธ ํ์ด์ง )
- ๋ผ์ฐํ ์ฒ๋ฆฌํ๋ ํ
import { useRouter } from "next/router";
// ๋์ถฉ ํน์ ๋ก๊ทธ์ธ ํ์ด์ง ์ปดํฌ๋ํธ
const Enter = () => {
const router = useRouter();
// ๋ก๊ทธ์ธ ๊ฒฐ๊ด๊ฐ
const [response, setResponse] = useState(null);
// ๋ก๊ทธ์ธ ์์ฒญ ๋ฐ ๊ฒฐ๊ด๊ฐ ๋ฐ๊ธฐ
useEffect(() => {
fetch("/api/users/confirm")
.then(res => res.json())
.then(data => setResponse(data));
}, [setResponse])
// ๋ก๊ทธ์ธ ์ฑ๊ณต ์ ์คํ
useEffect(() => {
if(response?.ok) {
// ์๋ ์ฝ๋ ์ฌ์ฉ ์ ๋ธ๋ผ์ฐ์ ์์ฒด๊ฐ ๋ฉ์ถค
router.push("/");
// ์ ์ฝ๋ ๋์ฒด๋ก ์๋ ์ฝ๋ ์ฌ์ฉ
router.push("/#");
}
}, [response, router])
return (
<article>
// ๋ก๊ทธ์ธ ํ์ด์ง๋ฅผ ๊พธ๋ฏธ๋ jsx
</article>
)
}
Author And Source
์ด ๋ฌธ์ ์ ๊ดํ์ฌ(๐ค next/router์ push("/") ๋ฌธ์ ๋ฐ ํด๊ฒฐ ( ์์ธ๋ถ๋ช )), ์ฐ๋ฆฌ๋ ์ด๊ณณ์์ ๋ ๋ง์ ์๋ฃ๋ฅผ ๋ฐ๊ฒฌํ๊ณ ๋งํฌ๋ฅผ ํด๋ฆญํ์ฌ ๋ณด์๋ค https://velog.io/@1-blue/nextrouter-๋ฌธ์ -ํด๊ฒฐ-์์ธ๋ถ๋ช์ ์ ๊ท์: ์์์ ์ ๋ณด๊ฐ ์์์ URL์ ํฌํจ๋์ด ์์ผ๋ฉฐ ์ ์๊ถ์ ์์์ ์์ ์ ๋๋ค.
์ฐ์ํ ๊ฐ๋ฐ์ ์ฝํ ์ธ ๋ฐ๊ฒฌ์ ์ ๋ (Collection and Share based on the CC Protocol.)
์ข์ ์นํ์ด์ง ์ฆ๊ฒจ์ฐพ๊ธฐ
๊ฐ๋ฐ์ ์ฐ์ ์ฌ์ดํธ ์์ง
๊ฐ๋ฐ์๊ฐ ์์์ผ ํ ํ์ ์ฌ์ดํธ 100์ ์ถ์ฒ ์ฐ๋ฆฌ๋ ๋น์ ์ ์ํด 100๊ฐ์ ์์ฃผ ์ฌ์ฉํ๋ ๊ฐ๋ฐ์ ํ์ต ์ฌ์ดํธ๋ฅผ ์ ๋ฆฌํ์ต๋๋ค