게시글 작성 POST 요청 error?

안녕하세요 코딩애플님. React 강의에 이어서 TS, Next.js 강의까지 잘 듣고 있습니다.
현재 강의에서 진행하는 대로 JS파일을 사용하지 않고, tsx 파일을 사용하여 강의에서 배운 것을 적용하고 있습니다.
게시글 작성 (app/write/page.tsx)에서 POST 요청을 보낼 때, 다음과 같은 에러가 발생하고 있습니다. 
Error: Failed to find Server Action "null". This request might be from an older or newer deployment. Original error: Invariant: Missing '
현재, 게시글 작성에서 필요한 파일 정보를 보여드리겠습니다. 
1. app/write/page.tsx

import styles from './pages.module.css';

export default function Write() {

    return (
        <div className={styles['p-20']}>
            <h4>게시글 작성</h4>
            <form action='/api/post/new' method='POST'>
                <input className={styles['input-tag']} name="title" placeholder="작성할 글의 제목을 입력하시오."/>
                <input className={styles['input-tag']} name="content" placeholder="작성할 글의 내용을 입력하세요" />
                <button className={styles['button']} type='submit'>작성</button>
            </form>
        </div>
    )
}

2. app/pages/api/post/new.tsx

import { connectDB } from '@/src/util/database';

// /api/post/new 요청 시, DB에 글 저장
export default async function handler(req, res) {
    console.log(req);
    if (req.method == 'POST') {
        console.log(req.body);
 

        if (req.body.title == '') {
            return res.status(500).json("제목 작성해라");
        }
        try {
            const db = (await connectDB).db('forum')
            let result = await db.collection('post').insertOne(req.body);
            // console.log(result);
            return res.status(200).redirect('/list');
        } catch (error) {
            console.log(error);
        }
    }

}
현재 handler 함수가 호출되자마자 콘솔창에 req을 출력해보려고 했는데, 이것조차도 안 되고 있습니다 ㅠㅠ
어떤 부분이 문제인지 전혀 감이 안 잡히네요 허허 도와주세요 ㅠ