Search icon CANCEL
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Building Production-Grade Web Applications with Supabase

You're reading from   Building Production-Grade Web Applications with Supabase A comprehensive guide to database design, security, real-time data, storage, multi-tenancy, and more

Arrow left icon
Product type Paperback
Published in Aug 2024
Publisher Packt
ISBN-13 9781837630684
Length 534 pages
Edition 1st Edition
Languages
Tools
Arrow right icon
Author (1):
Arrow left icon
David Lorenz David Lorenz
Author Profile Icon David Lorenz
David Lorenz
Arrow right icon
View More author details
Toc

Table of Contents (20) Chapters Close

Preface 1. Part 1:Creating the Foundations of the Ticket System App
2. Chapter 1: Unveiling the Inner Workings of Supabase and Introducing the Book’s Project FREE CHAPTER 3. Chapter 2: Setting Up Supabase with Next.js 4. Chapter 3: Creating the Ticket Management Pages, Layout, and Components 5. Part 2: Adding Multi-Tenancy and Learning RLS
6. Chapter 4: Adding Authentication and Application Protection 7. Chapter 5: Crafting Multi-Tenancy through Database and App Design 8. Chapter 6: Enforcing Tenant Permissions with RLS and Handling Tenant Domains 9. Chapter 7: Adding Tenant-Based Signups, including Google Login 10. Part 3: Managing Tickets and Interactions
11. Chapter 8: Implementing Dynamic Ticket Management 12. Chapter 9: Creating a User List with RPCs and Setting Ticket Assignees 13. Chapter 10: Enhancing Interactivity with Realtime Comments 14. Chapter 11: Adding, Securing, and Serving File Uploads with Supabase Storage 15. Part 4: Diving Deeper into Security and Advanced Features
16. Chapter 12: Avoiding Unwanted Data Manipulation and Undisclosed Exposures 17. Chapter 13: Adding Supabase Superpowers and Reviewing Production Hardening Tips 18. Index 19. Other Books You May Enjoy

Serving image attachments directly in the UI

We have already discussed how direct URL usage, such as using <img src="BUCKET_FILE_URL" />, is possible only with a public bucket. However, when using a private bucket, we still want to preview uploaded images within a comment in the UI. Additionally, even with a public bucket, where you can easily use the file link to display an image, there are times when you might want to show a lower-resolution version of the image instead of the original.

That’s why, in this section, I want to expand on the possibility of using direct URLs to serve and view optimized images within an application, even with private buckets, and show you how to use Image Transformations to get magically converted versions of images.

Using Image Transformations

Even though a public bucket allows us to view an image without restrictions, it might not be the cleverest choice to simply put the original file path into an image. This is because...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at €18.99/month. Cancel anytime