HTTP Cat Viewer

• 

  Picture of home screen, with 200 OK cat.

Inspiration

Thinking of how to use pages with NextJS, the http.cat status code website popped up. All the images are displayed on one page, so what if we could sort through them easier? HTTP Cat Viewer was born.

What it does

It provides the ability to search through the status codes with the http.cat images and groups status codes by 1xx, 2xx, etc. for the user to learn more about status codes.

Some NextJS Features:

• App router
• Dynamic routes
• Pages and Layout
• Client-side navigation
• Image and Link components
• Static Generation
• Incremental Static Regeneration
• MDX

How we built it

• Git used for version control.
• VSCode, next and react documentation.
• Willpower. And soda.

Challenges we ran into

• Setting up the configuration for things like MDX.
• Figuring out the file structure for an app router setup.
• Thinking of how this project can revolve around NextJS features.

Accomplishments that we're proud of

• Fun and simple website!

What we learned

• How to act really quickly and throw together an website.
• NextJS features like Incremental Static Regeneration, MDX, Image components and options.
• Status codes 😎.

What's next for HTTP Cat Viewer

Could add some socials that point towards the http.cat website/creators, they're the main people who made this possible. Also http.dev and umbraco.com have more status code resources that were helpful, shout out to these websites!

Built With

• git
• http.cat
• http.dev
• javascript
• nextjs
• npm
• react
• tailwind
• umbraco.com