# May 2020 Quarantine Self Challenge

[originally posted here](https://sznm.dev/blog/quarantine-self-challenge)

Recently I challenged myself to make a web app as soon as possible in two days. Managed to make two. One is a simple Food Recipe App and the other is COVID-19 Data App. Turned out it was so fun.

## 1. Le Cook

Fun food recipe catalog app powered by [RecipePuppy](https://recipepuppy.com) API....

[https://le-cook.now.sh/](https://le-cook.now.sh/)

![Le Cook (1)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893716098/kvc6C0_8Z.jpeg) ![Le Cook (2)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893717948/yeu57c3H0.jpeg) ![Le Cook (3)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893719687/vw0xRGsvv.jpeg)

## 2. COVID-19 Data

presenting COVID-19 statistics powered by [@mathdroid](https://github.com/mathdroid/covid-19-api/)'s covid-19-api. I made a vanilla JS version of this app several days ago and I decided to re-develop it using Gatsby (React).

[https://covid19data.now.sh/](https://covid19data.now.sh/)

![COVID-19 Data App (1)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893721454/xdKB46ewP.jpeg) ![COVID-19 Data App (2)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893723131/K9Hfip1-E.jpeg) ![COVID-19 Data App (3)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893724820/a0WUHBoLN.jpeg)

Both [Le Cook](https://le-cook.now.sh/) and [COVID-19 Data](https://covid19data.now.sh/) app were developed using Segment's Evergreen UI. Just discovered this React UI Framework and turns out it's so convenient to implement it on these projects.

When developing COVID-19 Data app, I realized Evergreen UI have no opinionated way to construct responsive layouts. So, I decided to combine it with TailwindCSS which I already tried to use at this personal site. It worked.

![Evergreen UI (1)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893726822/fXmp7pIO-.jpeg) ![Evergreen UI (2)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893729369/SOysBO7HV.jpeg) ![Evergreen UI (3)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893731293/3UuYyHewT.jpeg) ![Evergreen UI (4)](https://cdn.hashnode.com/res/hashnode/image/upload/v1632893733322/8tV8CmaHm.jpeg)

I decided to deploy it using [Vercel](https://vercel.com) and I'm so shocked by how fast it is compared to [Netlify](https://netlify.com). I'm considering to migrate to Vercel from Netlify for my previous projects, including this site.

I posted my recent projects [here](https://sznm.dev/projects). You can access the project and the project's GitHub repository link from this [page](https://sznm.dev/projects).