Vue Frontend + NodeJS backend - local web app (browser) - node.js

I need to create an application which will be ran on the browser (local only, not hosted online). I will need to use a lightweight database which has a physical file (eg SQLite3, so I can have a .db file).
Also, just to mention:
I cant use IndexedDB alone to save the data because clearing browser data would clear the entire "database".
I also wouldn't be able to use electron since the bundle is too big. I need the browser for its portability
Also cant use PouchDB, since due to security constraints, online sync (CouchDB, etc) is not possible. Then it would be 100% stored in IndexedDB, which brings me back to my point on bullet 1
My question is - is there a way to create an offline web application build with VueJS frontend + NodeJS backend? I only need NodeJS because SQLite only works on the Node environment.
Deployment is preferably in .html only (is there any way that is possible, and access only using the file protocol file://)? Otherwise, I may consider using a local web server (localhost) - I'm not sure though if it is possible to serve an html file without any installations (node, python, etc), so I would still have to check all my options about this.
Any thoughts?
I am still new to this so please bear with me! There is very limited info online that talks about a 100% offline web application. Thanks a lot!

Related

How to deploy a React + Express app on a local network?

This is my first post here, let me know if I do it wrong. I would like to start by mentioning that I'm kind of a beginner developer. I've had a bunch of classes, but it's also my first time working on something of my own, from beginning to end (emphasis on "end").
I'm working on a relatively simple app, for user management (CRUD, with different levels of authorizations) and shop management. I was given the choice of the tools, framework, language, etc, to use, with the only constraints that 1/ the main device to use it will be a tablet most of the times 2/ nothing should be hosted online. I wanted to get more familiar with Javascript so I went with creating a React app (front) with Express Nodejs (back) and a MySQL database I access via Sequelize.
Development is going fine (for the most part thanks to many great posts here on SO), but I just got hit by the reality that I have never tried to build the app and see if it runs the way I intend. And I do not know how to do it. I should have researched that earlier.
So far, in development I always tested everything on PC and phone by running npm start (front end) and node server.js (back end), and the client runs in a browser (when using a phone I access the IP adress and port, like 192.168.x.x:3000). Backend listens to the 8080 port no prob, access to the MySQL database works as intended thanks to Sequelize. Frontend listens to port 3000 to display the user interface on the browser, and React makes it easy to develop features in front, and quickly troubleshoot them. Everything works fine, and as expected, anyone in the same network (and with a web browser) can access and use the app that way.
This is the behavior I want to replicate with a production build : having a computer host the build, and run the "server" so that the app is available to any device in the local network. So I guess I need to somehow make my build in a way to make it possible to turn on and off the "server" at will, maybe via a .exe ? Or turn it on at the same time as the computer ?
I know I should have researched that earlier and not doing so was a mistake. All I know is I'll have to use npm run build, to get the build folder, but I don't know what to do from there. Could you help me figure it out ? Among many things I'm not sure of, is whether or not the host computer (not mine) needs to have node.js installed ? Does it also have to have MySQL installed ? Do I make a single build that incorporates the backend and the frontend, or do I build both separately ? If so, how ?
Let me know if you need to see part of the code. Thanks in advance and have a great day.
EDIT : App was created using create react app
There are options to deploy on cloud like Cloud Servers. But I think you're looking for hosting the application on the local machine. You need to create a service, bundle the application and serve whenever you want.
Following link might be helpful
https://www.section.io/engineering-education/compile-your-nodejs-application-into-a-exe-file/

Production Config between Intranet REST server and React Apps

Folks, forgive me if this is a repeat question: I couldn't think of how to phrase it in the search engine. I'm developing an Intranet-based set of applications with the front end (individual apps) in React and the back-end using node.js and Express. I had been using Electron JS but like the Express solution since all web browsers on the Intranet can use the apps.
I'm running into a bit of a circular dependency when it comes to production, though. Since my REST back-end handles all local calls (like node fs) I use REST calls to load and save preferences files from the front end. However, I'd like to be able to set the REST URI from a config file or setting. Since the only way I can access this setting is a call to the REST back-end, I'm stuck. It's possible the client may want to change the host URL and the port for the server. This will affect all axios calls to the REST back end in every React application I have. Instead of calling http://localhost:5000/api-call/ I'd like the localhost and port number to be read from config.
I am transpiling the React apps and storing them in a static folder underneath the REST server. I would like to avoid something complex or additional like REDIS or another local database. My projects don't require any heavy database setups.
Am I simply implementing poor architecture here? I even thought of env variables but then will get into setting them on each client's system which takes away from the flexibility of using a web server in the first place. Any thoughts to move me in the right direction would be greatly appreciated!!!
I knew if I posted this, I might find an answer.
I'm not sure how elegant a solution this is but I could test the env for development vs. production. If in production, I can then use window.href (host and port) to get the information I need. I think this will work but would still love to hear some other thoughts from those with far more experience than I have!

Can I run VueJS and NodeJS or related apps on Server that doesn't have NodeJS installed?

So I'm new to Vuejs and doesn't know anything about npm, node, and other javascript apps.
I wanted to switch to VueJS so that I can take away from JQuery. Been using AdminLTE for my projects before.
I wanted to use vue-admin now since it seems to address all of my needs. However, I have specific work area situations that seems to hinder learning Vue and other JS apps, these are:
The workspace folder (development) where I'm creating applications is hosted in the production server (Windows Server).
I think NodeJS isn't installed in the server
Adobe Coldfusion is used. I don't have a local server, so the production server is used when developing.
Question:
Will the production server run the app built with vue-admin even if the production server doesn't have NodeJS installed? (I have NodeJS locally).
I need to use Coldfusion for the logic of the application, specifically I'm using CFWheels right now and vue-admin for Frontend and UX. Is it possible? The application I'm making is closely related to parts of an ERP system.
Any pointers on how I could do this?
Yes you can. Most likely you will need NodeJS locally to make your development life a bit easier.
You can simply include Vue in your project with a script tag or your can use a buildtool like Webpack to enable you to write ES6 and use a module system.
If you go with the latter it still exports as plain ES5 allowing you to use it on your server without any problem since all of this is code which runs on the clients machine, not on your server.
As you can see the requirements for this project have a big bold headline with: 'Development'.
https://github.com/vue-bulma/vue-admin#development
You don't need any of the requirements in production.

How to upload Node.js Application to FTP server?

I am kind of new to Node.js but I built an application and am pretty happy with it. I was wondering how would I go about uploading my Node.js application to an FTP server? Is it even possible to do this?
A Node.JS application is just a collection of files. You can upload them to another computer using FTP just like any other files.
That probably isn't what you are trying to ask though.
If you want to host a website built as a Node.JS application then you need to be using hosting that either:
Explicitly supports Node.JS (Google finds this list) or
Gives you full admin access (such as a virtual or dedicated server)
Such hosting will generally give you (at a minimum) shell access (via SSH) which you can use to run the Node.JS application.

How to replace IIS with Node.js for simple websites

I am coming from Microsoft world so please bear with me on this. I was told I could install node.js and use that as a web server instead of IIS. This is a very small business application. In IIS I can create virtual directory and point to the location of the web page and everything works just fine. Based on very little I read, I have few questions;
Is it possible to run node js as a windows service or any other form so that it runs for ever? I did find the forever package that I think I can use.
In IIS, I can create virtual directory set the port and thats it, I have myself a website.
I do not see any examples where I can use a directory where I have a web page, written in java script and point it to run as a web site. All the examples have some thing like server.js and that runs and routes the call. what is the other way to host web sites and use node.js to simple run as a fast web server.
I was told I could install node.js and use that as a web server instead of IIS.
This is true, but as you already found out then you are in charge of providing for things that IIS was already doing for you (e.g. automatically restart on reboot, or on crashes, hosting multiple sites by creating virtual folders, et cetera.)
You can indeed get all of these things worked out in Node.js and there are several libraries that help on each of these areas. It's not too hard but you'll need to do a bit of researching.
You can also run Node.js behind IIS. Take a look at iisnode http://tomasz.janczuk.org/2011/08/hosting-nodejs-applications-in-iis-on.html
Is it possible to run node js as a windows service or any other form so
that it runs for ever?
The library Forever takes care of restarting the site when it crashes...but I don't know if you can run it as a Windows Service. I haven't tried that.
In IIS, I can create virtual directory set the port and thats it,
I have myself a website.
I assume you are talking about a site that serves static HTML files, right? If that's the case that's very easy to support in Node.js either writing your own web server or using Express.js to serve static files.
I do not see any examples where I can use a directory where I have a web page,
written in java script and point it to run as a web site. All the examples
have some thing like server.js and that runs and routes the call.
Here is an extremely simple example to serve plain HTML files in Node.js https://gist.github.com/2573391 Don't use this in production, though. It's just an example and it does not have any kind of error handling or security.
what is the other way to host web sites and use node.js to simple run
as a fast web server.
As others have said, you should look into Express.js http://expressjs.com/ It provides some of the infrastructure that you are very likely going to need when building traditional web sites.
You say you're running a "very small business application" behind IIS. Unless it's written for Node.js (in JavaScript), it won't work.
There are no examples pointing to a directory and running that as a website, because that's not how things are done in Node.js. You write a Node.js-application and pull in a webserver-library.
Put simply, In Node.js, you don't embed the appliation in the webserver; you embed the webserver in the application.
When I used node.js, I redirected HTTP requests by a proxy server, nginx. I don’t know if you can directly bind node.js as an HTTP server, but for what’s it worth, nginx is pretty nice!
First things first, allow me to share an introduction. IMHO you should take this decision ( of moving from IIS to nodeJS) by adding various parameters. I belong to the Java & PHP community yet I use NodeJS to achieve extremely specific implementation where NodeJS perform the fastest ( fast IO, AJAX-JSON responses & more ). As you are coming with a Microsoft background you should bare with less comfortable solutions.
Yes, its possible to run NodeJs as a windows service and Forever will do fine.
and yes you can create "Virtual Directories" but by creating symbolic links to each of your customer's web site.
I recommend to take a good look at bouncy & express, If you're willing to take this step then these packages is just what you need.
Cheers!

Resources