Nextron vs Next.js '--example with-electron'

user_7330316 0
Viewed 992

I'm tempted to create a desktop app with Electron!
Since I have experience with Next.js (React), but haven't worked with Electron.js before (just tested it a long ago), I want to bootstrap my project with a boilerplate/starter/template. However, I'm a bit confused about which option to choose:

I understand that this question seems opinion-based, but I searched and found no technical comparison between them. I also tried comparing npm downloads, GitHub stars, Last commit date & other similar things by myself, but since they're different things (one is an --example & one is a whole repository) I had no luck.

The only thing I found reliable is Strapi! In one of their Tutorials (How to Build a Quiz App with NextJS and Electron, powered by a Strapi backend), they use Nextron to create a desktop app with next.js.

What do you think? Which option is a better choice?

P.S. I use Next.js for many powerful things it has: built-in configurations, out-of-the-box optimizations, easy routing & ... not for the SSR you may think of.

electron next.js
2 Answers

So electronJS is just a js package that uses the chromium-based framework to bring browser-like functionality to the desktop window and is used by NextronJS under the hood.

Ever since the development of electronJS, it was mainly to produce desktop apps via static HTML but you can also incorporate a create-react-app application (build version) for showing dynamic content on the website.

However, NextronJS is pre-configured electron with capability to include features of NextJS for building more feature-packaged desktop apps.

Some of the features of NextronJS include:

1. Introduction of typescript

You can introduce typescript into your NextronJS project by initiating your project in the following manner. Typescript offers an advantage and is highly preferred for building big apps.

`yarn add global nextron`

`nextron init --template {template}`

Where the available list of templates are:

- 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

Example:

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

2. Storage Option

Unlike the electronJS, where the dominant form of storage was either through API calls or other browser storage methods, nextronJS allows a more robust form of data storage and even with NextJS, you can optimize API calls if you prefer cloud storage or while building a web application.

3. Integration with Tailwind/material-ui

NextronJS offers an advantage and a platform for faster development by allowing better integration with styling utility packages. With tailwind or material-UI you can develop decent frontends in much lesser time.

Conclusion

Since NextJS was a massive upgrade from create-react-app, I will suggest go for NextronJS!

I hope I was informative and clear with my answer!

Thanks and take care!

user_177240760

electron-next is used in the Official Next.js Electron Example, so it feels more official to me: https://github.com/vercel/next.js/blob/canary/examples/with-electron/package.json#L28

nextron introduces a 3rd-party dependency to a npm package maintained by @saltyshiomix.

They're both like plugin packages for Next.js that you can add to your project and use to get Electron out-of-the-box, but you will need put a lot of faith in the maintainers.

You can go through the process of configuration of Electron + Next.js yourself, or copy the configs and replicate what these packages do in your own project without introducing a dependency, or simply use one as a dependency and hope the maintainers will be active in keeping these packages up-to-date.

user_41743810
Related