Debugging Layout Shift
Notes from debugging and fixing layout shift issue caused by web fonts.
Armno's blog
Notes from my thoughts and learnings.
Latest posts
Things I like about Raycast
My take on Raycast as a frontend developer: how I use it and how I like it.
Low Profile Wireless Corne Keyboard
Notes from building my wireless Corne keyboard with low-profile Kailh Choc v1 switches
Adding Videos to Keystatic Content with Astro
My notes on building a custom component in Keystatic using Content Components feature for my Astro blog
Dark Mode
I recently added the dark mode support to this blog. Here's what I have done and have learned from it.
Change VSCode Sidebar Font
Changing the sidebar font in VSCode can be done only via extensions. I'm using APC extension to achieve that.
Building a Wireless Corne Keyboard
Upgrading my Corne split keyboard into a wireless version with Nice!nano.
Exploring Keystatic
Keystatic is a CMS to manage Markdown content. In this blog post, I noted down how I integrate Keystatic to my Astro blog.
บันทึกการทำ Corne Keyboard
บันทึกการทำ Corne (crkbd) keyboard ซึ่งเป็น mechanical split keyboard ตัวแรกของผมครับ
Building a Corne Mechanical Split Keyboard
Notes from building my mechnical split keyboard - The Corne (crkbd) v3. This post covers the process of building this keyboard, and what I have learned along the way.
My VSCode setup for 2023
This is how I setup and use my VSCode for 2023 - settings, themes, keyboard shortcuts, etc.
Creating a video poster image with ffmpeg
A quick way to extract the video's first frame as an image to use with `poster` HTML attribute
รีวิว Canyon Endurace CF SL (2018)
เฟรม disc brake แนว endurance ของ Canyon ที่จะปั่นชิวๆ หรือซิ่งๆ ก็ได้เหมือนกัน
Fixing a weird Bug: Cannot type in Safari's Input Fields
A small thing I learned about `user-select` CSS property.
Optimize Images in a Pull Request with GitHub Actions
Automatically optimize images in a pull request with Image Actions
Lazy-load nvm to Reduce ZSH's Startup Time
Lazy-loading nvm in `.zshrc` can make zsh starts faster when open a new terminal window
Moving an App to Vercel
I migrated an app from DigitalOcean server to Vercel (formerly Zeit Now) to use their hosting service and serverless functions.
ลอง Lube Mechanical Keyboard Switch
ลอง lube gateron yellow switch ของ mechanical keyboard ครั้งแรกด้วย Tribosys 3203 กับ Krytox 205g0 ได้ผลที่น่าประทับใจพอสมควร
ใช้ประโยชน์จากความขี้เกียจ
ถ้าไม่อยากทำงานซ้ำๆ ก็ต้องหาเครื่องไม้เครื่องมือมาช่วย ในการจัดระเบียบไฟล์ content ของบล็อก
Customizing Keyboard Firmware for GH60
A note to my future self on customizing firmware for a custom mechanical keyboard built with GH60 PCB
Setting up Cypress for an Angular Project
Use Cypress (cypress.io) to implement automated testing for an Angular project
Creating a URL with HttpParams in Angular
Today I learned how to create a URL with query string parameters with HttpParams class in Angular
เลิกใช้ Google Analytics
เลิกใช้งาน Google Analytics และเปลี่ยนไปใช้ Netlify Analytics แทน
TIL: Using fzf to search in command history
Use fzf - the fuzzy finder to search for a command in history
Inline CSS
บางที critical CSS กับ loadCSS ก็อาจจะไม่ได้จำเป็นสำหรับทุกคน
TIL: Convert a PNG to a JPG with sips
Today I learned how to convert a PNG image to a JPG image from the command line with sips command
VSCode: Tree Indent Settings
ทำให้ File Explorer (Sidebar) ของ VSCode ดูง่ายขึ้นอีกนิด ด้วยการเพิ่มค่า indent size หรือจะเอาไว้แกล้งเพื่อนก็ได้ครับ
TIL: Creating Git Commit Message Template
Today I learned how to create a template for commit message it Git
แกะกล่อง Canyon Endurace CF SL
แกะกล่องเฟรมจักรยาน Canyon Endurace CF SL Disc ส่งตรงจาก Canyon Germany
ทำ Keyboard Plate จากแผ่น Acrylic
บันทึกการลองทำ plate ของ mechanical keyboard จากแผ่น acrylic หนา 2mm
Renaming an Angular Component
TL;DR - There is still no easy way to rename a component
fzf - The Fuzzy Finder
fzf is a command-line fuzzy finder, and is my new favorite thing.
TIL: Using Multiple SSH Keys
Today I learned how to use multiple SSH keys on the same computer
Git Commands ที่ใช้บ่อยๆ
รวม Git Commands ที่ผมต้องใช้ทำงานอยู่เป็นประจำ
Hugo: Resize รูปด้วย Image Processing
Hugo มาพร้อมกับฟีเจอร์ Image Processing ที่ช่วยย่อรูป/crop รูปเป็นขนาดต่างๆ ได้จากรูปต้นฉบับที่เราเตรียมไว้รูปเดียว
Mechanical Keyboard จาก DZ60RGB
ทำ mechanical keyboard จาก DZ60RGB PCB ที่เป็น Hot-swappable ด้วย
เขียนบล็อก 10 ปี
บันทึกครบรอบ 10 ปี ของ armno.in.th ที่มาที่ไป สิ่งที่ได้พบเจอระหว่างทาง ปัจจุบัน และอนาคต
ลองใช้ IntersectionObserver โหลด Disqus Comments
ใช้ IntersectionObserver เพื่อ lazy load Disqus comment เมื่อ scroll ลงไปถึงด้านล่างของโพสต์
แนะนำหนังสือ Better Web Typography for a Better Web
หนังสือ Better Web Typography for a Better Web เขียนโดย Matej Latin เป็นหนังสืออีกเล่มที่อยู่บนชั้นหนังสือเล็กๆ ที่บริษัท ผมยืมมาอ่านแล้วรู้สึกชอบจึงอยากจะแนะนำครับ
ลองทำ mechanical keyboard แบบไม่ใช้ plate
ลองแก้ layout ของ mechanical keyboard ขนาด 60% ที่ใช้อยู่ ให้มีปุ่มลูกศร (arrows keys) พร้อมกับ split spacebar
บันทึกการทำ Custom Mechanical Keyboard ภาค 2
custom mechanical keyboard อีก 2 ตัวล่าสุดที่ทำ จากแผงวงจร DZ60 เป็น keyboard ขนาด 60%
รีวิว: สั่งซื้อจักรยานจาก Canyon
ขั้นตอนการสั่งซื้อจักรยาน Canyon ออนไลน์ด้วยตัวเองจาก canyon.com รวมถึงการนำเข้าและเสียภาษีอย่างละเอียด
Lazy Load รูปภาพด้วย LazyLoad library
การใช้ lazy loading กับไฟล์จำพวกรูปภาพ เป็นเทคนิคที่นำมาใช้ได้ง่าย และส่งผลดีอย่างเห็นได้ชัด ในโพสต์นี้ผมนำ library ที่ชื่อว่า LazyLoad มาใช้งานกับบล็อกนี้ครับ
Hugo: สร้าง custom shortcode
สร้าง custom shortcode ไว้ใช้เพื่อประหยัดเวลา ไม่ต้องพิมพ์ HTML เต็มๆ
Hugo: สร้าง template ของ front matter ด้วย Archetypes
ใช้ประโยชน์จาก archetype ใน hugo สำหรับสร้าง template ของ front matter เวลาสร้างโพสต์ใหม่
ทดสอบฟีเจอร์ก่อน deploy ด้วย Netlify Deploy Preview
Netlify มีฟีเจอร์หนึ่งชื่อว่า Deploy Preview ที่ทุกครั้งที่เราสร้าง pull request (หรือ merge request สำหรับ GitLab) Netlify จะสร้าง URL สำหรับ pull requets นั้นให้โดยอัตโนมัติ ทำให้เราสามารถเช็คดูก่อนได้โดยที่ยังไม่ต้อง merge branch นั้น เข้า production branch
Deploy Blog อัตโนมัติด้วย Netlify
แทนการใช้ Docker กับ CircleCI เพื่อ deploy blog แบบอัตโนมัติด้วยการใช้ continuous delivery ของ Netlify
Update Blog อัตโนมัติด้วย Docker และ CircleCI
ลองใช้ Docker กับ CircleCI เพื่อ deploy blog แบบอัตโนมัติทุกครั้งที่ push ไปที่ GitHub repo
แนะนำหนังสือ White Hat UX
ที่ออฟฟิศมีหนังสือ White Hat UX ที่สั่งซื้อมาจาก Smashing Magazine ผมหยิบมาอ่านแล้วรู้สึกว่าน่าสนใจดี เลยอยากจะแนะนำครับ
จาก Jekyll สู่ Hugo
บันทึกเรื่องราว การเปลี่ยน static site generator ของบล็อกนี้ จาก Jekyll เป็น Hugo ครับ