요 부분에서 막히셨군요!
여기서

그런데 개별 태그들에서도 값을 모두 입력한 상태에서, 엔터를 누르면
폼을 제출하려는 기본 동작이 있습니다.
요 개별 의 기본 동작은 form의 onSubmit 핸들러에 preventDefault하는 것만으로는 해결되지 않습니다.

각각의 input에서 Enter를 눌렀을 시, preventDefault를 해주어야합니다.
따라서 각각 모든 input에는 요 작업을 하기가 번거로우니

예시)

  const handleFormKeyDown = (event) => {
    // textarea 안에서는 Enter 키를 허용
    if (event.key === "Enter" && event.target.tagName !== "TEXTAREA") {
      event.preventDefault();
    }
  };
...
<form onSubmit={handleSubmit} onKeyDown={handleFormKeyDown} /> 

오 해결되었습니다!!

addItem 페이지일 때 Nav를 isActive로 변경하고 싶다고 하셨는데,
맥락상 '중고마켓'이라는 Nav를 isActive로 하고 싶으신 것 같아요!

그런데 현재 /additem 이라는 페이지(라우트)에는 isActive가 걸릴 수가 없는 상황입니다.
getLinkStyle에서 전달받는 NavLink의 props.isActive는
페이지(라우트)가 /boards 이거나 /items 일때만 활성화되기 때문입니다!

해결 방법은 여러가지가 있을 것 같습니다.
첫번째 방법)
useLocation이라는 훅을 사용해, 현재 pathname을 알아내고
getLinkStyle함수에 해당 값을 전달한다.

const getLinkStyle = (navProps, pathname) => {
  const isAddItemPage = pathname === '/additem';

  return (navProps.isActive || isAddItemPage) ? 'nav-link active' : 'nav-link';
}
 

const Nav = () => {
  const { pathname } = useLocation();
  
  return (
    ...
    <NavLink to="/items" className={(navProps) => getLinkStyle(navProps, pathname)}>
  )
}

두번째 방법)
라우트 구조 변경
현재: /additem
변경: /items/additem 혹은 /items/add-item

이렇게 변경하면 /items에서 /items/additem 라우트로 이동해도 isActive 상태가 유지될 수 있습니다.

첫번째

addItem 페이지일 때 Nav를 isActive로 변경하고 싶다고 하셨는데, 맥락상 '중고마켓'이라는 Nav를 isActive로 하고 싶으신 것 같아요!

그런데 현재 /additem 이라는 페이지(라우트)에는 isActive가 걸릴 수가 없는 상황입니다. getLinkStyle에서 전달받는 NavLink의 props.isActive는 페이지(라우트)가 /boards 이거나 /items 일때만 활성화되기 때문입니다!

해결 방법은 여러가지가 있을 것 같습니다. 첫번째 방법) useLocation이라는 훅을 사용해, 현재 pathname을 알아내고 getLinkStyle함수에 해당 값을 전달한다.

const getLinkStyle = (navProps, pathname) => {
  const isAddItemPage = pathname === '/additem';

  return (navProps.isActive || isAddItemPage) ? 'nav-link active' : 'nav-link';
}
 

const Nav = () => {
  const { pathname } = useLocation();
  
  return (
    ...
    <NavLink to="/items" className={(navProps) => getLinkStyle(navProps, pathname)}>
  )
}

두번째 방법) 라우트 구조 변경 현재: /additem 변경: /items/additem 혹은 /items/add-item

이렇게 변경하면 /items에서 /items/additem 라우트로 이동해도 isActive 상태가 유지될 수 있습니다.

첫번째 방법으로 했습니다. 왜냐면 요구사항이 /additem 주소라고 명시 되어 있어서 그렇게 했습니다. 폴더링은 별도로 수정했습니다

p2;
보통 리액트에서 이렇게 라우트 경로를 변경하고 싶을 때는 a태그가 아니라 react-router-dom에서 제공하는
useNavigate 훅을 사용합니다!
페이지를 새로고침하고, 새로 리로드하여 이동해야하는 경우 등의 특별한 경우가 아닌 이상,
리액트 프로젝트에서는 a태그로 경로를 이동하는 것을 지양해주세용!

import { useNavigate } from 'react-router-dom';

const handleClickAddItemButton = () => {
  navigate('/additem')
};

<button onClick={handleClickAddItemButton}>...</button>

p3;
요렇게 태그리스트처럼 추가, 삭제 등 리스트 인덱스의 변화가 많이 일어나는 경우에는
key를 배열 리스트의 index로 주는 걸 지양하면 좋을 것 같아요!