In this tutorial, we are going to be building a simple movie generator which automatically generates a new movie every 40 seconds. It will also contain a button called “Generate New Movie” to display another movie on demand.

‍

1. Sign up for HarperDB Cloud Instance: Create an account, providing your name, email, and sub-domain name.
2. Set up HarperDB Cloud Instance: Choose instance name, credentials, specifications, and region.
3. Create React App: Use "npx create-react-app" to initialize the project.
4. Install use-harperdb Hook: Add "use-harperdb" hook for connecting to the cloud instance.
5. Set Up Environment Variables: Define credentials in the .env file.
6. Wrap App with HarperDBProvider: Connect the app to the cloud instance.
7. Populate the Database: Create a schema and table for movie data using HarperDB Studio.
8. Build the User Interface: Create a Movie component to fetch and display movie data.
9. Display Data in the Front End: Show movie information using data from HarperDB.
10. Run the App: Start the development server to see the app in action.

‍