Confusion with client and server side development in electron, node.js - javascript

I've built an app using electron.
I have many require's in my code to node modules.
I start my app through npm start and it's all working but how do I make it work client-side
(when i package it with electron-packager)?
When I start the packaged app, the javascripts don't work because I used require('electron').remote and the scripts stop there.
I don't really get how to make this work, I'm new to all this stuff. I also downloaded require.js but it didn't solve my problem because i don't know what to do with the electron package. Any help?

Related

Not able to fork external JavaScript server file in Electron

so I am making an application that requires a backend API, and it uses certain node_modules which don't work when compiling with Electron. To fix this, I put the API code into a separate JavaScript file, which I am attempting to fork using child_process.
I have gotten this to work when compiling, but it immediately stops working after I move the "win-unpacked" folder or try to install the app using the compiled installer.
I have checked, and it is not the path that is wrong, it is correctly pointing to the file. From testing, it appears that the file actually does get forked, but immediately exits with the status code 1.
I can't use require(./filepath.js) because that will just include the code in the compiler, which doesn't work with the modules I am using.
I am hoping someone knows what is wrong and what I should do to fix it, or have any ideas for other ways to run the server code without including it in the compiler.
I am using Vue.js 3 and vue-cli-electron-builder version 2.1.1
The server I am attempting to run is a express server.

I get "ReferenceError: Can't find variable: require" running a Cordova app on osx

I am trying to develop a Cordova based app that uses the ytdl-core node module. From my understanding, Cordova uses node-js for running the app on osx (or other non-browser platforms). The app builds successfully and it opens on my Mac, but the javascript won't work since it throws this error on open and/or refresh:
"modify in config.xml.
2020-05-23 20:11:32.639 Weather[11707:374910] JavaScript error: index.js:11: ReferenceError: Can't find variable: require"
index.js:11 is this line: const ytdl = require('ytdl-core');
Most people with this error are getting it because browsers do not support "require", but as I said, I'm running on osx platform. I already checked that node.js is installed and the ytdl-core is in the node_modules folder of my project.
Here is my git repository: https://github.com/FCjosh/JRMusicapp.git
I installed cordova exactly as it says on their website with xcode. One more thing worth mentioning is that I am using Jquery although I don't think that is problematic with node.js.
UPDATE
After tons of research, I have reason to believe that the reason the Javascript file cannot use the require function is because Cordova is treating it like a browser would. I have three ideas for solutions that may or may not work:
Cordova Plugins - A plugin runs natively and perhaps some sort of nodeJS plugin specific to the ytdl dependencies could be made.
Browserify, Webpack, or the like. From my understanding, these let you run serverside code on a browser. This seems pretty straightforward and a likely to work solution.
Create a native app and embed cordova. I don't know how to make a native app and if I did, I wouldn't be using Cordova. So I will not pursue this option, but I could understand situations where embedding Cordova in a native app is very useful.
I began making a plugin, but I got stuck when I got to the Objective C part and I have no idea how to implement nodeJS into the plugin. I am changing routes to the Browserify/Webpack solution because the plugin is over my head and making a native app is also over my head.
I will update again soon if the Browserify/Webpack solution works.

How to use NPM Modules with Flask?

I have a python application which I am deploying through Flask using the render_template() function onto a webpage. At the same time, I am trying to use npm to incorporate some javascript modules into my code. Whilst I have correctly installed the needed modules within the static folder with all my other javascript files, the code refuses to recognize these modules.
My Flask CLI shows that my local development server has correctly located the module file but if I run var module = require('module') the code shows no indication of having worked if run through the browser. This goes for whether I include this script inside my html template in the template folder, or an external javascript file in the static folder.
Interestingly enough, if I run the same external javascript file through the npm CLI using node script.js, the script will execute. Can someone explain what I'm doing wrong and why this is so? I'm completely new to node.js, npm and have just started today so any help would be appreciated.
I am currently basing my work off of the answer with 6 upvotes here: How can I serve NPM packages using Flask?
You can use electron as the ui for the python app by spawning your file and navigating to the local url in the app instead of using a browser. With this you will have some node capability.
Without knowing more, this is a bit of a stab in the dark, and quite late, however, I solved a similar problem with the following:
app = Flask(__name__,
static_folder = './public',
template_folder="./static")
npm is. Node.js packages manager tool. And it is only used node.js application.
If your application frontend is react or vue framework and your backend is node.js framework example Express or Koa, use npm is good. but now your backend is Flask
, you know Python package manage tools is Pip, so if you use Npm, you should use node in frontend , backend is flask, and frontend start npm start, backend start python app.py.

NodeJS and client-side Javascript in Ember application

I am working on developing a client-side application built on EmberJS.
Now, while I test the code in the browser ultimately, I have the following locally for development;
NodeJS & NPM
I have defined bower.json & package.json
I use ember-cli & do ember build & ember server to start the local server
I hit the URL http://localhost:4200 in the browser to access the app
Now my question is I wanted to understand, what exactly is happening here ?
Meaning what exactly happens before code runs in the browser.
I understand when the build happens, it actually pushes code into the 'dist' directory.
Is there any role in NodeJS in all of this (meaning any JS run on server-side in the background) OR we just utilize npm/bower for this case ?
So I just wanted to connect all the dots regarding running in the browser.
browsers don't support the features of modern javascript, so when you end up deploying your ember site, you only need to deploy static files (from the dist directory), and you actually don't need a server at all.
This is how https://emberclear.io works (no server, just a CDN).
The NodeJS things are purely for pre-deployment needs (development, transpiling, testing, etc).
Hope this helps.

Electron for only front end

I am trying to make my web application into a desktop app. I have already built and configured a server to host the backend scripting written in python.
My front end is written in JS, JQuery, HTML, CSS.
I have found an open source framework called Electron that packages web apps into desktop apps. Can I implement this so that it only wraps around my front end components without having to alter my back end server?
In essence, yes you can use your current web code to create a desktop app using Electron, as Electron in essence is basically just a simplified browser. However, you will need to add some things to your project if they don't already exist in order for Electron to work.
3 things in particular:
(See the quick start guide: https://electron.atom.io/docs/tutorial/quick-start/)
package.json
main.js
index.html
You'll also need nodejs installed as electron itself is an npm module.
So not quite as straightforward as you may have thought but definitely a fairly simple and viable approach.

Categories