Hello, Dev.to community!
I'm working on a Pokémon 3D Model Viewer project, and I want to make the Pokémon data more dynamic by creating a simple API. The project started as a fun way to explore 3D models of Pokémon and display them interactively on a webpage. Currently, I’m storing all the data in a static JSON file, but I’d like to make it more flexible and scalable by building an API that will serve the data dynamically.
You can view the demo of the project here.
The Idea Behind the Project:
The goal of this project is to create an interactive Pokémon 3D model viewer that allows users to explore different Pokémon in 3D, and switch between different forms (like Gigantamax, shiny, etc.). I want to build an API that serves the Pokémon data, including model URLs, names, and other details, so it can be easily fetched and displayed on the front end.
Why I Need Help:
I’m relatively new to backend development specially when it is at complex level and api is totally diff, I don't know anything related about it, so I need help with creating the API. Here’s what I need assistance with:
API Basics: I don’t know how to create an API from scratch. Can someone guide me through the process of setting up a simple API using Node.js (or another language that’s beginner-friendly)?
JSON Data Structure: I already have a JSON file with Pokémon data (name, model URL, type, etc.). What’s the best way to structure this data in an API?
Database Integration: Should I use a database for storing the Pokémon data, especially as the project grows? Currently, I'm using a static JSON file to pass the data, stored in a folder within the project. However, I want to ensure scalability and efficient data retrieval as I expand the project, so I'd appreciate advice on what kind of database would work well for handling dynamic content at scale.
Serving Static Files: The Pokémon 3D models are in GLB format. Everyone knows that it is hard to store and serve GLB files due to their large file sizes and the rendering time. The system can hang or slow down significantly when the number of models increases, especially with a collection of 1025+ Pokémon models. I’m unsure how to efficiently serve such large files through an API. Any advice on best practices would be very helpful!
Handling Requests: How can I fetch this data dynamically on the frontend and display it in the app? What’s the best way to manage API requests?
Current State and Future Plans: Currently, I have 808 glb format models of regular Pokémon, but I want to expand the project to include all the Pokémon from each region and type, as well as additional forms like Galarian, Gigantamax, and Mega Evolutions. Essentially, I want to include more models to cover all Pokémon available in the games.
Why This Project Matters:
This project is an exciting way for me to dive into backend development, while also combining my love for Pokémon with learning new skills. I’d love to make it more robust and dynamic, so that other people can use the data and explore Pokémon in 3D, similar to how websites like Pokémon Showdown display detailed Pokémon stats and models.
If you’re interested, I’d be happy to share more details about my project or my code. Any advice or help is greatly appreciated!
Clones: 231
Views: 622
Stars: 1
Thanks so much in advance!
Top comments (7)
Hi, I recently developed an API on the same subject. Would be glad to share some knowledge.
Thanks for offering to share your knowledge! I was thinking of storing the models in a folder or repository and fetching them via an API. Storing and rendering models locally in the app seems challenging due to storage and processing limitations. I have some experience with fetching data from JSON and APIs with keys, so I initially set it up in an HTML app. However, I'm unsure how to create an API that can serve models for multiple applications or how to select a model that supports GLB actions, such as movement or animation. Currently, I'm working on setting things up on GitHub and am open to contributions as I expand the project.
Discord
We may be able to collaborate here. I am working on a final project for a data mining class. It is due in 2 days but besides that I can follow up with what I’ve learned. It involves json data and API I/O’s
Join the Discord and share your GitHub profile link either there or here. I will add you as a collaborator.
I am facing a major problem finding assets. Some are unavailable or do not exist, and some good models are paid. I need help finding more models and would appreciate contributions. You can check the README for a list of available models
Need for glb format models
created a server to connect Discord with proper guidelines and basic restriction we can further make modifications in it
Some comments may only be visible to logged-in visitors. Sign in to view all comments.