NextJS + Electron 세팅

설치

typescript를 사용하는 기본 basic은 아래와 같은 세팅

npx create-nextron-app my-app --example basic-lang-typescript

만약 chakra ui를 함께 사용하려면 아래와 같은 세팅

npx create-nextron-app my-app --example with-chakra-ui

그리고 "npm install"을 한번 해야함

실행

npm run dev 명령어로 실행시 아래와 같다.

폴더 구조

• main : 서버에서 실행되는 파일을 모아놓은 프로세스
• renderer : 클라이언트에서 실행되는 파일을 모아놓은 프로세스
• public : 이미지, 영상 등 Static한 파일이 저장되는 폴더

Electron은 main과 renderer 두 개의 프로세스에 의해 동작하며,
main은 데이터베이스 통신, 파일 처리 등 서버에서 실행되는 파일을 renderer은 실제 화면에 그려지는 page 파일로 구성.

간단한 라우팅 테스트