DEV Community

Masa Kudamatsu profile picture

Masa Kudamatsu

Self-taught web app designer/developer, currently building an app to save rich text notes about places on Google Maps.

Location Kyoto, Japan Joined Joined on  github website twitter website
Four Year Club
Top 7
Writing Debut
Three Year Club
1 Week Community Wellness Streak
Two Year Club
One Year Club
4 Week Writing Streak
Vanilla JS carousel that is accessible, swipeable, infinite-scrolling, and autoplaying

Vanilla JS carousel that is accessible, swipeable, infinite-scrolling, and autoplaying

33
Comments 5
27 min read

Want to connect with Masa Kudamatsu?

Create an account to connect with Masa Kudamatsu. You can also sign in below to proceed if you already have an account.

Already have an account? Sign in
Responsive images: DIY implementation in 6 steps

Responsive images: DIY implementation in 6 steps

2
Comments
9 min read
Day 26: Integrating Google Maps search with a React app

Day 26: Integrating Google Maps search with a React app

2
Comments
29 min read
Day 25: Adding Google Maps autocomplete search to a React app

Day 25: Adding Google Maps autocomplete search to a React app

5
Comments
26 min read
Day 24: Making autocomplete search accessible for React apps with Downshift

Day 24: Making autocomplete search accessible for React apps with Downshift

Comments
13 min read
Day 23: Animating the closing of a popup as if button ripple effect wipes it away

Day 23: Animating the closing of a popup as if button ripple effect wipes it away

2
Comments
17 min read
Day 22: Using container transform pattern to animate the appearance of a search box

Day 22: Using container transform pattern to animate the appearance of a search box

Comments
11 min read
Day 21: Animating transitions for a React app without external libraries

Day 21: Animating transitions for a React app without external libraries

2
Comments
10 min read
Day 20: Toggling a search box for keyboard users with React

Day 20: Toggling a search box for keyboard users with React

1
Comments
14 min read
Day 19: Styling a popup like clouds

Day 19: Styling a popup like clouds

Comments
11 min read
Day 18: Building a close button with ripple effect as a React component

Day 18: Building a close button with ripple effect as a React component

6
Comments
17 min read
Day 17: Styling a search box like Google's

Day 17: Styling a search box like Google's

6
Comments 1
17 min read
Day 16: Icon buttons should be labelled with aria-label

Day 16: Icon buttons should be labelled with aria-label

5
Comments
6 min read
Glassmorphism for Firefox

Glassmorphism for Firefox

8
Comments
23 min read
Day 15: Showing user's direction of movement on embedded Google Maps

Day 15: Showing user's direction of movement on embedded Google Maps

6
Comments
9 min read
Day 14: Tracking user location on embedded Google Maps

Day 14: Tracking user location on embedded Google Maps

4
Comments 2
10 min read
Day 13: Flashing tapped button while user is waiting (with React and Styled Components)

Day 13: Flashing tapped button while user is waiting (with React and Styled Components)

4
Comments
11 min read
Day 12: Showing user location on embedded Google Maps (with Geolocation API and React)

Day 12: Showing user location on embedded Google Maps (with Geolocation API and React)

5
Comments
18 min read
Day 11: web app vs native app on location services

Day 11: web app vs native app on location services

3
Comments
7 min read
Day 10: Fixing a bug that renders buttons in dark mode but embedded Google Maps in light mode

Day 10: Fixing a bug that renders buttons in dark mode but embedded Google Maps in light mode

5
Comments
8 min read
Day 9: Picking the dark-mode color palette for web app buttons logically

Day 9: Picking the dark-mode color palette for web app buttons logically

6
Comments
10 min read
Day 8: Positioning buttons over embedded Google Maps

Day 8: Positioning buttons over embedded Google Maps

6
Comments
18 min read
Day 7: Making buttons look like "clouds" for embedded Google Maps

Day 7: Making buttons look like "clouds" for embedded Google Maps

9
Comments 3
26 min read
Day 6: Using Google Fonts as Google Maps place markers

Day 6: Using Google Fonts as Google Maps place markers

2
Comments
30 min read
Day 5: Switching embedded Google Maps into custom dark mode after 6pm

Day 5: Switching embedded Google Maps into custom dark mode after 6pm

6
Comments
24 min read
Day 4: Customizing Google Maps color scheme (and its place label visibility)

Day 4: Customizing Google Maps color scheme (and its place label visibility)

2
Comments
22 min read
Day 3: Visualizing design concept with mood boards

Day 3: Visualizing design concept with mood boards

Comments
9 min read
Day 2: Finding design concept to drive UI design process

Day 2: Finding design concept to drive UI design process

1
Comments
11 min read
Day 1: Creating SaaS to solve my own problem

Day 1: Creating SaaS to solve my own problem

2
Comments
9 min read
Don't nest <nav> inside <header>. Do nest the hamburger menu button inside <nav>.

Don't nest <nav> inside <header>. Do nest the hamburger menu button inside <nav>.

32
Comments 8
7 min read
Mastering the art of `alt` text for images

Mastering the art of `alt` text for images

25
Comments 5
11 min read
Making embedded YouTube videos (1) responsive, (2) accessible, and (3) less YouTube-looking

Making embedded YouTube videos (1) responsive, (2) accessible, and (3) less YouTube-looking

8
Comments 1
4 min read
Choosing semantic HTML mark-up for italic text, guided by Chicago Manual of Style

Choosing semantic HTML mark-up for italic text, guided by Chicago Manual of Style

4
Comments 1
6 min read
Everything about `<hr>`: When to use it and how to style it

Everything about `<hr>`: When to use it and how to style it

18
Comments 1
7 min read
Everything about `<abbr>`: when to use it and how to style it in small caps

Everything about `<abbr>`: when to use it and how to style it in small caps

11
Comments 3
14 min read
JSON web tokens are NOT meant for authenticating the same user repeatedly: Use session tokens instead

JSON web tokens are NOT meant for authenticating the same user repeatedly: Use session tokens instead

451
Comments 53
7 min read
How to handle invalid user inputs in React forms for UX design best practices

How to handle invalid user inputs in React forms for UX design best practices

15
Comments
14 min read
4 gotchas when setting up Google Maps API with Next.js and ESLint

4 gotchas when setting up Google Maps API with Next.js and ESLint

18
Comments 3
10 min read
Which fallback fonts should we choose to make FOUT less jarring

Which fallback fonts should we choose to make FOUT less jarring

6
Comments 1
6 min read
Safari doesn't render self-hosted Google Fonts

Safari doesn't render self-hosted Google Fonts

2
Comments 1
5 min read
Loading Google Fonts and any other web fonts as fast as possible in early 2021

Loading Google Fonts and any other web fonts as fast as possible in early 2021

25
Comments 3
8 min read
Deploy a static Next.js site to Netlify (with Git LFS)

Deploy a static Next.js site to Netlify (with Git LFS)

1
Comments
2 min read
Definitive edition of "How to Favicon" in 2023

Definitive edition of "How to Favicon" in 2023

173
Comments 35
21 min read
React Hooks to scroll-animate a top app bar in Material Design style

React Hooks to scroll-animate a top app bar in Material Design style

4
Comments
9 min read
How to use HTML Canvas with React Hooks

How to use HTML Canvas with React Hooks

22
Comments
7 min read
Beyond create-react-app: Why you might want to use Next.js or Gatsby instead

Beyond create-react-app: Why you might want to use Next.js or Gatsby instead

66
Comments 4
12 min read
loading...