Challenges

Create a Dashboard

Implement delete post support

Oh! We forgot to add the delete post support. Let's implement that. To do this, open pages/dashboard/index.js and add the following changes.

Let's first import axios with:

import axios from 'axios'

Then add this function on the top of the React component:

const handleDelete = async (e, post) => {
  e.preventDefault()
  
  const confirmed = confirm('Do you want to delete this blog post?')
  if (!confirmed) {
    return
  }

  try {
    await axios.delete(`/api/post?slug=${encodeURIComponent(post.slug)}`)
    location.reload()
  } catch(err) {
    alert(err.message)
  }
}

(Here's the final version of the file after all these changes.)

Our app calls this function when a user clicks the "Delete" button. Then we confirm the action from the user and invoke the API to delete the post.


Try to implement this logic & delete some blog posts. Then have a look at this question:

Q: We do something unusual here. What's that?
authenticating...

šŸ™ We need your help

We need your help to keep maintain & add new content to this course. Here's how you can support us: