Overview of My Submission
I built another placeholder images SaaS.
First of all, I have created the application starting from the Blazor WASM with the Azure Function as API that you can find here: https://github.com/staticwebdev/blazor-starter
Then I made some test for the backend part because I wanted to know if it was possible to do with this architecture.
This is why I created a simple API endpoint in the Azure Function that add a fixed text on an image and give it back the bytes array as result.
Then I added two route parameters (width and height) to the endpoint, and I use them as key for Redis.
The application store in Redis all the image created by the application to speed up the response.
I deployed the application using a GitHub Action to an Azure Static Web App. The free tier is enough.
I have also created an Azure Redis Cache instance for caching the files.
Production Environment
You can find the application at this link: https://www.placify.xyz
Development Time
I take notes on everything during the day, and I can say that it took me a total of 2 hours to develop the solution (not in a row).
How it works
It's very simple, you can add an img tag in your HTML page and it will be replaced with a placeholder image.
<img src="https://www.placify.xyz/api/draw/1920/768>
Submission Category:
The category is: MEAN/MERN Mavericks
Language Used
Frontend Tech Stack: ASP.NET Core Blazor 6, Stone.css
Backend Tech Stack: C#, Azure Function
Cloud: Azure Static Web Apps
Redis: Azure Redis Cache Service
Link to Code
The project is open source and is hosted on GitHub
Placify - yet another image placeholder saas
Placify is a SaaS image placeholder service. It allows you to create and manage image placeholders for your SaaS products. You can use it to create placeholder images for your products, and then use them in your application. You can also use it to create placeholder images for your marketing materials.
Production Environment
You can find the application at this link: https://www.placify.xyz
How it works
It's very simple, you can add an img tag in your HTML page and it will be replaced with a placeholder image.
<img src="https://www.placify.xyz/api/draw/1920/768">
How the data is stored:
Placify saves the binary stream of the image directly in Redis. As a Key, the application creates a key formatted as width*height.
How the data is accessed:
By the key the application retrieves the binary information and send it back as the API result.
- Check out Redis OM, client libraries for working with Redis as a multi-model database.
- Use RedisInsight to visualize your data in Redis.
- Sign up for a free Redis database.
Top comments (0)