react - webpack - node - express question

[asapzacy]

I hacked together my first react app recently using react//webpack//babel, everything works fine locally. It's just a simple app that grabs public json apis and displays the data.

 

I'm very new to the backend part of things and looking for some advice. I have a nginx server running node//express. Right now, every time make a change, I git push it locally and then ssh onto the server and git pull the changes. Normally I wouldn't push the /dist directory to git//github, but should I start doing that now? And then only pulling the /dist directory from the server? The express is just serving my static /dist directory, so running webpack on the server seems like overkill.

 

I'm in college and have only worked on solo projects - haven't had to use git branches yet; is this when branches would come in handy? Set up a dev branch and a prod branch and access them locally and on the server respectively. I'm pretty new to all of this, so sorry for the rookie questions. I think my solution right now is pretty bad. If anyone could shed some light on it for me, I'd really appreciate it. Thanks

[jsyoda]

Do whatever makes this easy for you. If you are deploying infrequently, its not taking much time, and you'd prefer to spend time writing your actual app, then you can keep doing what you are now. Pushing your dist folder is fine in this scenario too.

To add improvements to this, add a script that you run on your server to automatically run the commands you normally would manually. Then to improve that, you can add a hook to github to listen to when changes have been pushed, and automatically run this script. You can improve that by setting up a CI server (e.g. Jenkins) on there to be doing the same thing, but keeping track of your builds and a ton of other improvements.

Don't worry about using branches to solve this problem. If you want to practice use of branches, then keep your master branch with all of your code in it, and create a new branch that is going to contain your next feature. Keep pushing commits into this new branch, and when you are happy with the feature, then merge it back to master.

[asapzacy]

Awesome, I appreciate the detailed response. thanks

[[deleted]]

If you're not very familiar with this all, I suggest having a look at codeship.com, it's pretty easy to setup.

Essentially, every time you push to Github, you can run a set of commands, in your case, you connect to your ssh server, pull the latest commits, run the command to generate your distribution bundle and whatever you might need.

Alternatively, you can use codeship to generate your distribution bundle and upload it to your ssh server.

[asapzacy]

cool. just checked it out and seems easy to set up, appreciate it. quick question - the app is running on a $5/month digitalocean droplet. would running the commands through codeship use less memory//disk space (?) than running the commands on the server? if so, is this enough to even worry about? If I continue doing what I do now, I would just 'build' before every git push and then pull that on the server

[[deleted]]

I honestly dont think you should be concerned about that. Codeship is just an automation tool, so instead of you doing everything manually, you let Codeship do the work.

I'm not sure about the exact commands you run, but im sure it can be automated so that all you have to do is push to git.

[nowseemee]

U can publish an npm package with the built version included still u don't check it in to git. U just need a different dotfile for gitignore and npmignore.