Applying node.js server to a web server - javascript

I am trying to learn how to use Node.js and web sockets to create simple multi-user interactive javascript programs. I used this tutorial series by Daniel Shiffman to create this example project. My next step would be to upload it, using WinSCP, to my RaspberryPi apache2 web server, but I haven't found a way to edit the code in a way to allow for that to work, and furthermore, I do not know what piece of the programs to execute to make it function properly.
Any assistance would be great. The extent of my Node / Socket.io knowledge comes entirely from the video series mentioned above, so you can assume I know almost nothing else.

Apache is a web server and it serves your file and send them to client for you, so when you have some client side things like html site with some css, javascript and images you can use apache to send them to client for you.
In node.js you can create this web server simply by following code and express library:
// Create the app
var app = express();
// Set up the server
var server = app.listen(3000, () => {
console.log('http server is ready')
});
as you created in your code too. by this web server you can host your files and do many more things like setup socket.io server and ... because you write web server yourself. with following code you serve static files in public directory (html, css, javascript and images ...):
app.use(express.static('public'));
after you finishing this process you can run it simply by:
npm install
node server.js
if you want you can run you code inside docker by creating Dockerfile and ...
About your question, you must move all your project files into raspberry and at the end you have following directory tree in somewhere in raspberry:
|- server.js
|- package.json
\ public
at this directory run above commands and your server will be up and running and you can access to it by http://raspberry_ip:3000.

Related

Struggling to understand how React determines address of API server

I have a project with a client folder containing a React app bootstrapped with create-react-app. I also have a server folder with an express API server running on localhost:80.
Originally, I ran my frontend and backend as separate servers, making requests to the API server by making requests with fetch("url") and using "proxy": "localhost:80" in my package.json
I have recently altered the project so that my server serves the static frontend files like so: app.use(express.static(path.resolve(__dirname, "../client/build")))
I then tested running the server on two different ports 80 and 3000, and the frontend and backend both worked perfectly but I believed it would only work when the server was run on port 80
How does my frontend now know where to call the API server when it is running on different ports?
Proxy is used in the development environment and after that when you make build then its convert into the static HTML, CSS and JS files and that can be run in any port using node if you try that in a different port than it will also work as same
Proxy is not made for the production environment
https://github.com/facebook/create-react-app/issues/1087

Node.js file to run a local server with access-control-allow-origin

