The nextron from casualuser

Build an Electron + Next.js app for speed ⚡

(The screenshot above is a top page of examples/with-javascript-material-ui.)

Support

nextron	next
`v4.x`	`v8.x`
`v2.x` / `v3.x`	`v7.x`
`v1.x`	`v6.x`

👍 JavaScript frontend/backend
👍 TypeScript frontend/backend
👍 TypeScript frontend/Python backend

My Belief for Nextron

Show a way of developing desktop apps only web knowledge
Easy to use
Be transparent (Open to OSS developers)

Otherwise Specified

If you need more performance with Electron, you should see these boilerplates
- szwacz/electron-boilerplate
- chentsulin/electron-react-boilerplate
If you want to use Nextron as production, please take responsibility for your actions
But, if you have any troubles, questions or ideas, I'll support you, I promise

Usage

Install

$ npm install --global nextron@latest

Create Application

To create <MY-APP>, just run the command below:

$ nextron init <MY-APP>

Or, you can use a create-nextron-app command without installing the nextron command globally:

# with npx
$ npx create-nextron-app <MY-APP>

# with yarn
$ yarn create nextron-app <MY-APP>

Create Application with Template

You can use examples/* apps as a template.

To create the examples/with-typescript-material-ui app, run the command below:

# with `nextron`
$ nextron init <MY-APP> --example with-typescript-material-ui

# with npx
$ npx create-nextron-app <MY-APP> --example with-typescript-material-ui

# with yarn
$ yarn create nextron-app <MY-APP> --example with-typescript-material-ui

Run Electron with Development Mode

Run npm run dev, and nextron automatically launches an electron app.

{
  "scripts": {
    "dev": "node nextron/nextron.js"
  }
}

Production Build

Run npm run build, and nextron outputs packaged bundles under the dist folder.

{
  "scripts": {
    "build": "node nextron/nextron.js build"
  }
}

Build Options

To build Windows 32 bit version, run npm run build:win32 like below:

{
  "scripts": {
    "build": "node nextron/nextron.js build",
    "build:all": "node nextron/nextron.js build --all",
    "build:win32": "node nextron/nextron.js build --win --ia32",
    "build:win64": "node nextron/nextron.js build --win --x64",
    "build:mac": "node nextron/nextron.js build --mac --x64",
    "build:linux": "node nextron/nextron.js build --linux"
  }
}

CAUTION: To build macOS binary, your host machine must be macOS!

Build Configuration

Edit package.json#build properties for custom build configuration.

{
  "build": {
    "appId": "com.example.nextron",
    "productName": "My Nextron App",
    "copyright": "Copyright © 2018 Yoshihide Shiono",
    "directories": {
      "output": "dist",
      "buildResources": "resources"
    },
    "publish": null
  }
}

For more information, please check out electron-builder official configuration documents.

Examples

See examples folder for more information.

Or you can start the example app by nextron init <app-name> --example <example-dirname>.

To list all examples, just type the command below:

$ nextron list

examples/custom-build-options

# with `nextron`
$ nextron init my-app --example custom-build-options

# with npx
$ npx create-nextron-app my-app --example custom-build-options

# with yarn
$ yarn create nextron-app my-app --example custom-build-options

examples/custom-server

# with `nextron`
$ nextron init my-app --example custom-server

# with npx
$ npx create-nextron-app my-app --example custom-server

# with yarn
$ yarn create nextron-app my-app --example custom-server

examples/custom-server-nodemon

# with `nextron`
$ nextron init my-app --example custom-server-nodemon

# with npx
$ npx create-nextron-app my-app --example custom-server-nodemon

# with yarn
$ yarn create nextron-app my-app --example custom-server-nodemon

examples/custom-server-typescript

# with `nextron`
$ nextron init my-app --example custom-server-typescript

# with npx
$ npx create-nextron-app my-app --example custom-server-typescript

# with yarn
$ yarn create nextron-app my-app --example custom-server-typescript

examples/ipc-communication

# with `nextron`
$ nextron init my-app --example ipc-communication

# with npx
$ npx create-nextron-app my-app --example ipc-communication

# with yarn
$ yarn create nextron-app my-app --example ipc-communication

examples/parameterized-routing

# with `nextron`
$ nextron init my-app --example parameterized-routing

# with npx
$ npx create-nextron-app my-app --example parameterized-routing

# with yarn
$ yarn create nextron-app my-app --example parameterized-routing

examples/store-data

# with `nextron`
$ nextron init my-app --example store-data

# with npx
$ npx create-nextron-app my-app --example store-data

# with yarn
$ yarn create nextron-app my-app --example store-data

examples/web-worker

# with `nextron`
$ nextron init my-app --example web-worker

# with npx
$ npx create-nextron-app my-app --example web-worker

# with yarn
$ yarn create nextron-app my-app --example web-worker

examples/with-javascript

# with `nextron`
$ nextron init my-app --example with-javascript

# with npx
$ npx create-nextron-app my-app --example with-javascript

# with yarn
$ yarn create nextron-app my-app --example with-javascript

examples/with-javascript-ant-design

# with `nextron`
$ nextron init my-app --example with-javascript-ant-design

# with npx
$ npx create-nextron-app my-app --example with-javascript-ant-design

# with yarn
$ yarn create nextron-app my-app --example with-javascript-ant-design

examples/with-javascript-emotion

# with `nextron`
$ nextron init my-app --example with-javascript-emotion

# with npx
$ npx create-nextron-app my-app --example with-javascript-emotion

# with yarn
$ yarn create nextron-app my-app --example with-javascript-emotion

examples/with-javascript-material-ui

# with `nextron`
$ nextron init my-app --example with-javascript-material-ui

# with npx
$ npx create-nextron-app my-app --example with-javascript-material-ui

# with yarn
$ yarn create nextron-app my-app --example with-javascript-material-ui

examples/with-typescript

# with `nextron`
$ nextron init my-app --example with-typescript

# with npx
$ npx create-nextron-app my-app --example with-typescript

# with yarn
$ yarn create nextron-app my-app --example with-typescript

examples/with-typescript-emotion

# with `nextron`
$ nextron init my-app --example with-typescript-emotion

# with npx
$ npx create-nextron-app my-app --example with-typescript-emotion

# with yarn
$ yarn create nextron-app my-app --example with-typescript-emotion

examples/with-typescript-less

# with `nextron`
$ nextron init my-app --example with-typescript-less

# with npx
$ npx create-nextron-app my-app --example with-typescript-less

# with yarn
$ yarn create nextron-app my-app --example with-typescript-less

examples/with-typescript-material-ui

# with `nextron`
$ nextron init my-app --example with-typescript-material-ui

# with npx
$ npx create-nextron-app my-app --example with-typescript-material-ui

# with yarn
$ yarn create nextron-app my-app --example with-typescript-material-ui

examples/with-typescript-python-api

# with `nextron`
$ nextron init my-app --example with-typescript-python-api

# with npx
$ npx create-nextron-app my-app --example with-typescript-python-api

# with yarn
$ yarn create nextron-app my-app --example with-typescript-python-api

(Note: When working with the with-typescript-python-api example, see the example's readme file for python setup details)

Develop

Basic

$ git clone https://github.com/saltyshiomix/nextron.git
$ cd nextron
$ yarn
$ yarn dev # default is examples/with-javascript-emotion

Developing `examples/*`

$ yarn dev <EXAMPLE-FOLDER-NAME>

create-nextron-app - Create Nextron (Electron + Next.js) apps in one command ⚡
Nuxtron - ⚡ Electron + Nuxt.js ⚡

casualuser / nextron Goto Github PK

nextron's Introduction

Support

My Belief for Nextron

Otherwise Specified

Usage

Install

Create Application

Create Application with Template

Run Electron with Development Mode

Production Build

Build Options

Build Configuration

Examples

Develop

Basic

Developing examples/*

Related

nextron's People

Contributors

Watchers

Recommend Projects

Recommend Topics

Recommend Org

Developing `examples/*`