In the last video, I challenged you to only show the hint with the card

when the question was presented.

Now, I'll show you my solution.

First, I removed the hint property from where the template data variable was

declared.

Then, I added an if statement.

Setting the hint property to equal hint

when this side is holding the question string.

Hopefully that wasn't too tough.

I wanted to warm you up for the next challenge.

For this challenge, you are going to make it easy for

a user to flip the card from one side to the other.

Here's an example of what you'll build.

I'm on the question side of a card, as you can see in the query string.

Here's a link that says answer,

when I click it you see the back of the card and the URL matches.

Now there's a question link.

Clicking that, brings me back to the front of the card.

You already know enough to add these links to card template, but

it'd still be a bit of a challenge.

Take some time to think of what information you'll need to construct these

links, and how to get that information into the template.

One thing to keep in mind.

You can use JavaScript template literals in Pug templates.

So, for example, if I have a variable named animal that I want

to interpolate into a headline, these two forms output the same HTML.

In the lower line I've created a string using a template literal and

set the h1's contents to the string.

Template literals become more useful in attributes

where Pug doesn't have support for interpolation.

On the top line our variable is being concatenated with the string

to produce the title attribute.

On the bottom a template literal is used.

I find template literals to be more readable that concatenation.

But it's up to you and what you prefer.

Good luck and I'll see you in the next video.

And I'll show you how I implemented this feature.