Intro

I liked playing cs2 when it came out, have learned a lot of staff about the game, got around 16k premier elo and even bought some skins (paste the link to the article). Currently, there is no place to show off the skins you bought except the game itself or maybe float wiki for those who got thousands of dollars to spend, so I got idea to create cute little web site, where people would be able to share their collections and call it CSGallery.

Also it was a great opportunity to learn frontend, last interaction with React gave me a PTSD and I was ready to try something new.

Idea for the site

1. User logs in with Steam to the site
2. User select skins in the inventory, writes a description and posts collection to the site
3. Then there is reddit like board of posts with upvotes and down votes
4. Comments in the v2 of the site to boost engagement

And answering my own question “Why don’t just create a subreddit?” – it would not provide user experience I would like, I want the site to be easy to use and pretty, so the site it is.

The one delightful part of the project: Elm

As I said, I hated learning and writing react, compared to writing code for backend or infra it was miserable, so I looked around and found 2 fresh options:

• Phoenix live view
• Elm

I choose the latter since it was easier to find good docs and examples, probably I have not spent enough looking into phoenix, because Elm satisfied all my wishes.

To write the app I just looked at wonderful elm-spa-example and copied all the ideas from here, rewriting some small staff like routing with address instead of anchors and small changes in views functions. Yes, many of the elm repos I saw are there without commits for 5-6 years, but surprisingly everything works and provides up-to-date examples.

Deploying the Elm application

The process looks like this:

0. All the needed tools are declared in the nix shell
1. Building static files with elm make
2. Commit & push to github
3. Digital ocean app platform for static sites, which is set up to support SPA by specifying fallback URL

For a single person project this works like a charm, deploys are easy and fast, no worries here, would recommend.

When I have figured the basics: header, footer, added bootstrap styles, deployed it all to digital ocean, the hard part has begun: steam authentication.

Steam Auth: frontend

OpenID Authentication can be done on the frontend, I’ve tried it, and it worked (i got creds at least and was able to save them), but for the CJM to work I need to access user’s images with secret key, storing it on the frontend would not be secure, so I decided against frontend-only authentication.

Steam Auth: backend

I’ve tried Spring as I thought Spring Security is sane default which must support any modern authentication provider. Turns out the latest version of spring has deprecated interfaces needed to implement OpenID 2.0, so I either have to use older version or reimplement (copy-paste) openid support.

Maybe there is a way to use OpenID 2.0 and OIDC interchangebly? – no, that’s impossible API is completely different, according to stackoverflow answer

Yes, I could have used Spring 5.0 which supports openid 2, or write backend in python or rust and just make it work, but after spending couple days of my free time to figure out OpenID version I could not find any energy to continue working on the project.

Valve products are not worth it

The CS2 is in awful state at the moment: without faceit it’s unplayable because of cheaters, I constantly had network issues & then even on a modern hardware game crashes the whole PC, same can be sayed about developer infra. Auth is implemented with long deprecated technologies, docs are very hard to find, it feels like Valve devs just don’t care about their core audience, so I’m probably gonna quit and play Valorant or other games that actually work.