The basic idea here is simple; there is an output container, and an input form. When the input form is submitted, an ajax call is made to the server. The server returns an html partial, which is then appended to the output container. Easy peasy.
The specific libraries and apis used are not that important. Most of them could easily be swapped out with something else that serves the same purpose, or even without a library at all in most cases.
- Laravel for serving html pages/partials and to handle contact form submission
- Tailwind for css styling
- Stimulus for organizing front-end logic
- Axios for sending input to server via ajax and returning the response
- navigator.onLine api displaying online/offline status in the footer
- document.execCommand('copy') for copying text to your clipboard
- Minimist to parse command line input into an object
- prefers-color-scheme to override styling when user has requested the system use a light or dark color scheme
- navigator.vibrate to initiate a slight vibration when the server responds with a status code of 400 or above
For more information, hit /, type help, then hit Enter.