프로젝트 진행 틈틈이 프로젝트에 사용하는 여러 툴을 추가해 보고 있다.기존 프로젝트를 하면서 써봤던 것도 있는데 직접 설정할 기회가 많지는 않았기 때문이다. 코드 포맷 툴에는 대표적으로 eslint와 prettier가 있다.프론트엔드 개발을 하면 거의 모든 프로젝트에서 이 같은 툴을 사용한다. 포맷을 맞춰주지 않으면 세미콜론을 넣냐 안 넣었냐나,띄어쓰기는 몇 개나 들어가냐 하는 사소한 것으로 변경 내역이 표시된다.이러면 git에서 올릴 때 중요한 변경 내역만 표시하지 못 하게 된다. eslint의 주요 기능은 다음과 같다.  • 문법 오류: 정의되지 않은 변수, 미사용 변수, 잘못된 문법 사용 등과 같은 문제를 탐지합니다. • 베스트 프랙티스: 성능에 영향을 미치는 코드 패턴이나 잘못된 코딩 습관을 경고..

이번 편에서는 CRUD 기능 중에 RUD 부분을 만들어 간다.순서적으로는 만들기 간단한 R > D > U 순으로 만들 예정이다. 1. 글 열람 기능 만들기 /dashboard/{게시글id}로 접속하면 글 열람 화면이 나오게 하면 된다. 1) 위 URL 경로에 따라 페이지를 만든다.2) 글 열람 API를 만든다.3) 경로에 접속해 페이지가 표시될 때 글 열람 API를 호출한다.4) 호출해 받은 데이터를 페이지에 바인딩할 수 있게 HTML 부분을 만든다. 대략 이 순서대로 하나씩 만들어 가면 된다.일단 기존에 했던 대로 폴더명을 경로에 맞게 지정하고 안에 page.tsx 파일을 만든다. dashboard/[id]/page.tsx'use client';import { useState } from 'react'..

전편에서 게시판 형태의 화면을 만들어 보았다.이번 편에서는 글쓰기 기능을 추가해 새로운 글을 등록할 수 있게 해볼 것이다.일단 해야 할 작업을 간단하게 나열해 보면 다음과 같다. 1) 글쓰기 버튼 추가해 누르면 글쓰기 화면으로 이동하게끔 한다.2) 글쓰기 페이지를 만들고 제출 버튼을 누르면 글쓰기 API를 호출할 수 있게 한다.3) nextjs 기능 중 하나인 API 기능을 활용해 입력값을 받아 새로운 글을 추가할 수 있는 API를 만든다.4) 글쓰기가 성공적으로 완료되면 게시판 화면으로 리다이렉트한다.  1) 글쓰기 버튼 추가해 누르면 글쓰기 화면으로 이동하게끔 한다. 일단 addButton이라는 컴포넌트를 만들었다.한 가지 유의할 점은 코드 상단에 보면 "use client"라는 게 있는데,서버에서 ..