DEV Community

Shiono Yoshihide
Shiono Yoshihide

Posted on

Nextron v4 : Electron + Next.js with ease

Today zeit released Next.js v8, so Nextron came to v4 :)

https://nextjs.org/blog/next-8

What is Nextron?

Nextron is an electron app generator, which includes Next.js and it can handle electron renderer process with Next.js easily.



# install nextron
$ npm install --global nextron@latest


Enter fullscreen mode Exit fullscreen mode

There are 13 example templates for now:



# list all templates
$ nextron list

  Available examples:

    - custom-build-options
    - custom-server
    - custom-server-nodemon
    - custom-server-typescript
    - ipc-communication
    - parameterized-routing
    - store-data
    - with-javascript
    - with-javascript-ant-design
    - with-javascript-material-ui
    - with-typescript
    - with-typescript-less
    - with-typescript-material-ui

  USAGE

    $ nextron init my-app [--template example_folder_name]

  If you want to use "with-typescript-material-ui", just type the command below:

    $ nextron init my-app --template with-typescript-material-ui


Enter fullscreen mode Exit fullscreen mode

The usage is so simple:



# generate an example
$ nextron init my-app --template with-typescript-material-ui

# install dependencies
$ cd my-app
$ yarn (or "npm install")

# development mode
$ yarn dev (or "npm run dev")

# production build
$ yarn build (or "npm run build")


Enter fullscreen mode Exit fullscreen mode

example image

My Belief for Nextron

  1. Show a way of developing desktop apps only web knowledge
    • always maintenanced 👍
  2. Easy to use
    • run it one command
    • build it one command
  3. Be transparent (Open to OSS developers)
    • shows all sources like webpack.config.js, electron production build configs and so on

Nextron's statuses

  • 650+ commits over the last 9 months
  • 200+ releases (npm publish)
  • 100+ stargazers on GitHub
  • listed on awesome-nextjs
  • PRs are welcome!

By the way...

I'm working in Tokyo(Japan) and developing .NET or JavaScript(TypeScript) apps which use AI(neural network) translation machine.

Our mission is to help all people who study foreign languages.

Anyone want to join us?

Thank you for your reading my article :)

Top comments (4)

Collapse
 
lvcasgm profile image
Lucas Gil Melby

Awesome project! This is EXACTLY what I was looking for!!

One question, how can I modify the value of process.env.NODE_ENV? Where should I place the .env file?

Collapse
 
didierganthier profile image
Ganthier Didier

Thanks for this article. How can I change the app icon?

Collapse
 
saisridhar783 profile image
Akula Sai Sridhar

How to publish a nextron app?

Collapse
 
ronyevernaes profile image
Ronye Vernaes

Hi... That's cool... Where can I try your product? I would like to improve my hungarian!