Is there a way to use Chaplin with node.js/express? I haven't found a single tutorial or an example on this subject.
If so, how do I get started? How would the folder structure look like? Or my server.js file?
Chaplin appears to be purely client side. For a basic app your back end could be a static HTML page. It requires no particular server structure.
Backbone, which it's built on, expects a RESTful JSON API to persist its models, but otherwise doesn't require a backend either. If your app has models which need to be saved (likely), then you'll want to look into tutorials for writing a REST API in express (there are many) or for extending Backbone to suit your particular backend needs.
So to get started, your server.js file will look exactly like the one created by the express install script.
There's no de facto best practice for how to structure the folders in an end-to-end javascript app. In my experience I tend to keep client side javascript in its own folder (/client, /app/client, /lib/client, etc), then generate the publicly exposed compressed/concated scripts in a build step. To get started, you might just deposit them in /public/javascripts.
I still don't understand this..
In my express file it says
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
Should I move all my chaplin app files into that views folders or how do I launch them?
Anyway, express seems to use this jade thing but chaplin does not, how does that go?
My problem is to understand where everything goes and why.
Express creates it's own folder structure:
node_modules
public
routes
views
app.js
then again chaplin has it like this:
app
generators
bower.json
config.json
etc.
in that app folder:
assets
controllers
lib
models
views
Now, where do I place all of this chaplin stuff in my node folders? under public or views or where?
And then how do I get this whole thing started? Do I just include all the chaplin .js files in that index file I have in my node.js views folder (jade file)?
Related
I'm trying to use intl-tel-input in a project I'm building using express and ejs.
I have app.use(express.static(path.join(__dirname, 'public'))); in my app.js which means Express serves all static files from the public directory in my project.
I am unable to integrate intl-tel-input as it's a node module and the relevant css and js files are located in /node_modules/intl-tel-input/build/... and they are not served by Express at all. Thus, when I try to link to them in my Ejs template, I get a 404 error.
How do I solve this? All the ideas I have seem like the wrong approach.
After struggling with this for a while and exploring solutions like Webpack, RequireJS and other not so elegant ones, I found this answer to be the most relevant, easy and effective solution for this particular problem.
I'm rather new to how webservers behave in general, so I have a few questions I hope someone can help me with.
It would also be nice if anyone could point me to an article or some documentation about the following topics.
Basically I'm trying to develop a webapp using Angular2, Expressjs and obviously node.js.
I have already successfully developed some basic Angular2 apps without a backend attached to it, which worked fine.
However, now I'm trying to send the index.html file (which contains a tag referring to an Angular component) to the browser from my server.
app.get('/test', function(req, res) {
res.sendfile('index.html');
});
You can find the html here: http://pastebin.com/utMHk8Pe
However, even though the node_modules package is on the same hierarchic level as both server.js and index.html, going to localhost:8080/test gives me a 404 for the node_modules script files in my html header.
Q1: Why doesn't my server find the node_modules folder?
Now, when I run my index.html file through following link, http://localhost:54720/testapp/index.html, everything works just fine.
Somehow it finds the node_modules at port 54720 but not 8080 (which is the port I made the express app listen on).
Q2: Why can't my server find the node_modules folder at the port I make it listen on?
As I've already said, I'm really new to node.js and webservers in general.
I'd be very grateful for any help!
Even linking me to an article which could be helpful would help me tons, since I can't really find anything since I don't know what to Google for.
You need to define a static folder to enable this. Something like this:
var express = require('express');
var app = express();
(...)
app.use('/static', express.static('public'));
This way, you will be able to serve the static files you need for Angular2, the ones that are present under the node_modules (angular2, systemjs and rxjs).
See this documentation for more details: http://expressjs.com/en/starter/static-files.html.
Hope it helps you,
Thierry
I've a node, express system installed working on a host.
All requests are going through in the app.get('/path'... format
however in the domain I've html folder with static content that I want to serve
http://domain.com/html/attendee
http://domain.com/html/sponsors
and don't want node/express to intercept these requests and let them go through directly, not even serve through nodejs, otherwise relative linking problem.
Please suggest a solution.
You can't do it that way. node doesn't serve ANY content by default - it is not like some other web servers in that regard.
Instead, you specifically configure express to serve content from certain paths directly from the file system by inserting the right middleware commands early in the middleware stack.
For example, in one of my node apps, I use this middleware:
// static routes that get no further processing
app.use('/img', express.static(__dirname + '/img'));
app.use('/lib', express.static(__dirname + '/lib'));
This tells express that any content that starts with "/img" should be served directly from the appDirectory + "/img" directory. Same for elements in "/lib". One nice thing about this is that the paths you expose to the outside world do not have to be the same as the paths you use on your server and, in fact, by changing a few characters in your code, you can easily map to different directory.
I am building out a MEAN app right now that is getting big. I really need to start modularizing the app but right now my Express server is configured to look for Jade views in one folder
app.set('views', path.join(__dirname, '/app/views'));
app.set('view engine', 'jade');
The authors of these posts show the view files scattered about the app in the different module directories.
https://blog.safaribooksonline.com/2014/03/27/13-step-guide-angularjs-modularization/
http://www.johnpapa.net/angular-app-structuring-guidelines/
If I try to do this now, my Express server will not be able to see them. How can I make it so Express will be able to find all the Jade views?
Two solutions :
You can use a base folder named views and create subfolders inside views.
For example, views/menu/, views/header/. To use this, you have to
declare a basedir in Express so Jade will know where to look your
views, by doing app.locals.basedir = __dirname + "/views";. Then,
in your Jade file, use include /header/a.jade, include
/menu/item1.jade etc...
Use Express App submounting feature. This allows you to modularize
your main app into small apps, which all have their own routes, views
etc... You can watch this nice video tutorial by TJ
Holowaychuk to learn more about this.
Does that help you ?
I just start using module prefixes in my render calls and set my views base directory to be the parent directory of my modules. So if I started with:
app/views/page1.jade
app/views/page2.jade
and was doing res.render("page1"), I reorganize to:
app/module1/page1.jade
app/module2/page2.jade
and I do app.set("views", "app") then render with res.render("module1/page1").
I never thought this would be a problem with Node.js and Express, but on a crazy whim I decided to type into a browser the location of one of the source files in my Node.js Express project - something like:
http://www.mywebsite.com/mynodejsapp/app.js
To my extreme horror, my application's source code popped right up, publicly available for all to see.
So, that aside: how do I stop it in Node.js / Express?
My setup code is pretty straightforward:
var app = express();
app.configure(function() {
app.use(express.static('/home/prod/server/app/public'));
});
app.listen(8888);
To clarify, this is what my folder structure looks like:
/home/prod/server/
/home/prod/server/app.js
/home/prod/server/public/
All sorts of various files that are intended for public access live under /public. All of my server source code lives under /server/, and my understanding of Express's static folder configuration is that the static folder is the only place that Express happily serves up files from the filesystem from.
Any ideas?
From what you posted it really smells like the URL you entered is served by e.g. Apache/nginx/... and you did put your node app within the document root. The answer is simple in this (and any similar) case:
You never put any of your sourcecode files within the document root or another HTTP-accessible folder. In your case, /home/prod/server/app/public should contain only client-side stuff (HTML, CSS, Graphics, (minified) client-side JS) and nginx should not have anything above this folder as its document root.