반응형 Project (프로젝트)2 [trello] 1. 환경설정하기 Next.js 14 / Typescript 소개 오늘은 Next.js 14 기반 위에서 Next.js14/ Typescript 환경설정을 해 보도록 하겠습니다. 1. Next.js 14, Typescript 세팅하기 터미널에 아래 코드를 입력합니다. npx create-next-app@latest What is your project named? my-app // (프로젝트명) Would you like to use TypeScript? No / Yes // Yes (Typescript 적용?) Would you like to use ESLint? No / Yes // Yes (Eslint 적용?) Would you like to use Tailwind CSS? No / Yes // Yes (Tailwind CSS 적용?) Would you l.. 2024. 2. 25. [기능] list-item 구조에서 유효 데이터를 가진 첫번째 아이템을 찾아 펼침 상태로 초기화하기 소개 오늘은 list-item 구조에서 유효 데이터가 있는 첫번째 아이템 펼침 기능(toggle)을 구현해 보도록 하겠습니다. 코드구현 // StatusList 파일 import { useMemo } from 'react'; import StudentItem from './StudentItem'; function StatusList(props) { const { list } = props; // validId를 가진 첫번째 학생의 인덱스 찾기 const indexOfFirstValidStudent = useMemo(() => { return list.findIndex((item) => item.validId) }, [list]); return ( {list.map((student, index) => { .. 2024. 2. 18. 이전 1 다음 반응형
