Developed a web app to recognize App Store Connect promotion codes with a camera

https://starhoshi.github.io/romoco?lang=en

I have developed a web app that allows the camera to recognize promotional codes.

When the promotion code is entered, an image is displayed that can be read by the camera of the App Store app, just like a gift card.

App Store Connect promotion codes are created in Plane Text, but typing them into an iPhone by hand is painful, so I made it possible to recognize them with a camera. The source code is here https://github.com/starhoshi/romoco

It's easy to use.

1. paste the promotion code you created on App Store Connect
2. Click on the link when it appears.
   • Or copy and paste the code in Markdown format into the issue.
3. Read the code displayed by the camera function of the App Store app.

We publish about 20 promotion codes and paste them into GitHub Issues so that we can spit them out in Markdown, as we often use checkboxes to keep track of whether they have been used.

Security

Promotion codes are there to DL the app before launch, so it would be very bad if they were leaked.

romoco is deployed on GitHub Pages. GitHub Pages has poor analytics, so I can't see the promotion code entered by the user, although GitHub employees may be able to see the access log...

If you are concerned about security but would like to use it, you can self-host a gh-pages branch.

Technical

I wanted to participate in web front-end development for my work, and developed with Next.js 13, TypeScript, and CSS Modules for study purposes.

I tried Next.js 13's app directory, but many features are not yet available in beta (e.g. RuntimeConfig and next export), so I develop with the traditional pages directory. We use next export to deploy static files because GitHub Pages cannot do SSR.

It's a small app that doesn't even run the API, but I've learned a lot as an introductory developer, and I've gone through the Next.js tutorial, introduced TypeScript, used the RuntimeConfig functionality to use GitHub Pages, and added the next-export-i18n for multilingualization (Next.js i18n is not available in SSG), and PostCSS for CSS with CSS Modules.

When I created AlcatrazSearch 7 years ago. I used react-github-corner and was impressed that the same npm library still works properly.

End of story

At any rate, I'm glad I was able to make what I wanted. Please use it if you like!

In japanese: https://starhoshi.hatenablog.com/entry/2022/11/08/101803