Tag

frontend

  1. Accessibility conference Fukuoka - attendance notes

    Notes from the sessions at the Accessibility Conference held in Fukuoka.

    • Frontend
    • a11y
  2. Using Playwright visual regression testing to safely replace a CSS library

    How I used Playwright visual regression testing to safely migrate the CSS library on my blog.

    • Frontend
    • Testing
  3. Debugging elements that only show when focused in React with Chrome DevTools

    How to debug DOM elements that only appear when focused using Chrome DevTools

    • Frontend
  4. Adding markuplint to a React project

    How to add markuplint to a React project for HTML syntax checking

    • Frontend
    • React
  5. Checking and improving accessibility on my personal blog

    I used the accessibility checklist published by freee to check and improve the accessibility of my personal blog.

    • Frontend
    • Accessibility
  6. A practice problem for learning React performance improvement

    I had a chance to improve React performance at work, so I made a practice problem based on that experience.

    • Frontend
    • React
    • Performance
  7. Changing checkbox design with accessibility in mind

    How to implement a custom Checkbox with accessibility considerations.

    • Frontend
    • Testing
  8. Creating utility functions to wrap msw

    Implementing useful utility functions by wrapping msw.

    • Frontend
    • Testing
  9. msw not intercepting network requests in Node.js 18

    How to fix the problem where msw does not intercept network requests in Node.js 18

    • Frontend
    • Testing
  10. Introduction to frontend TDD starting from bug fixes

    This article is for Day 22 of the YAMAP Engineer Advent Calendar 2021. I am currently reading "Test-Driven Development" (TDD) in a book club. Starting TDD from bug fixes worked well for me, so I want to share the experience.

    • Frontend
    • Testing
  11. What I think about when doing frontend code reviews

    This article is for Day 10 of the YAMAP Engineer Advent Calendar 2021. Code review is hard. Even after 6 years, I still can't say with confidence that I'm good at it.

    • Frontend
  12. Writing unit tests by thinking about component inputs and outputs

    When writing frontend component unit tests for the first time, it can be hard to know "what to test." This article explains how thinking about component inputs and outputs helps you understand what to test.

    • React
    • Frontend
    • Testing
  13. Truncating multi-line text and -webkit-box

    A quick look at -webkit-box, which is used when truncating multi-line text.

    • Frontend
    • CSS
  14. Fix auto-zoom on form fields in iOS

    Solutions for the auto-zoom behavior that happens when focusing on form input elements in iOS.

    • Frontend
  15. Understanding ESLint properly

    I always set up ESLint at the start of a project and then rarely touch it again. Since I often forget what each setting does, I summarized the purpose of each configuration option and plugin.

    • Frontend
  16. Improving the performance of my Next.js blog

    During the year-end holidays, I replaced this tech blog from GatsbyJS to Next.js. After the replacement, the Lighthouse performance score dropped, so I investigated the cause and made improvements.

    • Frontend
    • Next.js
    • Performance
  17. Building Othello with WebAssembly

    I implemented an Othello game algorithm in WebAssembly to experience how much faster it is compared to JavaScript.

    • Frontend
  18. Building an authenticated site with GatsbyJS

    Notes from following a tutorial on implementing authentication with GatsbyJS.

    • Frontend
    • GatsbyJS
  19. Issue with loading icons in Material-UI + webpack

    The problem where the way you import the Material-UI icons package affects build time in a Material-UI + webpack environment.

    • Frontend
  20. Using the Storage object in Next.js

    How to use the browser's Storage object in Next.js.

    • Frontend
    • React
    • Next.js
  21. Formatting numbers with a fixed number of decimal places in JavaScript

    How to format numbers with a specified number of decimal places in JavaScript.

    • Frontend
  22. Should you use a form tag or a div tag for forms?

    Comparing the form tag and the div tag for form implementation

    • Frontend
  23. Understanding ownership and borrowing in Rust

    Understanding ownership and borrowing in Rust.

    • Frontend
    • Rust
  24. HTTP response headers for web security

    HTTP response headers you should know about when thinking about security in frontend development.

    • Frontend
    • Security
  25. Adding Google Analytics via Google Tag Manager to a Gatsby blog

    How to add Google Analytics via Google Tag Manager to a Gatsby blog

    • Frontend
    • GatsbyJS
  26. Setting up code syntax highlighting in gatsby-starter-blog

    How to set up code syntax highlighting in gatsby-starter-blog

    • Frontend
    • GatsbyJS
  27. Starting an engineering blog with GatsbyJS + Netlify CMS

    Starting an engineering blog with GatsbyJS + Netlify CMS

    • Frontend
    • GatsbyJS