As a fan of cats - and inspired by my own - I wanted to give them something back. And maybe a simple bite of salmon would be more suitable, but hours put into this project definitely make me satisfied!
Many methodologies used in this project were inspired by Wes Bos course on Next.js - recommend this guy very much.
By the way I hope Only Fans don't sue me for the inspiration!
- Purely graphic and elegant home page
- Interactive nav menu at the top of the page
- Shop containing listed cat pictures for sell
- Each listing has it's individual page
- Ability to create an account and sign in
- Logged in users can add their cat pictures for sell, as well as buy pictures from the shop
- Custom hooks for dealing with the form data and user status
- Actual payments using Stripe
- Cart object
- Missing pages, like "About" or "Account"
- Unit tests using Jest
- Next.js w/ Typecript for the frontend
- Styled Components for styling
- Keystone for headless content management
- GraphQL w/ Apollo Client for data querying
- React-Scroll-Parallax for scroll animations
- One time while managing state in one of my previous react projects, I got unexpected "undefined" so many times... that I understood why Typescript is so loved. I took this project as a chance to slowly pick it up.
- Next.js because of Server Side Rendering - no need for refreshing and slowing the overall speed of the site during every switch between pages feels great! Definitely something I want to explore more in the future.
- I chose Headless CMS to familiarize myself with the concept, which turned out to be a great solution for managing content on a personal sites, without the need for building a more complex and individualized backend.
- GraphQL - it's my second encounter with it, and I wanted to learn more about querying and caching data with Apollo.
- Styled Components - are for me a perfect bridge between CSS and JSX, not having to deal with a duplicated class names is also great!
- Rewrite this project with the use of Blockchain technology
- Tokenify your Cat!
