June 30, 2022

Using HarperDB in your Ionic App

Welcome to Community Posts
Click below to read the full article.
Summary of What to Expect
Table of Contents
  1. Create a HarperDB account and organization.
  2. Spin up a new HarperDB Cloud Instance from your dashboard.
  3. Select the instance type (locally installed, AWS, Verizon Wavelength, etc.) and create a free single-tier instance for evaluation.
  4. Create a schema (e.g., "projects") and a table (e.g., "tasks") within that schema. Define a hashing attribute for unique identification.
  5. Set up a React app using Ionic: ionic start harper-app blank --type react and navigate to the project folder: cd harper-app.
  6. Create a provider to handle queries to HarperDB, providing the instance URL and login information.
  7. Import the provider in the index.tsx file and set the props for the provider with the required URL, username, and password.
  8. Implement the useHarper hook to execute queries against the database, importing it into src/pages/Home.tsx.
  9. Use the useIonViewDidEnter hook to call a loadData function to fetch data from the database when the home page is entered.
  10. In the loadData function, use the execute function to request data using SQL queries (e.g., SELECT * FROM project.tasks).
  11. Set the fetched data to the state and render it in the app.