Electron12분
Next.js와 Electron 비교: 같은 React, 다른 실행 구조
Next.js와 Electron은 둘 다 JavaScript와 TypeScript, React 생태계를 활용합니다. 화면만 만들 때는 꽤 비슷해 보입니다. 컴포넌트를 나누고 상태를 관리하며, npm 패키지를 설치하고 개발자 도구로 화면을 확인하는 흐름도 익숙합니다.
Next.js와 Electron은 둘 다 JavaScript와 TypeScript, React 생태계를 활용합니다. 화면만 만들 때는 꽤 비슷해 보입니다. 컴포넌트를 나누고 상태를 관리하며, npm 패키지를 설치하고 개발자 도구로 화면을 확인하는 흐름도 익숙합니다.
지도 위에 H3 육각 격자를 얹은 화면을 만들었습니다. 셀을 누르면 인접한 여섯 셀이 함께 칠해지는, 영업 구역을 나눠 보는 화면입니다.
문서 AI 기능을 로컬에서 완성하고 운영에 배포했을 때, 답변 자체는 정상인데 화면의 느낌이 완전히 달라졌습니다. 스트리밍 답변은 한꺼번에 나타났고, 전체 화면 패널은 작은 섹션 안에 갇혔으며, 모달이 열리자마자 배경 스크롤 잠금이 풀렸습니다.
한국어, 영어, 일본어, 중국어를 직접 제공하는 React 랜딩 페이지에서 예상하지 못한 문제가 생겼습니다. Chrome이 띄운 "이 페이지를 번역하시겠습니까?" 제안을 수락하면 번역이 시작되는 듯하다가, 잠시 뒤 사이트의 "일시적인 오류가 발생했습니다" 화면으로 바뀌었습니다.
개발하면서 가장 당황스러운 상황 중 하나가 내 브라우저에서는 되는데 다른 기기에서만 안 되는 경우입니다. 특히 화면이 아예 하얗게 나오면 어디서부터 봐야 할지 막막합니다. 콘솔도 못 보고 에러 메시지도 없습니다.
웹 서비스를 만들 때 기술 스택은 단순한 취향 문제가 아닙니다. 개발 속도, 유지보수, 확장성, 채용 가능성, 운영 비용까지 영향을 줍니다. 작은 팀이나 1인 개발 조직이라면 특히 “적은 인원으로 오래 가져갈 수 있는 조합”이 중요합니다.