I have created application with MEAN.js and it works well when I set NODE_ENV to development. but when I change this to production and run the application than there is only blank page in the browser.
I searched for a long I found that I have to minify css & Js files using grunt.
so I do as below:
grunt build (which create 2 files in dist)
and than I run application but still I get the same result.
Also I want to this application on openshift but for grunt I have to download all Developer Dependencies and if I load all dependencies in openshift than it start giving error of disk space as in free account I have Inode limit of 80K only. so is there any other way to publish by application on openshift without loading all DevDependencies.?
Thanks
Related
I am trying to deploy a meteor.js application on cPanel shared hosting. I don't have access to their cli.
I have followed this tutorial Host your Node.js app on Shared hosting. Go beyond localhost.
Now I am having hard time with a couple of things. I can't find any tutorial specific for meteor.js which is why I am facing some issues. Which are as follows
1. Without meteor Build
I uploaded the development version of my code. i.e the one with client,server,lib folders(without meteor build). The problem is that I am not sure about the "Application startup file".
I tried with "./client/main.js" and "./server/main.js" seperately but the site then returns 503.
2. With meteor Build
I then built my application and the build was generated with some errors. I then uploaded the tar.gz file and went with the main.js as Application Startup file. But now the cPanel is unable to detect package.json
Can someone please refer to a full guide of how to deploy a meteor app with cPanel.
I'm building a small project using Angular 7. When you run
ng serve
and a NodeJS server is spun up to handle requests, does each request block until processing is complete? We are trying to evaluate how effective using this in production would be as opposed to using a more traditional application server.
Run build --prod to generate a "./dist" folder.
Then you have to put that on a web server.
You can use Angular Server Side Rendering (SSR) to run it on a node.js server.
You should not use ng serve for production because it use webpack-dev-server that is build for development only.
Github link
ng serve runs a webpack development server behind the hood.
a development server.
It's made to mimic the production build and see your final application in an esay way.
If you didn't have that command, you would need to run a command like simplehttpserver after rebuilding all of your application on every change.
This is a convenience tool provided by the CLI to ease your development, in no case it's suited for production mode. This is a server without security, without optimization, without performance, without ... Well, without anything that makes a server, a server. By default, it deosn't even make your application accessible outside of your localhost. Not so useful for a production mode ...
So, never, I repeat, never, use this command for your production server.
Run ng build --prod
It will generate minification code in "dist" folder. you have to upload the file content of this "dist" folder. It will give faster response for loading web pages.
For more details please refer Angular deployment guide
When using ng serve, you are spawning a backend nodejs environment with a web server to handle requests towards your angular application. That's great for reloading and quick startup when developing. But needing such resources for static pages is unnecessary.
At the end of the day Angular is just a framework telling you its opinion on how to build an SPA. No matter the framework or library you use, you will always end up with an index.xxx, Javascript files and other resource files from vendors or internally. Only these matters to the browser loading the webpage.
Hence, you need to build your app to generate the static files that will be served (i.e. ng build --prod). Then you have 2 good options:
Choose a web server that will serve the files (i.e. nginx) on a dedicated server (or even container).
Place the files behind a CDN provider. Since they are static, they will be cached and served to a browser requesting them based on its location.
I would opt for #2 as opposed to #1 forcing you to keep running resources (CPU, RAM, HDD) for files that will be requested not that often. I say not often because your SPA will be handling all routes within itself in the client's browser (and minimum once a day will request a cache refresh).
Seeking some ideas on how to better improve my teams local development workflow...
We have a Vue CLI shell application project that runs locally via node. Then we have a number of small Vue CLI web-component applications that served up via node.
When the shell is ran it reaches out to each web-component application retrieving a manifest.json file which tells the shell where/when to display the respective web-components.
Our web-component applications are built using something like...
vue-cli-service build --target wc --name foo 'src/components/*.vue'
Having to continuously build the web-component projects after making a code change... debug... and then rebuild again seems cumbersome. This is a new application so at the moment the codebase is in constant flux.
Was hoping someone may have suggestions on how or tools we might use to increase our productivity.
Don't overcomplicate things.
Here's Nuxt.js
As far as I can tell it does everything you want to do straight out of the box. Just set up a basic hello world project with Nuxt and see if it does everything you need it to do for you. It uses Vue.js and Webpack to build the exact same type of application you'd be developing otherwise with Vue, it just has a nicer layout and easier workflow in general. It supports hot reloading on file changes, you'd just run nuxt in the root folder of your project and a local server is started that hot reloads your project whenever you save changes to a file. You then distribute it either as a static application with nuxt generate or build it as a server side rendered application using nuxt build and nuxt start.
Have a Node.Js API and a React app semi finished. Working on deploying to get the development cycle churning. Currently using npm start for viewing the react server during development. Same for the Node API. When deployed to AWS EC2 I am building in the most basic fashion, npm build pushing to a 'release' folder.
Once the deploy folder is up, I can go into it and run serve -s release
This gets me up and running. I can do the same for api server.
To get the apps running as a service, for the api, I can see how I can build a systemd process and run that with no issue.
For the react app, is there an easy way to run that server as a system... I'm new to this stack, so I might be confused. I have read in some places that once you've built your react app that you need to serve it out via apache or nginx? (e.g. in development it hosts itself, in production, you need to serve it) Is that sort of the general idea - build with local hosting, deploy with a production webhost?
Help appreciated. This is my last major issue before I can get Jenkins running a nice pipeline for deployment. Thanks!
Since you are already running a NodeJs server, It would be a good idea to host your ReactJs App in the NodeJs App itself.
You can pipline in the Jenkins to Build the ReactJs App first and the move it to static serving folder in the server and then you just need to deploy the NodeJs app in which ever environment that you want.
I have developed a node.js application and it is working fine locally.
Now, after that I deployed the application in Heroku I am getting some HTTP 404 errors in the browser console.
My understanding is that the reason for this issue is caused by the node package.json modules. In fact, the outer package.json is installed successfully but the node modules mentioned in the client folder is not installed.
Q: Any idea about what is necessary to modify (or to do) to make the client node modules as installed?
The image below depicts my folder structure.
Each time you push your code to Heroku, Heroku will look for the package.json file in the ROOT of your project. Heroku will then install those dependencies.
In your case, because you have multiple package.json files, Heroku isn't seeing the ones nested in sub-folders of your project.
The best option you have is to list all dependencies in your top-level package.json file. You could also create your own Heroku Buildpack to customize the Heroku deployment procedure, but I strongly recommend AGAINST doing this (it will be a nightmare to maintain over time).
Another option in your case (which might be good depending on how large your team is) would be to move your client-side code into it's own Git project, and have that deployed separately to a static hosting provider like Amazon S3, or something similar. This would then let you deploy your backend project directly to Heroku, while not having to worry about any front-end logic at all.