How I built a Pokémon Go Server Status Checker
I have always been a fan of Pokémon — So like so many others, I joined the Pokémon hunt on PokémonGo. Team Valor FTW!!
Unfortunately as with everyone else, I had trouble staying logged in. I continually saw outages during critical times, like when a Paras showed up in the laundromat or when I found a Cubone by the Bay Bridge.
Despite the server problems, me and other trainers continue to use the app.
To make things easier for those who want to stay informed, I built a site using a JavaScript open source library — is-pokemon-go-up
The site ispokemon.live is live and built using the JAM stack philosophy. Which identifies a useful way to build modern websites.
JAM stack
The JAM stack is the stack for this new reality. Instead of FTPing server-side code to a shared server, we push to git and our code is instantly built and distributed onto CDN nodes across the world. Instead of depending on a database for every request we serve, we use build tools to ship full sites and apps ready to run directly in the browser. Instead of mixing persistence, HTML generation, credit-card transactions, authentication, etc, all together, we separate these concerns and consume well defined APIs from our front-end.
The JAM stack uses markup languages like HTML, CSS and Markdown to format and style our content, client-side Javascript to make it interactive and engaging and APIs to add persistence, real-time sync, real-world interactions, comments, shopping carts, and so on.
Browsers are the new operating system. Servers are abstracted away by CDNs and APIs. Sites are either database free and generated up front, or consume hosted database services directly from the browser. JavaScript is in charge of any dynamic programming during the request/response cycle and runs entirely on the client (JAMstack.org).
Using the JAM stack
Using the JAM stack for this project enabled me to quickly iterate on an idea and ship to production with a low amount of effort.
The API created from the open source library populates my API from a node server in this case but could have delivered using any language or service. The API then gets consumed using React, which is also serving my Markup from a small amount of JSX. You can think of JavaScript as the glue that makes everything work.
Thanks to some more pre-packaged code I put together a quick site using React Static Boilerplate and generated a static build using Webpack.
The JAM stack has provided a seamless workflow for getting projects live. If you have interest in learning more on how I got a project like ispokemon.live up and running, read more on the Netlify getting started guide or checkout the project on GitHub.
It is also fare to mention that the JAM stack is not a new idea, just a new name.
*I should also note, developers have been building API’s and Markups to consume then for years. The JAM is not new concept, but a new name.
💚 is appreciated 😊
