We're working to present users with a form to enter our Wiki pages title and

content, and then save that data to the server.

We're going to need to handle this feature in two parts.

First we're gonna need to let users retrieve an HTML form from the server

which they can fill out in their browser.

Then we're going to need to let users submit the completed

form data back to the server and save that data for them.

First let's create a link on our welcome page that our users can click to get to

the new page form.

So will edit the welcome.wrb template.

We'll add an HTML paragraph element at the bottom after the prompt to view a page,

or you can create a new page.

Then we'll convert that last bit of text to a link.

When the link is clicked,

the browser will send an HTTP GET request to retrieve the form for a new page.

We use an HTML anchor tag to set up the link.

The anchors href decides what the request path will be.

So we'll set it to a path of /new.

Now we need a Sinatra route that will match those requests.

We'll go into our app code, And

try adding the route here at the end.

We're trying to match HTTP get request.

So we'll set it up using the Sinatra get method, and we want to match a /path/new.

Like all other routes, we need to block.

Next.

And within that block, we're gonna call the ERB method to render any ERB template

and we're gonna render the new template.

That call to ERB new will look for a new .ERB file within our views directory.

So let's create that file now.

We'll just put some placeholder text in there for a moment.

Form for new pages will go here.

Save that, make sure to save our other files as well.

>> Okay, let's try this out, we'll launch the server.

>> And it's on port 4567, so that's the port we'll preview.

And it takes us straight to our root path and

let's try clicking the create a new page link.

And we can see in the address bar that our browser has sent a get requests for

the /new path.

But we don't see our form for new pages will go here placeholder text.

If we look at the page source in our browsers developer tools,

we see a level one heading with a page title of new.

We also see an empty paragraph tag.

It looks like it's rendering show.erb not new.erb.

Remember how we set up a get title route.

It had a URL parameter that would match any string that we placed after the slash.

The problem here is that Sinatra is seeing a request for the new path and

it thinks that new is a page title.

When multiple routes matched a request path,

the one that was defined first takes priority.

So the route with a title parameter

is taking priority over the route with the path of new.

And the new part of our path is being treated as a title.

To fix this, we need to move the new route before the route with the URL parameters,

so we can take priority.

Now let's restart our server and reload the /new path.

The /new route will take priority over the route with the URL parameter.

The new ERB template will be rendered and we'll see our placeholder text.

Okay, we've got a route in place and it's loading an ERB template.

Now we just need to add an HTML form to that template.

We'll do that next.