브라우저 렌더링 과정 Reflow, Repaint
HTML, CSS, JavaScript로 만들어진 웹 페이지가 브라우저에서 어떻게 화면에 그려지는지 그 과정을 상세히 설명합니다.
frontend2025-02-02 09:38
Tailwind CSS vs styled-components
최근에는 사용할 수 있는 스타일링 도구가 많습니다. 본 글에서는 보편적으로 사용하는 Tailwind CSS와 Styled-components의 특징, 장단점, 그리고 프로젝트 상황에 따른 선택 기준을 설명합니다.
react2025-01-29 11:12
Next.js 15에서 PWA 설정하여 블로그 글 캐싱하기
PWA는 웹 애플리케이션을 네이티브 앱처럼 동작하게 만드는 기술입니다. 본 글에서는 Next.js 15에서 Progressive Web App(PWA)을 설정하는 방법을 설명합니다.
nextjs2025-01-16 10:47
Next.js에서 Dark/Light 테마 기능 구현 (화면 깜빡임 없이)
최근 웹 사이트에서 거의 필수적으로 다크 테마를 구현합니다. 본 글에서는 Next.js에서 화면 깜빡임 없이 다크/라이트 테마를 구현하는 방법에 대해 설명합니다.
nextjs2025-01-13 12:55
React에서 FSD 프로젝트 구조 적용해보기
프로젝트를 시작할 때마다 항상 폴더 구조를 고민합니다. 프론트 영역은 특히 빠르게 변화하다보니 백엔드 영역과 다르게 보편적으로 사용되는 폴더 구조가 없습니다. 여러가지 프로젝트 구조가 있지만, 본 글에서는 FSD(Feature-Sliced Design)라는 아키텍처 패턴을 소개합니다.
react2025-01-10 12:44
React의 useEffect와 useLayoutEffect 차이
React 훅에는 useEffect와 useLayoutEffect가 있습니다. 비슷하지만 다른 useEffect와 useLayoutEffect 차이에 대해 설명하고 어떤 경우에 사용하면 좋을지 설명합니다.
react2025-01-09 13:28
Next.js 15로 Github Blog를 만들 수 있을까?
Github Pages와 Next.js 15로 블로그를 만들기 위한 기술 검토와 과정을 소개합니다. 더 나아가 SEO를 높이기 위해 sitemap.xml과 robots.txt를 생성하는 방법 또한 소개합니다.
nextjs2025-01-07 11:13
AD