I have a small web application written in node.js and nuxt.js. The app is running on Heroku. I wan't to improve the speed of the page, however I have no idea which way would be the most practical to implement a CDN service.
The deployment flow is like: after pushing to Github I use auto deploy to Heroku. After deployment the node.js-buildpack generates the new build. I would like to host somewhere the static .js and .css files but I can't acces them on Heroku directly.
I was thinking on write a node function and simply upload the dist files after building every time onto my CDN provider.
I'm just curious wether a more simplier solution exist or not.
Thank you in advence.
Related
It's been a couple of weeks since I started working on React. I'm having fun with it. What's the point of React Build? To create a full-stack application, you make a NodeJS/express back-end and a front-end in separate folders. My booking website is finally done. When it comes to deploying it, why can't I upload the folders like I have on my local machine? It's both on different ports and in different folders. why did i waste my time on cors if everything was going to be on single port ???
why ? react Build ?
You could actually upload same files and folders of react you have on your local machine and serve all of that to customer and it will work as usual. The issue would be performance. You will have to server so many files and folders together plus all the packages. What react build does is using the bundler, put everything together in one build folder and only serve that. Build folder is as minimized as possible with all the packages needed to run application. Hope that answers your question
I have started getting into angular2 recently and have previously used angularjs. This might seem like a very broad question but all of the tutorials show how to use angular2 on a local environment and show how to serve the app and navigate to localhost:3000 etc. So my question is how do I go about running my app on my hosted server. Like how do I get it to go to my app using www.mysite.com? Do I copy the files to my public_html directory or do I have do do something to make my domain go to the port the app is being served on? Or do I have to turn off apache and do something to use node instead? Any help would be apreciated.
is very simple:
Copy local files into remote folder
Execute ng build --prod
your domain root route should be myremoteFolder/dist
hope this help you
Angular is a frontend framework, which means it runs entirely in the browser. This means it's files are "static", they don't require a web server to dynamically process the way PHP files would. This means they can be hosted anywhere static files can be hosted such as AWS S3 or whatever directory you'd put your images and stylesheets on HostGator.
I'm assuming the localhost:3000 is a simple development server used for local testing. If it does more work than that, such as expose API endpoints that your Angular app calls to, then you'll need to find a host that can run NodeJS applications.
I'm still new to web development and I'm using Firebase to handle all my data right now.
I have everything up and running, but how do I make it so my Firebase website updates whenever I make a change to my files? Do I have to manually call firebase deploy after each change in order to see the updated site?
To deploy your changes to the Firebase Hosting server, you will indeed have to run firebase deploy.
But normally when I develop an application, I run a local web server for the most part. I then only push the changes to Firebase Hosting when I have finished the feature/bugfix that I'm working on.
For local execution, I either use http-server or a gulp script that also packs the files. The latter have the advantage that they can watch your local files for changes and execute the correct steps based on that.
I'm working on a Angular 4 app with Firebase as a backend, so the steps are
$ ng build --prod
$ firebase deploy
It really depends on what you are doing and what you're trying to deploy.
There's three different areas to deploy to:
Hosting - this is just a simple web server in which to house your HTML, JavaScript and any other static files
Database - your Firebase access rules are placed in here
Storage - access rules to the file store, typically user submitted files
Typically you'll be developing your HTML and JavaScript files locally and testing them there. When you're ready to deploy to the hosting environment you'll typically deploy via firebase deploy, this will deploy all of the local files and rules to the Firebase servers.
If your question relates to just the database rules then there is no local version or instance of this, you need to deploy changes as you make them in order to make them active.
You can perform a rules update by issuing the command firebase deploy --only database. Just make sure you have a firebase.json file with "database": { "rules": "firebase.rules.json" }, or similar defined in it.
Bonus: Use BOLT to build the rules, it transpiles into a Firebase JSON rules file but makes development so much easier especially when your rules inevitably become more complicated.
i have developed a simple webapp using socket.io and node.js and was wondering how i would deploy it to a server? My application uses an HTML file with a canvas element the user interacts with how would i deploy this, the css and the js files and the app.js file to the server?
thanks
In some hosting companies that support Node.js (like Nodejitsu and Heroku) you can deploy your static files as part of your application code. In other words, when you deploy your app both your code and static files (JS/CSS/Images) will be deployed.
The downside with this approach is that you cannot easily just change a CSS file like you can in a more traditional deployment where you can just FTP a new CSS file to the production server. You could bypass this if you host your CSS files somewhere else, though.
I don't have experience with AppFog but I suspect the same is true.
You have a 90 day free trial at Azure. Believe it or not but they have great support for node.js. Read more at http://www.windowsazure.com/en-us/develop/nodejs/
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.