I have an html file that has resources in it's directory
(example file tree)
index.html
imgs
>img1.jpg
>img2.jpg
>img3.jpg
js
>js1.js
>js2.js
How do I run a node.js server that will allow me to view the HTML file, as well as allow me to access certain websites with the access-control-allow-origin *
I am unfamiliar with node, so the simpler, the better!
Extra: does not necessarily have to be node, just a server that will allow access control
Since You're learning and starting from scratch so it's preferred to learn how it's done than installing supper-pupper swiss knife toolset that will hide the logic from You and make You boring lazy developer.
If You just want to achieve quick result and don't want to learn - You may use serve package that will do what You need.
But if You're learning nodejs from zero to hero so read my answer.
It's better to do simple things.
Let's go (:
Create some folder and inside of it do following commands in terminal (or cmd in windows os):
1) Init app:
npm init
2) Install express module:
npm i --save express
3) Install cors module/middleware:
npm i --save cors
4) Create public folder and put Your html files there
5) Create app.js file in sibling folder with public:
"use strict";
const
express = require('express'),
app = express(),
cors = require('cors');
app.use(cors()); // attach cors middleware (must be set before of most route handlers to populate appropriate headers to response context)
app.use('/', express.static('public'));
app.listen(8080, () => console.log('APP STARTED'));
6) Run it: node app.js
7) Open in browser: http://127.0.0.1:8080
for more stuff search in YouTube for nodejs express tutorials, nodejs mean stack tutorials and etc. (:
For a quick resolution it can also be checked, the Chrome Web server app, for creating local server allowing access to the local files over localhost server.
https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb

Getting web application production ready (angularjs/nodejs)

My web application consists of angularjs on front end side and nodejs server listening to client requests. This is my folder structure:Folder Structure
UX contains client side code and IT contains server side code. I am using gulp to watch over development changes and for packaging (you can see the dist folder in UX). I use two terminals to launch this web application locally. From one terminal, I use gulp serve (UX folder) to start a static UI server which monitors the changes as I make to UI and reflect back the changes on the browser immediately. From the second terminal, I start a node server2.js server.
The UX/src/app folder has a config file where I specify server ip address and app.js uses this info to connect to server (currently).
Now, I want to deploy this app over cloud. On the cloud, I have to specify a node it/server2.js as a starting point in its config file. Hence, I want the corresponding web link should point to index.html in UX/src/app folder.
Hence, I need some advice on how to integrate my client side app.js file in the server2.js file on server side.
I am an amateur.
Thanks a lot!
I added this code to my server2.js file:
var express = require("express");
var app = express();
app.use(express.static("ux/dist/"));
app.get("/", function(req, res, next){
res.sendFile('index.html');
});
Currently, it is invoking index.html page from UX folder. But, I am not sure whether I have done it the ideal way. Need help on this.

how to run node.js on windows with apache server installed in?

I'm a node.js begginer . Let's say I have an apache server(XAAMP) and node.js installed in C:\Program Files\nodejs\nodejs.exe on windows 7.
How can I run node.js in my apache server to simulate my code?
I mean, I know how to write node.js code but what I don't know how it's work on my server?
Apache server don't need for Node.js.
For create your own Node.js server:
Download and install Node.js
Create file hello.js:
var http = require("http");
var server = http.createServer().listen(3000); // beter way for create
server.on("request", function(req, res){
res.writeHead(200, {"Content-Type": "text/plain"});
// for view at page http://localhost:3000
res.write("Hello world");
res.end();
});
server.on("listening", function(){
// for view in console
console.log("Listen: 3000...");
});
In terminal go to dir where file hello.js and type:
node hello.js
Open your browser and point it at http://localhost:3000/. This should display a web page that says:
Hello world
A basic HTTP server
Node.js Manual & Documentation
If you like to work with a replacement for XAAMP you should finally take a look at MEAN.io.
At NpmJS.org you will find different solutions for most of your needs.
and like Reagan Gallant commented you should take a look at this famous stackoverflow post (if you need ideas).
NodeSchool indeed is a good entry point for your fist steps. After that npmjs will make sense and finally you will love Mean.io
You just make it use a different port than Apache is using (for example port 3000 which is the default for express-js and others) -- that is assuming that you don't need the two to work together.
If you do need them to work together, you add a forwarding module to Apache and configure the forwarding in Apache of certain URL to go to your local port for node-js

Point domain to node express server on Azure

This must be an extremely common problem. I've seen various answers for this but none seem to work for me.
I have node installed on an apache server on Windows Azure. My app is built and ready to go (snippet below):
var express = require("express");
var app = express();
//example api call
app.get("/api/example", function(req, res){
//do some process
res.send(data);
});
app.listen(8080);
console.log("App listening on port 8080");
Now, when testing on my own computer, I could then go to localhost:8080, which works great. But now I've put it on the azure server I can't get an external domain to point to it properly. So for example, I have the domain:
framework.example.com
I've added this to my hosts file in Azure:
XXX.0.0.01 framework.example.com
Initially I tried also editing the http-vhosts.conf to point the domain to the correct directory. This worked for loading the frontend, but the app couldn't talk to the backend. API calls returned 400 not found errors.
I've also tried an Express vhost method but think I'm doing it wrong and don't fully understand it. What is the correct method?!
My app structure is like this:
- package.json
- server.js
- server
- files used by server.js
- public
- all frontend files
So to boot the server I run server.js which runs the code at the top. The server.js uses the below Express config to point to the public folder.
app.use(express.static(__dirname + "/public"));
Adding it to the hosts file in Azure won't help. You'll need to configure your domain's DNS to point to Azure. I'd recommend using the DNS Name of your Cloud Service instance. Your underlying VM IP address could change if you need to stop it for some reason, but your Cloud Service DNS name is configured to always route to your underlying VMs. That means you'll need to setup a CNAME with your DNS.
Read more about that here: Cloud Services Custom Domain Name
Next, you'll either need to host the node app on port 80, or put a proxy in front of it to handle that for you. Otherwise you'll be stuck typing framework.example.com:8080 which is not ideal. On linux, you'll likely need to be a privileged user to host on port 80, but you never want your node app to have root privileges. You can use authbind to work around this problem.
See an example of how to use it with node here: Using authbind with Node.js
All that being said, it seems like you're somewhat new with linux server management. If that's the case, I'd strongly recommend trying to use something like Azure Websites instead of a VM. You no longer have to manage the virtual machine OS. You simply tell it to host your application and it takes care of the rest. If you're using github, this is incredibly easy to test and iterate with. It does host on Windows under the hood, and that might problems for some applications, but I host all my node sites there (developed on Mac) without any issues.

Categories

Resources