I suppose my question is basic but I'm new to Node.js infrastructure and feel very confused.
I have a simple web-site where all my js files are bundled by webpack into bundle.js that is available by /static/bundle.js path (according to webpack configuration).
But now I have another folder with static data in the root of my project and I want to make it publicly available by /static2/... address. How can I do this? Who is responsible for that (webpack, nodejs, etc.)?
If you use express - you can take a look here:
http://expressjs.com/en/starter/static-files.html
For example:
app.use(express.static('public'));
Related
I have created an application in node js with express framework. And need to deploy it on production server.
But don't want to deploy whole project on the server because security purpose. I want to create minified dist directory and deploy it on the production.
Is their any approach available to achieve this.
You have to upload express server and related route files on server.
As express run directly by node.js. you don't have to minify it.
By default express block access to other files which is not used for server.
You can allow access to other files like index.html based on link here
I guess what you're looking for a packager. You can try Parcel JS to bundle your project.
I'm using WebStrom to create a node js website.
1) What template of project should I choose (AngularJS, node express etc)? I do use angular-js but I also need a server side.
2) What are the best practices for the project structure?
3) How I make the server side js files not accessible from the browser? I created a few projects from the different templates and I managed to reach every single js file by writing its path in the browser.
Any help will be profoundly appreciated!
I would suggest using templating. I personally like using handlebars but there are many different options out there.
https://github.com/fixiecoder/node-express-handlebars-boilerplate
This is a link to a very basic node express application that uses handlebars templates. There are also many tutorials that you can use to learn more.
The line app.use(express.static(__dirname + '/public')); in the server.js file is what is used to specify a public folder that is the only thing that the browser will be able to access. Everything outside of this is private to the server.
The best thing you could do though it just do some basic tutorials from start to finish to understand how it all fits together.
I am running kue node module in my app. Kue has its own UI. To use that UI we do this.
app.use(kue.app);
What that does it that it treats kue modules directory as my default directory. But I also want to use some custom routes to render and serve some pages of my own.
My custom templates reside in. /app-directory/views/
And the JS/CSS files reside in /app-directory/public/)
The issue is now that when I try to include any JS/CSS file in my jade template it is trying to look for that in public folder of the kue module.
/app-directory/node_modules/kue/lib/http/public/
I was suggested to create a symlink folder in kue's public folder that links it to main app's public folder. But I have never done that before, and can't seem to find any tutorial on google. So it would be great if someone can help out here or point to a link.
I don't know if it matters but the server is running on Ubuntu 14.04
Firstly I must confess I am a noob at node. I've been using ASP.NET then PHP then Django before. Regardless, I've found node a breath of fresh air. This problem is also not strictly a node problem, but I need a node specific answer.
I have an express server and angular frontend. The server side templates are in swig and currently only serve for error pages and the index page. Mostly the angular templates will make up most of the front matter.
What I'm struggling with, if only only in deciding how to do it, is getting an efficient work flow for the asset pipeline. Server side templates must be able to inject the vanilla of assets during dev and testing. The same for client side templates during testing. Basically, running with express' static middleware should be an option without any configuration (maybe with some helper in server side assets). Thus git clone -> grunt -> viola.
However, during staging and production, I would like the server side files to stay vanilla. The template helpers may parse a manifest file indicating the cache busted links (CDN path maybe too). How to make the link from logical asset bundle name to production ready asset is a mystery for me, while keeping development transparent.
The client side templates may be minified, concatenated, injected or whatever, as it will be saved to some dist folder for uploading. It is important that the whole dependency tree (images, fonts, css, js) must be "exported" to the dist folder.
To deploy would then be: pushing the server side code to the server and running. And pushing client dist folder to some asset host (CDN, nginx, another node, maybe even connect static)
What my question(s) then actually is(are):
Is this workflow possible with tools such as broccoli/gulp/grunt alone?
I've tried connect-assets but I don't want to conform to some predetermined folder path. Also the cli tool didn't produce the other static assets. Perhaps I don't understand the tool.
Am I following the correct approach?
I've added to a discussion on broccoli concerning the manifest file consumption:
https://github.com/mjackson/broccoli-rev/issues/1#issuecomment-49076249
Edit: I forgot to mention that I use bower, so assets should be pulled from arbitrary (URLs too maybe) locations.
I think angular-fullstack is what you want. Even if you don't use it, it does almost all of what you're looking for.
The only thing that it might be missing for you is deployment. It has built in support for Heroku and OpenShift deployment. You could use something like grunt-ssh or grunt-deploy for other deployment scenarios.
Some middle languages, such as Stylus, provides two ways to be compiled: through connect middleware or through CLI tool. The later can generate static compiled assets(i.e. .css files).
So I want to use middleware on development mode but static assets on production. I know that I can use app.configure('developmen'...) to ask express (not) to use some middlewares on development mode.
On an IaaS enviroment, like Amazon EC2, I can run a simple shell script to automatically re-compile all my assets. But how about PaaS, specifically Heroku? How can I tell it where my .styl are and where the .css should be generated?
You may want to take a look at https://github.com/adunkman/connect-assets . It caches any built javascript or css files (it has stylus built-in support for stylus) if you pass it build:true .
You can ignore snockets (sprockets-like javascript include system) if you're not interested, although I enjoy using it. #= require_tree app and you include all the js files in that directory. And in development, you get separate script includes for easy debugging.
The biggest downside of serving directly with connect-assets on Heroku is that you need to git push to Heroku for every update to client code, which automatically triggers a restart. I ended up manually building my assets (with stylus and snockets), then uploading to S3. If you don't need to update the client code often, it's not that big of a problem though.
You can take a look at express-cdn, which will upload your assets to S3 on server start.
What I ended up doing was signing up at CloudFlare, and found that it wasn't as fast as using CloudFront, but it was very easy to setup and it works better than serving asset files from my dyno.