🥚 Munakello ⏰

Munakello (egg timer in Finnish 🇫🇮 ) is a simple app with three time options specifically for cooking eggs.

The goal of this project was to create an app that looks and feels like a mobile app but, however, runs in the browser.

Progressive Web App!

The solution is to make the project a progressive web app (PWA)! PWAs give us the opportunity to use some features in a web app that previously only mobile apps could use. Some of it's advantages include installability and running offline. Read more about PWAs in MDN.

You can install and run the app just like it's any other desktop application - here's how it looks like:

Technologies

• This project is written in TypeScript with PreactJS, which is a faster and lighter alternative to ReactJS.
• Preact CLI is used for setup. It sets everything you need to get a progressive web app, using a starter template.
• Page transition (with the coolest water flow animation ever) is implemented using React Transition Group.

Run the app with HTTPS using Ngrok

You need to serve the app using HTTPS to be able to make use of some of the features of progressive web apps, like installing it to your computer or phone.

• ngrok - Expose a local web server to the internet
• Run npm run dev in one terminal.
• Then run ngrok http 8080 in another terminal.
• That command will then give you two URLs, use the one with https.
• Now you can access the app using HTTPS, and therefore "installing" works.