mmalmmizal

1. 버튼 Tab 방식React의 useState hook으로 Tab 값을 관리하면서 선택된 Tab에 따라 보여지는 내용이 달라지는 메뉴 기능을 구현하려고 한다. 버튼 Tab 방식은 직관적인 상태 기반 렌더링으로, 구현된 결과물 UI는 다음과 같다. 기본적인 useState와 onClick 속성을 사용할 줄 안다면 간단하게 구현할 수 있다. import { useState } from 'react'const [tab, setTab] = useState('mint');선택된 tab을 관리하기 위한 useState 변수를 생성하고 초기값은 'mint'로 지정한다. setTab은 tab 변수를 변경시키는 데에 사용되는 함수이다. (간단한 mint와 not mint 메뉴 탭 예시) ..

Next.js로 펀딩 사이트를 구현하는 프로젝트를 진행하고 있다.펀딩 폼을 작성하는 과정에서 type이 date인 input 태그를 추가하였고, 기본 값은 이러하다.달력 모양을 클릭해서 날짜를 선택하기 전엔 연도-월-일이라는 문구가 뜨고, 날짜를 선택하면 날짜가 들어간다.  아래 사진처럼 input 태그에 지정된 문구를 placeholder 값으로 넣는 것이 목표이다.  type이 date인 input엔 placeholder 글자가 보이지 않는 것이 기본적이기에, 초기 타입을 text로 지정하고 Focus된다면 input의 타입을 date로 바뀌도록 구현하였다.  * type 초기에 text, 클릭하면 date. 다시 다른 곳을 클릭하면 text  *className css 지정  * value 현재 작..