Pokemon Trading
The focus for this app was to build out a full-stack program. There were a lot of user stories and different functionalities that I wanted to implement to reinforce my learning along the way. The main achievement for this project was the development of a custom API built with Java and Spring, which got connected to a persistence layer; a PostgresSQL database. I also implemented Angular Material, Tailwind, got comfortable with RxJS, and interacted with a third-party API(POKE API). Overall, this was a fun build, and I learned so much along the way.
Type
Full-Stack
Dynamic
REST API
Stack
Java
Spring
Angular
PostgresSQL
Tailwind
RxJS
Source Code
GithubProject Goal and Purpose
The purpose of this project was to learn and apply. I spent a lot of time researching and learning new technologies. I mainly wanted to build a full-stack application that had all the strings attached; log-in, sign-up, REST Api, database, third-party and browser-apis, Reactive Development, user profiles, and a trading functionality for a nice challenge. This project currently has around 10 active users, most of which are former batchmates from the coding bootcamp I attended.
Web Stack Choices
Java and Spring were chosen for the backend to provide an enterprise-level REST API. This provided a great approach to implement microservices with the modularity and scalability that Spring provides in synergy with Java. The Maven build tool was also another excellent addition, as it provided great tooling for packaging the server.
Angular is my framework of choice, so that was the immediate decision. It provided great view modularity through the various components I was able to build and route. Angular's RxJS state management was also instrumental in facilitating reactive development on the client-side and maintaining data streams. Design and styling were not the main concerns for this project, so I wanted something that would be quick to implement and package. I decided to go with Tailwind.
Problems and Thoughts
Along the way, the implementation of RxJS began to become more complex, so I needed to really take a step back and think about the design of the data streams I was constructing. This process involved learning more about Hot and Cold Observables, Higher Order Observables, and really digesting the flow of data between components.
One of the main features, that of trading Pokemon between users, was more complicated than I had anticipated it to be. Unexpected edge cases poppped up a couple times while I was functionally testing the feature.
Naming conventions! There were many times thoughout this development cycle where I had to spend more time than I wanted whilst updating features beacuse of nuanced naming conventions.
Lessons Learned
One of the more important takeaways from this project was the lesson to pay more attention and take the time to properly name variables, objects, functions, etc... Not only does it make code easier to understand and read, but any future developer or teammember going over files will have a much easier time. I now make this a conscious effort and take the consideration to properly name things than I've done in the past.
Furthermore, from a design perspective, I discovered the importance of considering potential abnormal use cases. While an initial implementation of a functionality at times seemed straightforward, unexpected behaviors tended to occur. By thinking more about scalability and behavior, I found adopting better design patterns significantly helped. Comprehensive testing also proved to be valuable. I made sure to achieve over 90% code coverage through testing on the backend API, which effectively minimized potential time-consuming issues.