> ## Content Index
> Fetch the complete content index at: https://reactpractice.dev/llms.txt
> Use this file to discover other available public pages before exploring further.

# Create a movie search page
- URL: https://reactpractice.dev/exercise/create-a-movie-search-page/
- Published: 2023-01-08T12:20:46.000Z
- Updated: 2026-06-01T01:57:19.000Z
- Author: Corina Udrescu
- Tags: Working with APIs, #corina-2, Exercises, Structuring components, Working with forms, Data fetching, Phase 1 - STARTER, #Import 2026-06-09 12:07

Create a page that allows users to **search for movies**.  
It should consist of a **search input** box and a **search button**.  
When the user clicks “Search”, the page should show the **movies as cards** and include the poster image.

You can use the free public [The Movie Database API](https://developers.themoviedb.org/3/getting-started/introduction?ref=reactpractice.dev) to search for the movie details.

Use Typescript to build your solution. I suggest using [Tailwind CSS](https://tailwindcss.com/docs/styling-with-utility-classes?ref=reactpractice.dev) for styling and [Vite](https://reactpractice.dev/articles/how-setup-a-react-project-with-vite-typescript-and-tailwind/) for scaffolding the project.

Useful links for “The Movie Database” API:  
\- [https://developers.themoviedb.org/3/getting-started/introduction](https://developers.themoviedb.org/3/getting-started/introduction?ref=reactpractice.dev)  
\- [https://developers.themoviedb.org/3/search/search-movies](https://developers.themoviedb.org/3/search/search-movies?ref=reactpractice.dev)

💡 Ready to check your work?  
Become a member and get access to the ****official solution** and the comments section for ****feedback and discussion**.  
  
Also, for a limited time, you will also get a ****code review** when you share a link to your completed challenge in the comments section!

[Learn more about the membership ](https://reactpractice.dev/become-a-member/)