[Entry] Shopoji - A free market shopkeep game

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

GitHub

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 off master which is master without credentials, so I can use that code for the public repo's master branch
• 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

1. I actually kept the README up to date throughout the project
2. I now have no excuse to not have landing pages for all my projects on GitHub
3. 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

Dev.to Posts Along The Way

Pusher Shopkeep Game - Initial Idea

ItsASine (Kayla) ・ May 5 '18 ・ 3 min read

#pushercontest #inprogress

Pusher Project - Why I'll Never Be Devops

ItsASine (Kayla) ・ May 6 '18 ・ 2 min read

#pushercontest #inprogress

Shopoji - Initial Front End with working effects!

ItsASine (Kayla) ・ May 9 '18 ・ 2 min read

#pushercontest #inprogress

Shopoji - Pusher Presence Channels are cool

ItsASine (Kayla) ・ May 13 '18 ・ 2 min read

#pushercontest #inprogress

Comments

[Avalander]

Wow, congratulations on finishing! It looks really cool!

[ItsASine (Kayla)]

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.