What I built
Shopoji is a single player game where you buy and sell inventory. The emoji market is strong, so you are trying to make a big break to tap into all that sweet, sweet 💰.
While you do not see other players, your shop is aware of the effects of the global market. Each time a new shop joins, they bring more emojis into the market, thus affecting scarcity. In future iterations, this will play a much larger role in how you're going to have to price your own items.
The Demo
Link to more information and a live demo
The Code
How I built it
Tech Stack
- Pusher API
- JavaScript
- Node.js
- jQuery - For modifying the DOM during the game
- MomentJS - For having timestamps in the game messages
- vanillaJS
- CSS
- Bootstrap
- HTML
-
AWS CodeStar
- AWS CodePipeline
- AWS CodeBuild
- AWS CloudFormation
- AWS Lambda
- AWS S3
- Probably more
Dev Tools
- Github - Public and private repos to source control development
- I kept with proper Git Flow and have
master
,develop
, and feature branches - There's also a weird
public
branch I keep offmaster
which ismaster
without credentials, so I can use that code for the public repo'smaster
branch
- I kept with proper Git Flow and have
- Webstorm IDE
- GitKracken
Stumbling Points
Right now, my biggest one is this:
My "attempt to switch to Presence channels" idea from my last post is totally not working. For right now, I'll stick with public channels and introduce user awareness in 2.0.
AWS was stressful, but it didn't take that much time in the grand scheme of things. Working on the app logic in JS took a while, but since I knew it and could see progress, it didn't feel nearly as bad as the infrastructure part.
Cool Stuff
Up until I tried rewriting my Pusher logic, the Pusher API itself was super straightforward and easy to set up.
I'll credit the ease of building an app in a week to the Pusher QuickStart Node and JS guides.
And this may seem minor, but I was highly surprised by a feature of GitHub Pages. If you enable it without an actual top-level front end, it'll use Jekyll to make one out of your README. This means
- I actually kept the README up to date throughout the project
- I now have no excuse to not have landing pages for all my projects on GitHub
- I didn't have to pull off of dev work for this app to work on a "marketing" site for it
I always thought GitHub Pages was for deploying static websites and Jekyll blogs for free, but that README website thing is super nice and useful. I guess I'm one of today's ten thousand.
Additional Resources/Info
Lessons Learned
I built an app in a week. That's just mindblowing.
My education background (and foreground, due to grad school) is in mathematics, and my work is in software test automation. Next time I get any sort of inkling of imposter syndrome when it comes to coding, I developed and shipped an app in a week.
Sure, I learned a bunch of new tech that's cool and all, but mostly I learned that I actually can do things. I may be "just" a QA, but I can dev things if I want to, dammit.
Future Updates
I'm not going to ship it and forget it, but I do need a bit of a break. I have some household projects to do before my summer internship steals my time, and AWS is about to start charging me for CodeBuild if I don't chill for the rest of the month.
Things for future Shopoji 2.0
- Unit tests
- Fix a bug in the pricing
- Get auth working
- Change everything to presence channels
- Get client spawned events working
- Set up NPC preferences for price ranges
- And have them be affected by the global market
- Address tech debt -- some corners were cut hard to get it out the door fast, so without a deadline, it'll be easier to address issues
- Code is tightly coupled to 🍏s
- Introduce DynamoDB to store game info, instead of everything being client side
- Add more NPCs, instead of the lady that always wants 🍏s
- Add more emojis, so the lady can buy some 🥧 too
Top comments (2)
Wow, congratulations on finishing! It looks really cool!
Thank you!
I should have said that the hardest part was convincing someone to open the game while I was recording that demo gif :P
Though I forgot to demo failed buys/sells which show up in Bootstrap danger.