Hey Everyone!
I just wanted to share my ongoing experience with testing custom components. So far, only the AI component is fully functional, so I decided to try and create a picture search engine using the free API from Pixabay. Check out the result here: https://aicustom-gallery.glide.page/.
The app is simple to use: based on your input, the search engine retrieves images, and the AI component displays a dynamic grid gallery that you can fully customize. You can, for instance, align the grid with up to 11 columns, using a slider above the gallery that’s connected to the data editor.
You can also tweak the search engine’s settings, such as picture orientation, color preferences, and images per page, etc …
Key Takeaways:
- You don’t always get the same result from the same query.
- It’s better to split your requests into smaller parts.
- Learning Tailwind CSS classes is crucial, just like CSS.
- Always ensure the component stretches across the entire width of its container.
- The console is your friend! Use it to check code, especially for Tailwind classes.
- Use the word “reset” to clear all data.
- Sometimes, it’s necessary to use a private browsing window (navigation privée).
- JSON is by far the best way to bind columns to the component.
It’s been a fun journey! You can download (free) the template for both the starting point and the final version directly from the app.
Marco