How a Backpack is Made : Every Step on the Production Line
From start to end. They have so. many. parts!
How a Backpack is Made : Every Step on the Production Line
From start to end. They have so. many. parts!
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.
Introducing Nopia
Every single sound in this video is pure bliss
A nice behind-the-scenes look at how they made the "Gravity" and “Escape Speed” exploration comics.
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.
how automatic mahjong table works
I've always wondered how these worked. The answer, of course, is magnets!
Such a neat way to pick a color palette: https://realtimecolors.com
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
Robotic placement - 3d printed automatic screw packaging #003
I never realised there were already so many Starlink satellites in space: https://satellitemap.space/
Michelle Barker – Modern CSS Layout is Awesome! – btconf Düsseldorf 2023
Really nice talk showcasing new CSS features
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.
Was Hong Kong’s Kai Tak the world’s scariest airport?
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.
A super helpful video about composable React components. Stop adding a million props, and use the context
API to create super composable components.
After months of rain and wind the first day with sunshine and a light breeze has finally come around.
It includes one of the best side-characters ever; SoHo Hank
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
It took me a while to figure out where to place the code that loads data from an external CMS and makes it available in bridgetownrb.
The idea is to place a builder in the builders folder. This builder is called each time the site is... built.
plugins/builders/posts_builder.rb
This file should contain a class with a build
method. Bridgetown exposes a get
method that allows you to fetch any data without having to worry about using a specific HTTP client. It also parses the JSON for you, if present.
In my case I'm getting data from a pocketbase instance and for each item
, I'm adding a resource to bridgetown.
class Builders::PostsBuilder < SiteBuilder def build get('https://pocketbase/api/collections/blog_posts/records?sort=-date&perPage=1000&expand=files&filter=(public=true)') do |data| data[:items].each do |post| add_resource :posts, "#{post[:slug]}" do ___ post layout :post permalink '/blog/:slug.html' end end end end end
The first argument is the collection (in this case posts
), and the second argument the "id" of the resource. You can alter the layout and permalink by using the DSL.
You can now call this resource anywhere in your bridgetown code:
site.collections.posts.resources
Adding a webfinger to your own domain lets you keep one point of truth for your social media handle. You can tell people to just follow social@matsimitsu.com
for example, and through this webfinger file Mastodon will know where to look for your actual profile.
Bridgetown lets you create files with permalinks anywhere. In my case this file is in:
src/webfinger.erb
The contents contain references to my ruby.social account, where my actual Mastodon profile lives, which I can change at any time and anyone using my social@matsimitsu.com
reference will end up on the correct instance.
--- sitemap: false permalink: ".well-known/webfinger" --- { "subject":"acct:matsimitsu@ruby.social", "aliases": [ "https://ruby.social/@matsimitsu", "https://ruby.social/users/matsimitsu" ], "links": [ { "rel":"http://webfinger.net/rel/profile-page", "type":"text/html", "href":"https://ruby.social/@matsimitsu" }, { "rel":"self", "type":"application/activity+json", "href":"https://ruby.social/users/matsimitsu" }, { "rel":"http://ostatus.org/schema/1.0/subscribe", "template":"https://ruby.social/authorize_interaction?uri={uri}" } ] }
The Fable (Japanese title: ザ・ファブル 殺さない殺し屋) is apparently the second movie about a hitman. I still have to watch the first one 🤦.
It’s about a legendary hitman named Akira who has to lay low and can’t commit any murders for a while. He works a menial job at a graphic design studio, and of course, things happen that make it really hard for him not to kill.
It’s a fun action-comedy that starts off slow but gains speed halfway through and has a nice ending.
Good for a boring night in COVID isolation, and it’s available on Netflix
I recently flew from Amsterdam to Amman, Jordan, with Turkish Airlines, and one thing I always like to do is skip all the blockbuster films and look for the “world movies” category. You can find some great movies there that you weren’t going to see otherwise.
This time it was The Eight Hundred; a film about the famous battle of the Sihang warehouse on November 1, 1937. This battle was during the Japanese occupation of China but before the second world war broke out.
Japan was still trying to play nice to the Americans and British, and part of Shanghai was known as “concessions,” a place that couldn’t be invaded or even shot at by Japan in fear of retribution from the US and Britain.
Next to this “concession” was a warehouse occupied by the remaining 800 soldiers in Shanghai, trying to defend it to the last man to give the rest of the Chinese army time to prepare better defenses outside the city.
The movie follows these soldiers (actually about 400, the number was inflated by the Chinese commander) in their defense. This story is based on actual events and follows them quite accurately, albeit with more dramatization.
As far as war movies go, it’s a nice film, and the quality is pretty good with sound special effects. It’s a nice view if you’re stuck in an airplane for 4 hours.
When I first came to Hong Kong , I was surprised by the scene of hundreds of people crowding the streets and overpasses on cardboard boxes. Only later I found out that this is a weekly occurrence on Sunday when the thousands of (mostly Filipino) maids living in Hong Kong have their day off, which they use to socialise with fellow maids.
Still Human revolves around Leung Cheong-wing, a paralysed and hopeless man living in a social housing flat in Hong Kong and Evelyn Santos, a Filipino domestic worker who came to the city to make a living.
It portrays the (often precarious) lives of Filipino workers in Hong Kong and how they are treated without becoming too heavy. The movie focuses on the brittle relation between Leung and Evelyn and is mostly shot inside the cramped apartment of Leung.
I really enjoyed the movie, the acting is amazing and the pace is just right. It manages to balance heavy subjects and light-heartedness and for me it was one of those movies that makes you think about the subject for the next couple of days.