我正在使用Supabase作为后端服务创建Next.js应用程序，但在此场景中Firebase或MongoDB将是相同的。我读过几篇关于Next.js API路由的文章，其中一些文章使用这些路由完成与数据库的交互，但我还是不知道I don "我不明白使用API路由与我的数据库交互或直接在我的组件上编写这些查询之间的区别，例如：
向数据库中插入一些内容。我有一个表单，在提交时会向数据库中添加一个项目：

const handleSubmit = async (e) => {
    e.preventDefault();
    ...

        const { data: itemData, error } = await supabase
            .from('items')
            .insert({
                username: user.username,
                title,
                description,
            })
            .select();
            ...

或者：

const handleSubmit = async (e) => {
    e.preventDefault();
    ...

        fetch('api/createItem', {
            method: 'POST',
            body: JSON.stringify(newItem),
            headers: {
                'Content-Type': 'application/json',
            },
        })
            .then((response) => response.json())
            .then((data) => console.log(data));

然后在API路径上，我会将项目插入到数据库中。两者都起作用，都做同样的事情，在这里使用API路径有什么好处吗？我看到过不同的文章使用两者，从来没有澄清为什么使用API路径来做这件事是有意义的。