This web application displays a random quote and a random picture.
Online Demo: random-quote-picture
Run and test this application : setup.md
This project is implemented using Golang and the Gin framework. Due to its simplicity with only a single basic page, we did not opt for frontend-backend separate to different repository. Both the page and the API are provided through the backend web service.
This is the biggest problem I've encountered in this project.
A CLI can output text, but rendering images in a CLI requires terminal support, and different terminals have varying capabilities. If you directly read the image content and output it to the terminal, it will display as byte strings, resulting in garbled output that doesn't achieve the desired effect.
I researched some tools/libs such as jp2a, which can convert images to ASCII art, but this is not the original image and not what we want to see.
Ultimately, I decided to use the system command open to open the image in the default application. Since our image address is a URL, using 'open' will invoke the default web browser to render the image.
I would like to know if you have any better implementation ideas, and if so, I would appreciate the opportunity to discuss them.
Typically, we enhance API security by incorporating signature verification. This is done to ensure the safety of the API，prevent unauthorized external calls.
An encrypted string is generated by using a set of app keys, app secrets, and a mutually agreed-upon encryption method, which is then submitted to the backend during API requests. In most commercial projects, frontend and backend are separated, and the frontend portion has its own configuration files and services for communication with the backend API. The configuration information for signature verification is usually stored in the frontend code's configuration files.
It's important to note that this project is for demonstration purposes only and api security is not a functional requirement. Due to the need for rapid development of other features, the implementation of this aspect has not been considered. For a regular project, however, It's necessary to attention to this aspect.
While reviewing its API documentation, I learned that the "key" parameter is a numeric key that influences the choice of quotation, with a maximum length of 6 characters. However, I've encountered a few issues where not following to this requirement still allows me to retrieve quotations, and even when using the same "key" parameter, I sometimes get different results with multiple requests. I'm uncertain if their service is intentionally designed this way.
In comparison, the Picsum API behaves more consistently. When passing the same "seed" parameter, it consistently returns the same image.
This program will cache 100 quotes which were got from forismatic. When forismatic service is unvailable, it will get quote from cache.
As this is just a demo project. To reduce the dependencies of this project, I stored the cached quote data directly in program memory. In a production environment, we can store the data in better storage solutions like Redis, MongoDB, or even MySQL to enhance availability.
The backend service generates image URLs according to a specified format from configuration file and returns them to the frontend. However, it cannot determine whether these URLs can be successfully accessed.
In the event that the Picsum service is unavailable, the "img" element in the frontend using this image URL will fail to display correctly. In such cases, we can listen for the "error" event on the image in the frontend and fallback to alternative images.
I have included two fallback image URLs in the configuration file for this purpose.
In production-level commercial projects, it is common to store images in object storage solutions like S3 and provide CDN addresses for image access.
Different teams have varying rules when it comes to this aspect.
For Golang projects, some team may require placing test files in the same directory as the corresponding functional files, while others may prefer consolidating them in a centralized testing directory.
In this project, I've placed the unit test files in the "tests" directory at the project's root.
- Create a small web app that displays an HTML page containing a random quote, and random picture from the two APIs below.
- Create a back-end CLI tool to do the same
- How can you return an image on cli?
- Add an option to both the CLI, and web app so a category (“key” in the API) can optionally be specified for the quote. (sane/working default if not specified)
- Add an option to both the CLI, and web app to allow specifying a grayscale image
- Make it resilient to one or both providers being unavailable
- Provide unit tests
- Provide any documentation you think might be helpful
- Feel free to add anything that you think might be useful