Node-Webkit and AngularJS package apps: require not defined - node.js

I am using https://github.com/mllrsohn/grunt-node-webkit-builder to package my node-webkit app which is built using AngularJS.
The app works fine on MAC when I build from Sublime Text. But when I package the app using any packaging tool, I get the error saying "require is not defined". What am I missing?
For more context, I have a services layer which is written in Node.js using express. The Angular project calls Node.js APIs and renders the content. I am using a SQLite3 DB. Which is the best way to package such apps? I am alright with writing an installer starts Node.js server separately.

You'll always get a "require is not defined" error if you don't use a node-webkit environement for developpement in Windows. You can use nodebob for developpement environement :
You have to put your html files into nodebob\buildTools\nw and then run nw.exe
Just reload it after your changes

Related

Does the default Reactjs application use node.js?

This may be a dumb question, but is the default react app (created using npm create-react-app my-app) using node.js? I am confused because in my web development class at university, I had to download node.js to create react applications. However, I didn't have to do anything like creating a server or initiating a node.js file, which is described in w3school's node.js tutorial. Because of this, I found out that I don't even really know what node is used for, besides downloading packages like redux and whatnot.
create-react-app uses node.js for all of its dev tooling. Likewise, a lot of the tools you'll use in the React ecosystem (like webpack, prettier, npm), all run on top of node.js as well).
You'll most probably build your react app to a static file, in which case the production output will not require node.js, it will be html and javascript assets that can be served directly to a client.
Hope that helps! Let me know if you have other specific questions
Node.js is used for server-side while React.js is for the front-end part. So, no, you don't need Node.js.
Under development mode, yes. Create react app runs NodeJs with Webpack Dev Server to allow you get feedback when modifing files, start or stop the server.

Reactjs + Electron + Nodejs

I've been researching for long time but haven't found what I need. Maybe here someone can help me out.
What I want:
I'm trying to create an application that will run inside electron. Both frontend and backend should be encapsulated within a single executable, so I was thinking React js and Nodejs would be a good option.
But it's not as simple as I thought. Found a good boilerplace for reactjs https://github.com/electron-react-boilerplate/electron-react-boilerplate but I have no idea how I could encapsulate nodejs as a backend to it.
It'd also somehow would need to be integrated with the release package and so on...
Additionally I'd need to have a webserver that will run on localhost:[port] when you launch the application.
Technical Summary:
So basically:
Electron with React js - as the application 'face'
Nodejs - as the backend of the application
Webserver running locally - (using react js).
In the application, I would put link to the pages that is served by that locally running reactjs web app.
Hope I was clear. And I really hope someone can help me out.
Thanks!!!
as you know the serverside part is separate from front end.you can lunch react electron together like this article https://flaviocopes.com/react-electron/ .but serverside must start to stand alone . you could use pm2 for launching them.http://pm2.keymetrics.io/
lets talk about electron. what is electron?
according to electronjs.org :
Electron is an open source library developed by GitHub for building
cross-platform desktop applications with HTML, CSS, and JavaScript.
Electron accomplishes this by combining Chromium and Node.js into a
single runtime and apps can be packaged for Mac, Windows, and Linux.
so the electron is a tool for creating desktop applications.it uses chromium engine for accessing resources of the operating system level. but the intention of that is creating apps not a serverside job.
if you have some needs and logics that must handle in a server you should be considering that. otherwise, read about serverless applications.

Create a build for Node.js (fastify) server to electron app

I am using node js 10.15.0 along with fastify server int it.
I am also using normal public folder shared in the project.
Below is the project hierarchy.
NOTE: This code when started, starts as a standalone server which also servers UI.
I tried electron-packager/ electron-builder but I am not getting desired build as executable like .exe etc.
Question:
Can anyone please guide me through how can I achieve creating a build from node.js pure server code using fastify.

Angular + Electron app: query web API or DataBase according to deskop or web mode

I would like to build an app using Angular + Electron. My app should be able to run both on desktop and browser platforms. I'm considering to use angular-electron starter kit (but I'm open to other possibilities).
What concerns my is the way I read and write data. The data must be stored in a MySQL database. Ideally I would like to:
make the app call an api when NOT running on Electron (browser mode)
make the app query directly the mysql database when running on Electron (desktop mode)
I know I could check for window && window.process && window.process.type to let the app understand wheter running on Electron or not, however I'm a bit concerned about how to handle this. Also because I probably need to import node packages like mysqljs but ONLY in the desktop mode.
You can simply pass in different environment files in Angular during build this allow you to control the environment variables so that you can tell that it is a web app build or an electron app build.
https://angular.io/guide/build
EXTRA
But if you are importing binary packages this is where it gets tricky. I dont think there is a clean way for you to do conditional imports. I did not manage to find a way to do it cleanly and sort of maintained another repository for all my services that needs to import binary files.
To import the binary files you will also need to edit some webpack settings to tell angular to not compile/include the binary files during the build process so that you can use you librarys like mysqljs that require binary files. There is also some settings on the electron end to make binary files compatible for different platforms ie Windows, Mac , Linux. Basically it is really a pain to do it.
Link to how to edit webpack settings for angular 7+
https://github.com/manfredsteyer/ngx-build-plus
I will totally suggest you not to do it unless you really have a very good reason that you need to use these libraries.
EDIT 10/1/19
Okay I was referring to the MySqlJs but it seems like it does not have native modules modules. Native/binary modules basically means javascript code that relies on c++ compiled binaries(Or any native language like rust...).
For my case I was using the grpc modules which has a native dependency. Had to switch to grpc-web in the end.
I will add some footnotes here if you ever need them
https://electronjs.org/docs/tutorial/using-native-node-modules
Node.js / npm - anyway to tell if a package is pure JS or not?

Run React basic app on ubuntu using node js

I am fairly new to NodeJS, here is the problem statement:
I have a small app (let's consider default app) of ReactJS. I installed NodeJs on my Ubuntu Server. Now when I hit mydomain.com in a browser I want my ReactJS app to show there. I know I need to do some configuration but somehow not able to find what's the right way of doing it. I have nothing installed on my Ubuntu server except NodeJS and npm.
Any suggestion will help me.
Thanks
For pure Node.js solution, tou can use static files (HTML/JS/CSS) HTTP server like following
https://github.com/cloudhead/node-static
https://github.com/indexzero/http-server
I've used http-server which is super simple and can be installed as a CLI tool as well

Resources