This is where things start to get fun, you’re adding data to your database!
To do this, you’ll learn about Remix actions. A Remix action utilizes HTML elements to accept input from the user. When creating data, you’ll set the form to a method of post
. The form needs a route to post to so you will need to set the action
to the route that will handle the request. In our case it is the index route the form is in.
The Remix action itself accepts a request that you can pull the form field data you need off of it. From here you can update your database directly, because you’re on the server! In this case, you’ll create a function createPost that will utilize Prisma to create a record. Once this happens, we will redirect users back to the index page that they were on.
When I try to add a new post, I get a HTTP 405. I have looked at the source code on github too, but don't see where this is causing a 405
@Chad Elofson - I had the same problem that was solved by making sure props
were spread on the form
element in PostForm
after my method
was defined:
<form className="flex flex-col gap-4" method={method} {...props}>
Does that help?