A simple meme generator using ReactJS + FireStore

This was my first ever ReactJS competition/hackathon, I did not win but I sincerely spent around 1 week coding for it and I was pretty happy with the outcome.

The challenge : To create a ReactJS app that can generate a meme in the following way, a left panel with left heading and image and a right panel with the right heading and image. The heading can be on top of the image or the bottom.

Github repo : https://github.com/avithe1/memegenerator

Demo : https://memegen-4c017.web.app/ (Read-only, create a firebase project to see 'Save Meme' functionality)

Although memegenerator is a very small project, the following code could be useful for beginners:

1. Use of TypeScript with ReactJS
2. Use of ContextApi for data sharing among components
3. Use of FireStore to store and retrieve meme data

I also wanted to make the web app responsive but it's a long way to go.

The website is hosted on Firebase hosting and now firebase also provides option for CI/CD github integration.

Development
The code is bootstrapped using
npx create-react-app memegen --template typescript

The application layout has two parts the header and the main section. The main section can toggle between CREATE and BROWSE.

All components that require props follow the following TypeScript convention:

interface Props {
    appmode: MenuOptions,
    menuSelect: (option: MenuOptions) => void
}

const Header: React.FC<Props> = ({ appmode, menuSelect }) => {
} 

Hope the project helps someone trying to learn ReactJS and TypeScript.

P.S. I am not a pro with TypeScript in fact this was my first attempt with TypeScript. Looking for some feedback. Thanks.