front1 [Next.js] Modal 구현하기 목표- 재사용성이 높은 모달을 구현한다- '모달 띄우기' 버튼을 클릭하면 화면에 모달이 뜬다- 모달 외부는 어둡게 변한다- 모달이 뜬 상태에서는 스크롤 기능을 막는다- 모달 외부를 클릭하면 모달이 사라진다- 모달에 다양한 기능을 넣는다 목차1. 기본 환경 구성2. 모달 컴포넌트 생성하기3. 화면에 모달 띄우기4. 모달에 기능 넣기5. 전체 코드 [1. 기본 환경 구성]1. 버튼 생성- 아래와 같이 모달을 띄울 버튼을 생성한다- 코드// src/app/page.tsx"use client";import React, { useState } from "react";function Home() { return ( 모달 띄우기 );}export default Ho.. 2024. 6. 25. 이전 1 다음
