I have built Web application using Laravel As API and Nuxt As Front and. These 2 built desperately. When the development ongoing Its isn't an issue. Because i can run them using their own development servers. Then i have bought a VPS server for host this. Now the question in how i deploy these two apps on my VPS. Specially How i can deploy nuxt app correctly in vps. Its not static side. It is ssr app.
Essentially, you are going to need a few things:
A server (which you already have)
nginx
PM2
Node/NPM installed
The tricky part of this, is to make sure the server continues running and auto-restarts in case of a crash. PM2 solves that issue, and you can read more information on how to use it here: https://nuxtjs.org/docs/2.x/deployment/deployment-pm2
You can install it by:
npm install -g pm2
Which will install PM2 globally on your server and you'll have access to the pm2 command.
Follow the documentation above, and all you gotta do is run:
pm2 start all
This will start the Nuxt service and it will run on whichever port you've defined on your nuxt.config.js or package.json files.
Now that you've got your Nuxt instance running, you need to make sure that requests that come through the browser end up on the port that Nuxt is running on, that's achievable by using nginx's reverse proxy feature that you can read more about:
https://nuxtjs.org/docs/2.x/deployment/nginx-proxy/
That documentation provides you with an example of an nginx config file, and you shouldn't really have to change anything other than the server_name, and the proxy_pass in case you've changed the default Nuxt port from 3000 to something else.
Additionally make sure that you have allowed port 80 to be listen on your server.
I made a website using Node.js as the server. As I know, the node.js file should start working by typing commands in terminal, so I'm not sure if Github Pages supports node.js-hosting. So what should I do?
GitHub pages host only static HTML pages. No server side technology is supported, so Node.js applications won't run on GitHub pages. There are lots of hosting providers, as listed on the Node.js wiki.
App fog seems to be the most economical as it provides free hosting for projects with 2GB of RAM (which is pretty good if you ask me).
As stated here, AppFog removed their free plan for new users.
If you want to host static pages on GitHub, then read this guide. If you plan on using Jekyll, then this guide will be very helpful.
We, the Javascript lovers, don't have to use Ruby (Jekyll or Octopress) to generate static pages in Github pages, we can use Node.js and Harp, for example:
These are the steps. Abstract:
Create a New Repository
Clone the Repository
git clone https://github.com/your-github-user-name/your-github-user-name.github.io.git
Initialize a Harp app (locally):
harp init _harp
make sure to name the folder with an underscore at the beginning; when you deploy to GitHub Pages, you don’t want your source files to be served.
Compile your Harp app
harp compile _harp ./
Deploy to Gihub
git add -A
git commit -a -m "First Harp + Pages commit"
git push origin master
And this is a cool tutorial with details about nice stuff like layouts, partials, Jade and Less.
I was able to set up github actions to automatically commit the results of a node build command (yarn build in my case but it should work with npm too) to the gh-pages branch whenever a new commit is pushed to master.
While not completely ideal as i'd like to avoid committing the built files, it seems like this is currently the only way to publish to github pages and should work for any frontend Node.js app (or app built with a frontend framework like React or Vue) that can be served as static files.
I based my workflow off of this guide for a different react library, and had to make the following changes to get it to work for me:
updated the "setup node" step to use the version found here since the one from the sample i was basing it off of was throwing errors because it could not find the correct action.
remove the line containing yarn export because that command does not exist and it doesn't seem to add anything helpful (you may also want to change the build line above it to suit your needs)
I also added an env directive to the yarn build step so that I can include the SHA hash of the commit that generated the build inside my app, but this is optional
Here is my full github action:
name: github pages
on:
push:
branches:
- master
jobs:
deploy:
runs-on: ubuntu-18.04
steps:
- uses: actions/checkout#v2
- name: Setup Node
uses: actions/setup-node#v2-beta
with:
node-version: '12'
- name: Get yarn cache
id: yarn-cache
run: echo "::set-output name=dir::$(yarn cache dir)"
- name: Cache dependencies
uses: actions/cache#v2
with:
path: ${{ steps.yarn-cache.outputs.dir }}
key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
restore-keys: |
${{ runner.os }}-yarn-
- run: yarn install --frozen-lockfile
- run: yarn build
env:
REACT_APP_GIT_SHA: ${{ github.SHA }}
- name: Deploy
uses: peaceiris/actions-gh-pages#v3
with:
github_token: ${{ secrets.GITHUB_TOKEN }}
publish_dir: ./build
Alternative solution
The docs for next.js also provides instructions for setting up with Vercel which appears to be a hosting service for node.js apps similar to github pages. I have not tried this though and so cannot speak to how well it works.
No, You cannot publish on Github pages. Try Heroku or something like that. You can only deploy static sites on github pages. You can't deploy a server on github pages.
No,
GitHub allows hosting only static websites(having only HTML, CSS, javascript).
Dynamic websites(having databases, servers, and all) can't be hosted as a Github page.
And node.js app is a server-based website, we can't host it on Github.
You can try Heroku, Openshift to host your website.
ahm. Yep, as most answer says. Github Pages only process html and css and a front-end JS.
But you can use JS framework like Gatsby which is mainly known to generate static purely static files, it gathers the data on compilation.
Then use that generated folder as the directory of the site.
I would like to add that it IS very much possible, as I am doing it right now. Here's how I'm doing it:
(I'm going to assume you have a package and/or directory ready to publish.)
In the root of your package.json, add
"homepage": "https://{pages-endpoint}/{repo}",
Where the pages-endpoint is the blah.github.io endpoint you specified in the Settings -> Pages portion of your repository, and repo is the name of your repository.
Then make sure you npm install --global gh-pages --save-dev. You need the --global to ensure the bin file is on your PATH and --save-dev should add it as a dependency in your package.json
After that, just npm run build && gh-pages -d build. The -d specifies your output build directory. The standard is build, but mine was public. If it's different, just change it.
Lastly, make sure in the Settings -> Pages section, you select gh-pages as the branch to host and leave the directory as / (root). Once it's built, your site should be available at your github.io endpoint.
Happy Dev-ing!
It's very simple steps to push your node js application from local to GitHub.
Steps:
First create a new repository on GitHub
Open Git CMD installed to your system (Install GitHub Desktop)
Clone the repository to your system with the command: git clone repo-url
Now copy all your application files to this cloned library if it's not there
Get everything ready to commit: git add -A
Commit the tracked changes and prepares them to be pushed to a remote repository: git commit -a -m "First Commit"
Push the changes in your local repository to GitHub: git push origin master
I'm trying to deploy this repo
https://github.com/stepseazy/checkers/
to this website
https://stepseazy.github.io/checkers
However, I'm getting 404 errors. I also tried heroku. It does work when I serve the build locally. Not sure what's wrong. Please help!!!
You'll have to distinguish your dev environment and your production one. On dev mode, you run npm start that does things (as instructed in package.json) and act as a local server and serves you project on http://localhost:3000. You simply cannot use that in production mode on Github or Heroku.
You need to deploy the built version, running npm run build. It will create a javascript file in a dist folder. You might want, on Github, create a gh-pages branch, build this production ready file on it, create an index.html file that serves it, and commit that.
I'm no expert on Heroku but it might be a slightly similar case (run post-deploy scripts that build your app and serve it through an index.html file).
Hope that help.
I have a node.js file that runs locally when I run it and it sends the user a text notification via the Twilio service. However, I'm trying to deploy it to my AWS Ubuntu server (EC2) so I can use it now on my actual website, but I'm not sure how to upload a local file to my instance like I did when I was following this tutorial (https://hackernoon.com/tutorial-creating-and-managing-a-node-js-server-on-aws-part-1-d67367ac5171) when I initially mkdir server and then cd into it which ultimately contained index.js, node_modules, and server file.
Now on my local folder, it also contains a folder called node_modules that currently has an express folder and a Twilio helper folder. So would I have to put the Twilio folder within the node_modules folder in AWS and is there a way to do this through the Terminal?
Additionally, I was curious if my app.js (Node) file would even function if my Twilio file is hosted on a GoDaddy server? I hope I made sense and any help is appreciated.
You can use the rsync command line utility (available on Linux, Mac, but also on Windows with Cygwin).
The way you'd use it is:
rsync -e 'ssh -i YOUR_AWS_KEY.pem' -avh /path/to/your/local/folder YOUR_AWS_USER#YOUR_AWS_HOSTNAME:/your/remote/path
I have a simple Angular 4 frontend as well as a node backend which is hosted separately on Heroku.
I deploy my Angular app by running ng build and copying over the contents of the dist folder to the server.
I have since then decided to integrate the backend into the front end so it's all just one project instead of two.
I can easily run node server.js on the root and it runs perfectly on my localhost.
But how can I deploy this to my server? I obviously can't just ng build and copy over the dist folder because that only builds the client folders and files.
Could I just copy over the server folder which holds the routes as well as the server.js file along with the client files and then somehow tell the server to run server.js when the site is loaded?
I use FileZilla to transfer my files onto the server.
Questions:
How do I deploy my angular/node app with FileZilla?
Which files/folders to I copy over with the client files?
If you are using Angular CLI, run ng build command to generate the dist folder.
Copy the dist folder to the backend server nodejs project.
Serve the dist folder using your Nodejs code.
If you are using ExpressJS. This can be done in a single line
app.use(express.static('dist'));
Install Heroku CLI and follow the tutorial to deploy your app: Heroku NodeJS Tutorial
You don't need to build the node app. Node runtime can compile the javascript on the fly.
The build step in angular packages up your code into one file. There is no equivalent in node as there isn't any point. The reason angular minifies and packages a file is so you can download it quickly. You never download the code from node.
On Heroku it's really easy, you don't need to copy anything over just run git push heroku master from the root of your node folder as per the instructions here https://devcenter.heroku.com/articles/getting-started-with-nodejs#deploy-the-app
Just make sure that in your package.json you have all the modules you rely on. It might work locally if you have npm modules installed globally but they also need to be in the package.json so heroku can download them by running npm install