AI & React.JS
Creating a Fish Simulation in React with GPT-4
In this article, I will show you a simulation I created together with GPT-4 in React.JS. Let’s start with a demo:
You can also run the app here and see the full code here.
In the simulation, you can observe the behavior of fish, food, and sharks. The fish move toward the food while avoiding the predators, and the sharks hunt the fish.
The current system operates based on slightly randomized predetermined rules and the behavior of the organisms does not evolve significantly. A potential improvement could be to introduce an evolutionary process where traits are inherited. Another improvement could be to add decision-making using neural networks.
I won’t talk much more in-depth about the application and code for two reasons. Firstly, GPT-4 generated most of it, and secondly, I think the code can be improved in many ways. Instead, I will discuss what I think of coding with GPT-4 and its advantages and disadvantages.
Making an Idea a Reality
One of the more helpful features of using GPT-4 and the ChatGPT models for coding is getting an initial draft to work with quickly. Setting up the base of a project can be time-consuming, but ChatGPT, when successful, can eliminate this step entirely.
GPT-4 is often proficient at understanding complex descriptions of features, much better than GPT-3.5. That being said, it can be challenging to describe exactly what you want from the get-go and you may not even know it yourself yet.
For this reason, the first prompt I did and the generated code resulting from it were far from the final product. Instead, by iteratively asking GPT-4 to add things I wanted and altering the code myself when it failed, I was able to shape the final application.
No Free Lunch
It is rather addictive to continue to ask GPT-4 to add features to improve the code, especially if it generated the initial draft of it.
Why code it yourself if GPT-4 can do it?
But relying too much on this feature can be counterproductive for two reasons:
- GPT-4 doesn’t work forever — as the code increased in size, the level of GPT-4’s output became worse. Some of the time, it made up functions or generated code that just didn’t make any sense in the circumstances.
- The code isn’t always that great. Perhaps this could be improved with prompting, but GPT-4 didn’t refactor the code as it added features, which caused the code to become messier, less readable and less structured. At times I prompted it to refactor the code, but it often failed to do so.
Conclusion
In the end, GPT-4 can be of great assistance, but it’s also an alluring trap that could make you lazier than you ought to be if you rely too much on it. As often is the key, a balance is needed. Learning when and when not to use these models I believe could be useful to improve their effectiveness.
That being said, with the speed AI evolves right now, who knows when this will change.
If you enjoyed this article:
- 👏 Clap, this will help me understand what my readers like and wants more of
- 🙏 Follow or subscribe, if you would like to read my upcoming articles, new ones every week!
- 📚 If you are looking for more content, check out my reading lists in AI, Python or Data Science
Thanks for reading and have a great day.
Level Up Coding
Thanks for being a part of our community! Before you go:
- 👏 Clap for the story and follow the author 👉
- 📰 View more content in the Level Up Coding publication
- 💰 Free coding interview course ⇒ View Course
- 🔔 Follow us: Twitter | LinkedIn | Newsletter
🚀👉 Join the Level Up talent collective and find an amazing job
