Developer Applicant Challenge – Part 2

As part of the application process, you’ve been requested to complete the following challenge.

If you have any questions please respond to the last email you received from our team.


In Challenge #1 you created a “Movies” plugin with a private API endpoint. In Challenge #2 you will be creating a simple javascript based “movies” app for the front end of the site, sourcing data from the API you created and presenting it to the user.

Since this challenge is a front end interface for the plugin you developed in challenge #1, if you haven’t done that challenge, please go back and complete it now.

Objective: Create a frontend javascript “HeroThemes Movies” app that lets users save a list of movies to a list.


  • API Integration: Utilize the movies API from Challenge #1.
  • Framework: Use a modern JavaScript framework (React is recommended).
  • WordPress Integration:
    • Load the app in the context of WordPress. Meaning, only people that are logged into WordPress should be allowed to use the app.
    • The app should be presented on a WordPress page called “Movies” located at [site url]/movies/
    • You can insert the app on that page any way you like. Just let us know the set up instructions when you submit.
    • The header of the app should have a text heading “HeroThemes Movies”
    • The header of the app should have two links:
      • “Show All Movies”
      • “My List”
  • App Features:
    • Displaying movies:
      • When the app loads, it should query the API endpoint and display a grid listing of all the movies.
      • Movie listings throughout the app should be paginated to 10 movies per page.
      • Each movie should have a “heart” button that, when clicked, will add the movie to the person’s “My List” list.
    • Maintaining a “My List”:
      • Maintain in the session data a “My List”, this list should persist across the app. 
      • The “My List” should be persisted even if you refresh the whole page.
      • The app should have a “My List” page to view/manage their list.
      • The “My List” page should show a grid of the current movies in the “My List”.
        • Each item should have an action to remove the movie from the list.
  • Data/API source:
    • You must use the API endpoint you created for the movies in Challenge #1 to retrieve and show movie data in the grid.

Development Guidelines:

  • Originality: Code must be your own, without using boilerplate or tutorial templates.
  • Modern Practices: Employ current JavaScript practices and state management (e.g., React with Redux).
  • UI Library: You may use any UI libraries you like.
  • Submission: Deliver a fully functional React app that meets all requirements.
  • Quality over Speed: Focus on simplicity and clarity, as your code will reflect your skill and alignment with our core values.

Note: Complete Challenge #1 before starting this if you haven’t already.

Please enable JavaScript in your browser to complete this form.
Click or drag a file to this area to upload.
Please upload your code a ZIP file.
If the code is hosted on GitHub or a similar platform, this allows for easy access and review.
Add any additional comments about your challenge submission