Notes

A collection of notes and photos made by myself, and links from the web.

  1. A peek into Japan's Convenience Stores

    Ubiquitous in Japan, this article dives deeper into Convenience stores.

    https://one-from-nippon.ghost.io/combini-part-1/

  2. How a backpack is made

    View on youtube: How a Backpack is Made : Every Step on the Production Line

    From start to end. They have so. many. parts!

  3. Web Components

    Slowly getting the hang of this Web Components thing. The idea is to replace the little Javascript I have with 3-2 web components, so I can render them in the front-end, and in my CMS, knowing everything looks the same.

  4. The Nopia

    View on youtube: Introducing Nopia

    Every single sound in this video is pure bliss

  5. Xkcd's development notes

    A nice behind-the-scenes look at how they made the "Gravity" and “Escape Speed” exploration comics.

  6. Beepberry

    Bought a Beepberry, impulse buying ftw! No idea what I'll do with it, but it just looks too cool to not have it.

  7. Thank you

    Someone emailed me to thank me for an article I wrote and it made my day.

    If you read an interesting article, email the author and let them know!

    This is especially true for personal blogs.

  8. How a Mahjong table works

    View on youtube: how automatic mahjong table works

    I've always wondered how these worked. The answer, of course, is magnets!

  9. Realtime Colors

    Such a neat way to pick a color palette: https://realtimecolors.com

  10. 3d printed automatic screw packaging

    To get rid of plastic bags with screws, this maker has designed a way to insert the screws into the (3d-printed) final product.

    In order to do this he made a complete system that can sort screws and nuts, dispense them in the right amount, and place them into the (paused) 3d print, really cool to see

    View on youtube: Robotic placement - 3d printed automatic screw packaging #003

  11. (Starlink) Sattelite map

    I never realised there were already so many Starlink satellites in space: https://satellitemap.space/

  12. Modern CSS is awesome

    View on youtube: Michelle Barker – Modern CSS Layout is Awesome! – btconf Düsseldorf 2023

    Really nice talk showcasing new CSS features

  13. Hong Kong’s Kai Tak Airport

    A nice video about the former Kai Tak Airport, situated in the heart of Hong Kong. It would have been so cool to see in real-life.

    It's been 25 years since the closure, and in two weeks. I'll visit it's successor: Hong Kong International Airport for a week-long stay in Hong Kong.

    View on youtube: Was Hong Kong’s Kai Tak the world’s scariest airport?

  14. Finally a sunny day

  15. Publishing notes through Telegram

    There's a lot of friction in writing short-form content on a mobile device. I have to log in to my Pocketbase instance, create a note and trigger a redeploy of the site when I'm done.

    This meant I mostly didn't bother, or Telegram myself the link/content to do it later when I was behind my computer (and promptly forgot). Instead of writing content, I made a Telegram bot to make it easier for me to push content.

    No more logins, fighting the text editor on my mobile, or forgetting to trigger a new build. Just write the content and end with the publish command.

  16. Vincas Stonys - Un-Suck Your React Components

    View on youtube

    A super helpful video about composable React components. Stop adding a million props, and use the context API to create super composable components.

  17. Longboarding season has started

    After months of rain and wind the first day with sunshine and a light breeze has finally come around.

  18. Sophie Koonin - This website is under construction

    Sophie Koonin gave a really nice talk about personal websites.

    View on youtube

  19. Barry is back with Season 4 on HBO

    It includes one of the best side-characters ever; SoHo Hank

  20. Set FontAwesome NPM registry on GitHub Actions

    A little while ago, my GitHub actions were failing because of the following error:

    error An unexpected error occurred: "https://npm.fontawesome.com/@fortawesome/react-fontawesome/-/0.1.15/react-fontawesome-0.1.15.tgz: Request failed \"401 Unauthorized\"".
info If you think this is a bug, please open a bug report with the information provided in "/home/runner/work/appsignal-status/appsignal-status/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
Error: Process completed with exit code 1.

    The reason is we use FontAwesome and our action didn't have access to the (private) FontAwesome repo.

    In order to fix this we need to make Yarn/NPM aware of this private repo and to do that we'll create a CI environment under the GitHub Repository settings.

    Under that CI environment we'll add a FONTAWESOME_NPM_AUTH_TOKEN "Environment secret" (Not variable, secret!) which we can use in the GitHub Actions runner.

    To actually expose this secret, we'll have to tell the GitHub Actions runner to use this CI environment, and we'll have to set the NPM config to use the private registry.

    For example; this is a linting job that uses the private repository. 

      linting:
    runs-on: ubuntu-latest
    environment: CI # << Set the CI environment
    steps:
    - uses: actions/checkout@v2
    - name: Install dependencies
      run: |
        npm config set "@fortawesome:registry" https://npm.fontawesome.com/
        npm config set '//npm.fontawesome.com/:_authToken' "${{ secrets.FONTAWESOME_NPM_AUTH_TOKEN }}"
        yarn install
    - name: Run ESLint
      run: yarn lint

    GitHub will replace the value with *** on an actual run:

    Run npm config set "@fortawesome:registry" https://npm.fontawesome.com/
  npm config set "@fortawesome:registry" https://npm.fontawesome.com/
  npm config set '//npm.fontawesome.com/:_authToken' "***"
  yarn install