An updated version of my first project. Since my first project I've grown a lot as a developer and I wanted to implement the new knowledge I've gained. That's why I decided to look back at where I started and rebuild the whole application. The old version used Lottie.js to move the SVG with JSON data. Version 2.0 works with Three.js and a 3D character model. The application is completely responsive and works on every device.
The application is a Tamagotchi of Marvel's Guardians of the Galaxy character 'Groot'. The application has three buttons to control Groot with. You can kick him in the 🥜, make him dance or wave to you. On the right you can find an info-button that will open a modal to displays information about Groot and his skills. His skills are retrieved from the SuperHero API.
- A 3D model for the character with animations.
- An API-token from the SuperHero API.
- The dependencies listed below.
💡 You can download a 3D model or create one yourself with Blender or such software. I've got mine from Sketchfab thanks to Chemaron. The animations are added with Adobe Mixamo.
🚨 Since the SuperHero API doesn't allow CORS, to show the skills you should disable CORS via your browser. There are mutliple extensions that could do that.
Visit the application or follow the steps below:
- Download the .zip file or clone the repository
- Open the terminal and move to the project directory
- Run npm install
- Run one of the following scripts:
npm start
to open the development server.npm test
to test the current version.npm build
to build a new version for production.