I've been given an advanced project on a MacOSX computer, that uses Node.js, Express and Jade. I'm a little bit familiar with concepts for each, but have absolutely no experience with either one.
I've also found MAMP running on the dev machine where the app is in.
I'm clueless in terms of how to start or run the app.
The files and the database are there, I know how to get MAMP running, but it seems that files are not located or related to MAMP location.
I'm not really that familiar to Terminal either. I would like to know what should I run to get the webapp showing on a web browser (locally for now).
I' ve seen the application running on localhost and a port, but it won't run now.
I guess I haven't started something yet, but I honestly don't know what I'm looking for and how to run it.
Node.JS applications do not require a webserver, such as Apache. The applications are often the server themselves.
Typically, you start a Node application like this:
node yourApplication.js
How to access that application via a browser depends on how that application was written. There is no real standard, but it's just JavaScript, so you should be able to read through it fairly easily if you are a programmer.
After installing node and express the starting e easy :)
in the chosen folder:
express
npm install
node app.js
And you will be up and running.
Be sure that Nodejs, Express and Jade are already installed!
To start a local server you need to create app.js file in empty folder, for example in myApp folder. Copy this code to your app.js:
var express = require('express');
var app = express();
//Middleware
app.listen(3000)
app.configure(function(){
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
});
app.get('/', function(){
res.render('index', {option: 'value'});
});
From myApp folder: express npm superApp. You can replace superApp to any name you like. Then type cd superApp && npm install and you must be relocated to myApp/superApp automatically.
Type npm install and after this you can run the server by typing node app.js (you should be in myApp/superApp). The server must be running now, go to http://localhost:3000/ and check.
If you see something like:
"Express
500 Error: /home/.../myApp/superApp/views/layout.jade:1 > 1| !!! 2| html 3| head 4| title= title !!! is deprecated, you must now use doctype"
Just change !!! to doctype in layout.jade.
Finally you should see this message:
"Express
Welcome to Express"
Now you can run the server just typing node app.js from myApp/superApp.
Related
I want to deploy an application that I perform with the MEAN stack on Heroku, but I encounter 1 problem.
I have this folder structure, my node server, with a public folder, where is the dist / fronted folder and all the files generated by Angular's ng build --prod, it works when I start the server and browse normally, but if I refresh the page or write a route myself, I get these errors:
Errores
Sorry for my English.
If your are building a MEAN stack, you probably have a server.js or index.js or app.js as an entry point to your application. An SPA by definition manages all the routes within the router configuration. But if you try to refresh or type a route yourself, it is like you were trying to access that folder on the server (ex: www.mywebsite.com/about, here the folder about might not exist on the server, it is just known by your Angular app)
My suggestion is that you try to add this fix to the app.js (or server.js or app.js) file, so all unexisting routes or refresh go back to your index.html:
// Check your port is correctly set:
const port = process.env.PORT || 8080;
// Is saying express to put everything on the dist folder under root directory
// Check the folder to fit your project architecture
app.use(express.static(__dirname + "/dist"));
// RegEx saying "capture all routes typen directly into the browser"
app.get(/.*/, function(req, res) {
// Because it is a SPA, all unknown routes will redirect to index.html
res.sendFile(__dirname + "/dist/index.html");
});
app.listen(port);
This guy shows full deploy on Heroku with Angular: https://www.youtube.com/watch?v=cBfcbb07Tqk
Hope it works for you!
I am starting a new project which is using Angular 4 for frontend designing and the application will need some rest api's for which I have decided to use node. I am using angular cli for creating angular app and I know how to create angular app and node server but I want to know how will I connect these two things such that when I do ng serve both the server and angular app gets compiled and run. What basic changes in the project structure or some file is needed to be done?
I'm currently building a full-stack Angular app with a Node/Express backend and was wondering the exact same thing. However, despite what that scotch.io tutorial tells you, creating both the Express server and the Angular app in the same directory is NOT the best way to go about it.
What you want to do is set up your Express server in one project and serve it in one terminal window, then serve your Angular app in a separate terminal window but have it point to your locally-running Express server instead of the default dev server that's included with the Angular CLI (the ng-serve command).
Here's a Stack Overflow answer and also a Medium article that answered all of my questions for how to set this up (fortunately, it's not too hard).
Here's what I did Shubham. I went into the Angular-Cli and changed "outDir": to "../public"in other words it will look like "outDir": "../public". The ../public folder is my Express static folder set in my app.js file with app.use(express.static(path.join(__dirname, 'public')));
Keeping in mind I have nodemon installed globally, and in my package.json file, "start": "node app" I simply run nodemon from this dir to start my server and both Angular and Express run on the same server.
I have seen some people say it's not good to run static filed on the Node/Express server, but for development I'm not sure it matters. Although I'm a novice when it comes to js frameworks etc. Here's the project files on my github acct: https://github.com/chriskavanagh/angularauth.
Edit: You must run ng-build (in your Angular dir) whenever you change code.
First, in Angular project do ng build, it will create dist folder (static folder).
Second step, paste the following code in backend servers entry point file.
app.use(express.static(path.join(__dirname, 'dist/')));
app.get('*', (req, res) =>{
res.sendFile(path.join(__dirname, 'dist/index.html'));
});
And after the above thing is done run backend server: node filename
Note: in give proper path where your index.html file is located in dist folder.
The node server and the Angular app are two different things.
In order to run the node server you should use the command:
node ServerName.js
In order to run the angular app you should use the command:
npm start OR ng serve
In your case, the connection between the two is made by http requests.
For example you could use 'express' in order to implement rest services in your node server and then send an http request to the server in the current route.
I have been developing an app from the create-react-app starting project.
Today I have been doing the following on my local machine:
deploying my react app using react-scripts start
deploying my react app by using react-scripts build then either serving the build by either...
(A) using the [npm module serve][] as follows serve -p 4001
(B) or attempting to server using a express app like follows:
Express app:
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(4001);
I've just restarted my computer and it's still serving the site at:
http://localhost:4001/ and I cannot figure out how to stop it.
I wouldn't mind the continuous deployment of this server but when I build the project again. The changes are not reflected.
The only work around I've come up with is to now deploy at port 4025 and use the Express method coded above.
How the hell can I get rid of this weird residual app that continues to run (via some react process) at port 4001?
I'd really like that port back for sake of keeping it the same across different machines :(
Turns out that chrome keeps react apps running even if the server stops providing them.
Go to chrome://serviceworker-internals and unregister them.
on WINDOWS ...after install express-seed and node.js for the "blog" tutorial, i get the same cmd prompt after typing node app.js.
another time i got body parser and error handling errors
i tried alot of solutions, even had a local host run with another tutorial, but i would like to run from the blog tutorial due to some slight differences of the set-up.
Of course im a newb, and i know theres tons of answers on the forum, but none are correcting my issue...please help.
and everytime i try to post my report on here it errors me saying i have to indent each line 4 spaces. im just losing in general.
Is there a step im missing? all the tut's say just do 'this' and 'this' and i have a local host running so i can make changes to views. any help?
// Module dependencies.
var express = require('express');
var app = express.createServer();
// Configuration
app.configure( function() {
});
// Routes
app.get('/', function(req, res) {
res.send('Hello World');
});
app.listen(3000);
what version of node & express are you running?
From the command line you can check with:
node --version
and
express --version
From your code, it looks like an older version of express (version 3 or less), but I'm betting you didn't specify the version on the npm install, which will give you the latest version (4+). There's a lot of breaking changes between those versions, so you can't run old code with the new framework successfully. My bet is that your blog tutorial hasn't been updated to express 4.x yet.
I am trying to debug my routes while using NodeJS and the Express framework. I installed node-inspector and got it fully working and open in a Chrome tab. Nevertheless, it isn't showing anything when I have this code in my index.js route
exports.index = function(req, res){
var $ = require('jquery');
console.log($('.title').val);
res.render('index', { title: 'Express' });
};
I'm wondering what the reason behind this is. I hope someone can help!
Edit: When I place a console.log in the app.js the debugger isn't showing anything either.
Other info:
I am using Windows
I first run node-inspector
And then in a second terminal I run node --debug-brk app.js
Not sure if this is the problem:
But this -> console.log($('.title').val);
should be this -> console.log($('.title').val());
But honestly I don't think jQuery works well with Node on the backend side. I have used it with express on the client side, but not on the server side.
I have seen this jQuery install for Node:
npm install jquery
https://npmjs.org/package/jquery
I haven't used this install with node so I cannot be certain this works.