This is an open source project from DevProjects. This project is not just about alpacas. Allowing users to generate and download avatars are common in many interactive websites. In this project, I learnt how to create an image generator website that allows users to generate, combine, and download images.
Built with ReactJS, CSS and Merge Images Library
Like most projects, I ran into a few bumps along the way. One particular one was in rendering the styles buttons from the data file I had setup, as they were from a nested array under the buttons for the features.
The biggest obsatcle I encountered during this project was maintaining the state for all the components throughout the entire React app. This was my first interactive React project that allowed interaction from the user, so I had a tough but rewarding time implementing the state using the useState hook and props to modify the setup file and render the components accordingly.
I could spend all day describing the lessons I learnt while working on this project, but the most important ones involved my newfound understanding of the useState hook and using external libraries. I also learnt a lot about code structure and modifying Javascript objects in React.