Adding a Details Page

Learn how to allow the administrator to upload a picture of the destination and then create a details page for the tour.

Allowing an administrator to upload a picture

A picture of the destination is missing in the catalog of tours. We would like to allow administrators to upload a picture and show that picture on the detail page of the tour (which, by the way, we don’t have yet). Allowing users to upload files to the server is even more of a potential security risk than any other thing we did before. People could upload all kinds of bad files, files that look like pictures but are actually programs, pictures that show inappropriate things, or pictures that crash the browser, etc. However, since only an administrator should be able to upload pictures, we don’t have to assume the worst.

We need several ingredients that we will add one by one:

  1. The create and edit form should be prepared for uploading a file.
  2. After the form has been validated, we should take the uploaded file and move it to a place inside the document root.
  3. We should save the filename in tours.json as well.
  4. We should then show the image on the details page of a tour.

Get hands-on with 1200+ tech skills courses.