Open source contributions: Next.js Korean docs, es-toolkit, Frontend Fundamentals

Recently, while migrating a React portfolio project I built a year ago to Next.js, I referred to the official docs to fill in what I didn't know about Next.js and to get the information I needed.

The official docs aren't available in Korean, though, so I naturally came across the Next.js Korean docs, which are provided in Korean. Along the way, I found a problem where images were broken on every page, and I was able to fix it.

Pull Request link:

https://github.com/luciancah/nextjs-ko/pull/158

[no-issue] fix: update the baseUrl of the external image component by umsungjun · Pull Request #158 · luciancah/nextjs-ko

What I contributed:

While reading the Next.js Korean docs, I found that images were broken on every page.
I fixed it by changing the baseUrl of the <ExternalImage /> component, which is used globally.

Trying to contribute to Toss open source

After my Pull Request to the Next.js Korean docs was accepted, I felt very rewarded, and my wish to contribute to more open source projects grew.

I went on to open Pull Requests to two projects from Toss (a Korean fintech company) that I had been interested in, the open source library es-toolkit and the frontend code guide Frontend Fundamentals. They are in progress now.

es-toolkit contribution (in progress)

Pull Request link:
https://github.com/toss/es-toolkit/pull/1125

feat(isString): replace typeof checks with isString utility by umsungjun · Pull Request #1125 · toss/es-toolkit

What I contributed:

I replaced the typeof value === 'string' checks used for string type checks in the existing code with the isString utility function that es-toolkit provides.
By switching the raw string type checks in the related benchmark tests and internal code to the isString() function, I improved code readability and consistency across the whole codebase.

Frontend Fundamentals contribution (in progress)

Pull Request link:
https://github.com/toss/frontend-fundamentals/pull/207

docs: replace image with copyable code block in submit-button.md by umsungjun · Pull Request #207 · toss/frontend-fundamentals

What I contributed

I changed the image-based example code into a copyable code block, which made it more consistent with the other pages and made the document easier to read.
I edited the text that explains the code to fit the flow of the document, keeping it short and easy to understand.

Frontend Fundamentals contribution (accepted)

Pull Request link:
https://github.com/toss/frontend-fundamentals/pull/211

fix broken image path in README.md by umsungjun · Pull Request #211 · toss/frontend-fundamentals

What I contributed

To fix an image that wasn't rendering properly in README.MD on GitHub, I changed the image path from ./public/images/ff-meta.png to ./images/ff-meta.png.

Closing thoughts

My PR to the Next.js docs has already been accepted and merged in, but the Toss PRs are still under review. It's unclear whether they'll be merged, but I'm hoping they go in and help a lot of users.

This experience reminded me again how rewarding it is to contribute to open source, and how much it helps me grow as a developer. I plan to keep paying attention to different open source projects and keep taking on challenges, so I can become a developer who helps many other developers.