Senior Engineer at Haven
Pingy
A webpage monitoring web application built with modern client and server side tech.
As a developer sometimes you’ll get that itch to build a side project that won’t take too long, and involves using techniques/tools that you don’t use day-to-day. Most recently for me, that was Pingy.
The idea was that I wanted to develop something simple to host on my Raspberry Pi that I’d bought in 2020, but didn’t get around to opening it until recently (June 2022). While it functions great, it’s quite limited in what it does. For example, it will alert users when any aspect of a page changes, which happens very regularly for big sites. To expand in the future, I’d like to have the user select an element on the page and watch for changes just on that chosen element.
Features
- Fully functional authentication system using JSON Web Tokens and cookies
- Client side route authorization using higher order functions around Next.js
getServerSideProps - Server side route authorization using Fastify route protection
- User can enter web page URL which is saved to database and, depending on selection options, crawled periodically:
- For changes in the page text (not HTML level, as this tends to change on most page requests due to front end security measures)
- To determine if the webpage is down (i.e. returns any status code other than 200)
- Sends alert to use via email based on their selected criteria
- Gives users a dashboard view of their current monitoring
Tech
Both front and back end written in TypeScript, making use of strong typing for client side, re-usable generic components, and server side typed classes.
- Docker with Postgres database to get stuck in easily
- TypeScript
- Next.js & React
- Styled Components
- JWT authentication
- Fastify server
- Prisma database
- Cheerio for page crawling
- Postmark API for sending email alerts