Here is my experience of creating a web app which sends document to Kindle. It was something which I wanted to build for a long time.
The app which I built for that is in Croatian, since the document is in Croatian too. It is deployed on this site:
https://kindle-liturgija-dana.vercel.app/
Motivation
I am a Catholic and I try to read daily scripture everyday. I prefer reading it on Kindle. In order to do that, I would use my mobile phone to go to the website with daily readings, copy it into a Word document which I would then send to Kindle. Then I would read it on Kindle. It is boring job and after I read it, I also have to delete the document which takes few clicks on Kindle. It would be a pleasure if I would get this document automatically delivered into my Kindle once a month with all readings for each day of that month.
Technologies used
This was an opportunity for me to explore some new libraries and technologies:
- Vercel (cloud platform)
- NextJS (React framework)
- Adobe Spectrum (UI library)
What I learned from it
Website aggregate
- I was using library jsdom to extract interesting data from the website after I fetched its content. I fetched several routes, one for each day. And then I would combine it all into one HTML document.
Sending document to Kindle
- each Kindle device has its own email address. You can send a document to that address and it will be downloaded to Kindle when it connects to Internet. Kindle accepts .docx, .html., .mobi and various other formats of documents
Sending emails
- the best thing seemed to be to use some cloud service like Postmark
- for this kind of services you need your own registered domain. I used one from my friend (thank you Nikola).
- GMail is not allowed for this kind of services
Vercel cloud platform
- they have their own service for measuring website performanse (page insights)
- they also have a Firewall for mitigating DoS attacks
- they have website analytics which can be used to track statistics of page visitors
- it can host NextJS apps and they support serverless NodeJS functions
- easy setup for building the website after push to Git repo.
- once I had an error in build. The build was not successful and I could not find the build logs with error. I only managed to find some build status with error icon on GitHub. That part did not make me happy because I did not understand what was wrong. So that could be a deal breaker for some
- logs on free plan only exist for a short time
NextJS
- I wanted to try out server actions. I was not very happy with all of that. The data is being sent using FormData and I didn't manage to find an elegant solution for reading this data in TypeScript. E.g. I had to transform each date from a string. All in all, I feel like it would have been easier to use NextJS route handler which is just like a REST service
Dates in sever components (NextJS)
- I had troubles with transfering dates between client and server components
- if you do not need a time zone, the best thing seems to be to use UTC on server side
- I tried using date-fns library which has loads of functions+
- last day of the month messed up the time zones so I didn't use their function endOfMonth but I used an alternative way of calculating the last day of the month. Their function had a different time zone compared to the one for the first day of the month which is annoying because it was not consistent in that perspective
Programming with LLM
- I also wanted to try to use free versions of ChatGPT and Bard (now Gemini).
- I just got frustrated in trying to get what I needed. It means I need to practice prompt engineering and also it means that this services are not as mature as I was hoping them to be
Adobe Spectrum
- I wanted to try out this library. It looks really nice. But it feels like a framework. They do not encourage using standard CSS. Instead their system should be used where each component has a lot of attributes (for CSS) and including the ones associated with visual breakpoints (for grid system).
- they use special library for dates
Conclusion
In the end, I managed to build the application which I needed. Every 20th of each month I get the document in Kindle with daily readings for each day of the following month.
And I got to try out some of the things which seemed to be interesting and I learned something new.
Now I have some similar ideas to build aggregate document for some other sites like daily news portal. Or for website with Catholic articles from which I would take the most popular articles of the week.
Here is the code repository:
https://github.com/mih0vil/vercel-kindle-liturgija-dana