Filter and Search Content in Your Web Apps Using Remix and Tigris Data

The course walks through building an artist directory with free-text and genre-based faceted search using Tigris Data and Remix. It covers collection setup, data seeding, search queries, and displaying live results in the app.

Syllabus

- Overview
- Team Meeting skit
- Tigris Data offers faceted search as a built-in
- What we're going to build
- Clone the starter repo
- Start the app locally and review the structure
- Update tsconfig.json
- Set up a Tigris Data account
- Create a new project
- Get application credentials
- Model the Tigris Data collection
- Marking fields as search fields
- Create a database setup script
- Run the setup script before dev and deployment
- Write a script to add data to the collection
- Run the seed script
- Create a function to search the artists collection
- Use the search function to query artists
- Define a Remix loader function to load artist data from Tigris
- Display live artist data in the UI
- Add free text search
- Add a search input component
- Use a query string parameter as the search query
- Add support for faceted search
- Display live genre data in the UI
- Create a utility function to get the genre from the URL path
- Update the search function to use the selected genre
- Identify the currently selected genre in the UI
- Verifying that everything works
- Additional resources and next steps