Beautiful Words
This website shows a visually powerful combination of beautiful pictures from all over the world and interesting quotes from famous people. Pictures are taken from Pixabay.com and quotes are randomly selected through calls to the Forismatic API.
To generate a new combination of image and quote, click on the 'Inspire me' button.
It is possbile to post a quote directly on Twitter or Facebook by clicking on the corresponding buttons.
It is also possible to download a high quality wallpaper image of the current screen by clicking on the floppy disk shaped button.
The wallpaper is built on the server by using Puppeteer to reconstruct the current page (minus the buttons) on a headless Chrome instance.
In order to optimize the use of bandwidth, background images are stored in 5 different sizes (small, medium-small, medium, medium-large, large), and are served according to the size of the screen of the user's device.
Quotes are also selected based on the screen size: shorter quotes are preferred for smaller screens (especially if in portrait mode).
Stack used:
Frontend: HTML, CSS (custom and some Bootstrap), JavaScript
Backend: Node (Express), Axios, Puppeteer