Getting a MEAN app ready for production - javascript

Now that I have completed my MEAN app below are what I think are the stages to get the app ready for production and up and running on Heroku. Could you please advise if I've got the wrong idea as this is my first app of this kind.
1) Use Grunt to lint all Javascript files (front end)
2) Concatenate all the JS files into one file
3) Uglify the concatenated file from step 2
4) Push (dist?) to Heroku (via Git) ... but what do I push?
Will there be files in a "dist" folder at this point?
Is it this directory (and only this directory) that should be pushed to Heroku?
Note: I'm confident with Git and Heroku - I'm not sure what I need to push or indeed what a typical workflow is.

Not sure what you mean by dist, but I can explain how to push to heroku
Make sure you have a package.json with an app name (Heroku will identify it as a node app)
Go to the command line and log in using heroku login Input your details
Create a file and call it Procfile inside the file: web: node app.js
heroku create appName
cd into/your/root/project/folder
'git init'
git add .
git commit -m "commit message"
git push heroku master (Make sure you have heroku as a remote)
There is a way more in depth explanation of this here: https://devcenter.heroku.com/articles/getting-started-with-nodejs#deploy-the-app But they show it with an example app. Don't forget about the Procfile. And about the dist folder, if it's not needed for the app you don't need to add it to the commit
A regular check for the production environment is to run speed tests, seo checks, and such to get the most out of it. You may want to look into canonical links, minify css,javascript,html etc..(serverside minification as well) You can also add domains with heroku which is explained here

Related

How can I properly connect Realtime Database to a Discord.js bot hosted by heroku

Now I understand that this is a loaded question but every time people make videos showing how to do this, they run the project locally. With heroku I'm lost on where im supposed to find a build pack or something to remove the error saying firebase is not a module.
You need to create a new file on your main folder called .gitignore and you should type
node_modules
.env //If you have these one, you should ignore it too
Clarifications:
Since heroku can deploy your own node_module you need to use .gitignore to hide your node_modules and let the heroku install all of your package for your bot.
If you have .env for your bot token you need to ignore it too, since there's a step to put your token in heroku too.

Writing a correct Dockerfile

I created an app using Javascript (with D3.js), JQuery, CSS, but no Node.js. It's your typical 'index.html' browser-run interface. I've been going through Docker tutorials and trying to figure out how to set my app up to a server, but I've had no luck accomplishing it and have only been able to find tutorials using apps with Node. I cannot, for the life of me, figure out what I'm doing wrong, but I'm wondering if the problem (or one of them) lies in my Dockerfile. Also, do I need to have used Node.js for all this to work? My app consists of the following:
A directory called Arena-Task. Within this directory, I have my index.html, my main javascript file called arena.js, and my CSS files. My other necessary files (like images, etc.) are located within two other folders in the same directory called data and scripts.
So now, how would I write my Dockerfile so that I can build it using Docker and publish it to a server? I've attempted following Docker's example Dockerfile:
FROM node:current-slim
WORKDIR /usr/src/app
COPY package.json .
RUN npm install
EXPOSE 8080
CMD [ "npm", "start" ]
COPY . .
But to be honest I'm not quite sure how to make the changes to accommodate my program. I can't figure out if a package.json is required because if it is, then don't I need to be using Node? I don't use any node modules or project dependencies like that in my app. Do I need to be? Is my problem more than just an incorrect Dockerfile?
Sorry that this question is all over the place, but I'm really new to the realm of the server-side. I appreciate any help! Let me know if I can provide any clarification.
lets clarify few things:
node and npm is when you need them, like you are using some npm packages.
package.json - is in use by npm - it stores installed package list in it.
For you case i don't see need of node. so you can create simple image and then you going to need simple web server - something which can serve you html/css/js files on web requests over http. the simplest i know would be nginx.
Also in Dockerfile you need to copy all you resources into image you are building.
that is what COPY package.json . was doing. but in you case you have to copy whole app folder into some app folder in docker image. (assuming app is a folder which holds all you files)
so we are going to have steps
Dockerfile should look something like this:
FROM ubuntu
RUN apt-get install -y nginx
COPY app app
COPY startup.sh /startup.sh
COPY ./nginx-default /etc/nginx/sites-available/default
no need in default commands because you going to start something else during docker run.
nginx-default is a configuration for nginx to work as webserver:
it should look something like this:
server {
listen 8080;
server_name localhost;
root /app
}
nginx is very flexible - if you need something from it google it.
docker image should do something all the time, otherwise image going to stop (some blocking process).
the easiest way i know is to create startup.sh file which going to start nginx as first step and then going to do infinity loop:
exit_script() {
trap - SIGINT SIGTERM # clear the trap
sudo service nginx stop
exit 1
}
sudo service nginx start
while sleep 20; do
CURRENT_TIME=$(date +"%T")
echo "app is running: $CURRENT_TIME"
done
exit_script - is a trap which helps to stop docker image in fast way, but not like terminate. but you can omit that for testing purposes.
finally, build image (docker build -t {your-image-name} .) and to start image use something like this:
docker run -p 8080:8080 {your-image-name} bash /startup.sh
that should work :), though most probably you going to face few errors because i was writing it from the head. (like you may need something else for nginx, or sudo is not installed by default in ubuntu lates image).

react serve works, but deploying to github pages or heroku fails

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.

Deploy Javascript Cron Jobs and Queues on Amazon Elastic Beanstalkd

I have an Amazon Elastic Beanstalk application currently running my NODE.JS app.
I have created some Queues with kue.js and Crons with node-schedule.
Since I have many commands to run the queues and crons, I find it impossible to put it on my current nodejs app.
I am willing to open a new application, the only problem is that I can only run one command.
I really don't want to open a seperate ec2 (not connected to my Elastic Beanstalk service) to run all of those.
What can I do to fix it?
Thank you very much!
As you want to use EB(Elastic Beanstalk) you could write a docker file for the application and EB will already detect that and ask you if this is a docker based project and it will take care of the rest, you just need write all the scripts that you need to run before your Entry point Command CMDnpm start like below
Dockerfile
FROM node:10.13-alpine
# Sets the working directory,and creates the directory as well.
WORKDIR /app
# Install dependencies.
ADD package.json .
RUN npm install
# Copy your source code.
COPY . /app
#Run all your scripts here or simply put them to a scripts.js and run it
RUN node scripts.js
# start app
CMD ["npm", "start"]

Deploying node.js app to Heroku - "No gruntfile found."

I'm trying to deploy a MEAN stack app to Heroku and am running into trouble when it tries to find 'gruntfile.js.' The relevant logs follow:
Caching node_modules directory for future builds
Cleaning up node-gyp and npm artifacts
No Procfile found; Adding npm start to new Procfile
Building runtime environment
No Gruntfile (grunt.js, Gruntfile.js, Gruntfile.coffee) found
Discovering process types
Procfile declares types -> web
Compressing... done, 17.8MB
Launching... done, v11
I do have 'gruntfile.js' in the root of my folder structure along with package.json, etc. I'm not exactly sure why Heroku is unable to find it, but it seems to be the likely culprit for why the app is crashing.
Other potentially relevant details:
The app is scaffolded using Yeoman and generator-mean (https://github.com/jrcryer/generator-mean).
I'm using a custom buildpack on Heroku (https://github.com/mbuchetics/heroku-buildpack-nodejs-grunt) which I came across while researching this issue.
Linux servers are case sensitive when it comes to file names, so as ArloWilkinson above mentioned, make sure that your casing is correct on Gruntfile.js
I think we changed it to Gruntfile about 2 monthes ago.
What version of mean are you running?

Categories

Resources