Nextjs2 [Next.js] App Router에서 Client Component하위에 Server Component렌더링하기 일반적으로 Client Component에서 Server Component를 직접 호출할 수 없습니다. 그림으로 나타내면 아래와 같은 구조가 될 겁니다. 코드로 나타내면 아래와 같은 형태이구요. "use client";import { useEffect } from "react";import ServerComponent from "./server-component";export default function ClientComponent() { useEffect(() => { console.log("Client Component mounted"); }, []); return ( Client Component );} 서버 컴포넌트의 코드는 아래와 같습니다. c.. 2024. 10. 27. Next.js 14 + tailwind에서 다크모드 설정하기 먼저 tailwind.config.js에서 darkMode 설정을 해줍니다. // tailwind.config.jsimport type { Config } from "tailwindcss";const config: Config = { darkMode: ["class"], content: [ "./src/pages/**/*.{js,ts,jsx,tsx,mdx}", "./src/components/**/*.{js,ts,jsx,tsx,mdx}", "./src/app/**/*.{js,ts,jsx,tsx,mdx}", ], theme: { extend: { colors: { background: "var(--background)", foreground: .. 2024. 10. 3. 이전 1 다음