Kitty - React App Suite

 


Having finished my React course, I decided to do a practice project. I started with a To Do List app as that's traditional for demonstrating front-end interactivity. I made it kitten themed because, well, do I need a reason?

Next.js is great for handling routing, and I knew I wanted a navbar component that stayed the same across multiple pages. I thus needed multiple pages, so Kitty's app quickly evolved in scope to become three apps.

Initially I thought I'd do a weather app and a calculator app as the second and third in the suite, as those are also traditional ways to show React skills. I decided a movie database search would be more interesting than a weather app while still demonstrating external data fetching from an API, so did that. And for the third one I thought I'd get a little more with the times and have it interact with a large language model, generating a story about a kitten and whatever other parameters the user supplies.

 So the three finished apps are:

  1. To Do List
  2. Movie Search
  3. AI Story Generator

I also implemented a toggleable light/dark theme, as that's something else React is ideal for.

You can play with the live version here:

https://titus-powell-kitty.netlify.app/

And if you want to see the code, it's on my Github here:

https://github.com/tituspowell/kitty



Comments