React: Production Server Setup – Live Coding with Jesse

  • Post comments:5 Comments



See a professional front-end developer at work. Unscripted. Mistakes included.

Watch me set up Ubuntu 16.04 on a DigitalOcean droplet that will run run Ubuntu, Node, Express, React via Next.js and Nginx as a reverse proxy. I will also eventually secure the server using LetsEncrypt.

At some point in the video, I am not able to log in as the user I created. The problem was that I didn’t copy and paste the entire public key. Sorry for taking up so much time on air to fix it.

Digital Ocean Guides:
Ubuntu 16.04: https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-16-04
Nginx: https://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-ubuntu-16-04

Repo: https://github.com/fus-marcom/ci-react

React: https://facebook.github.io/react/
Next.js: https://github.com/zeit/next.js/
Materialize: http://materializecss.com/

Twitter: https://twitter.com/JesseRWeigel
Youtube: https://www.youtube.com/c/JesseWeigel29

Code Editor: https://atom.io/
Terminal: https://www.iterm2.com/
Project Management: https://trello.com

We’re busy people who learn to code, then practice by building projects for nonprofits. Learn Full-stack JavaScript, build a portfolio, and get great references with our open source community.

Join our community at https://freecodecamp.com
Read great tech articles at https://medium.freecodecamp.com

source

This Post Has 5 Comments

  1. Omer Mindivanli

    If you do not change any setting in digital ocean, it works great. Otherwise, It is always the same that you exp. You need to use one-click node app image and just connect to server with a ssh key. In this example, It mat stem from changing Username or creating a droplet from scratch. If you use one-click image, you will not come across with permission denied problem. I have struggled with that problem along days. 🙂

  2. Alacritas

    Hey Jesse, thanks a lot for this, I'm currently setting everything up according to the tutorial. I'm also having a lot of trouble with setting up the ssh access for the non-root user. Do you know why there would be an error, upon logging in with the user, saying `Connection to <ip_address> closed by remote host. Connection to <ip_address> closed.` and then it drops me back into my localhost terminal. Can't seem to find anything about this on SO or Google. Thoughts?

  3. Boomer

    Hi Jesse, interesting stuff, good to see the long version of setting up a server. I'm currently building a react/redux/firebase app as an MVP. I'm essentially going the opposite route to this and going serverless, using Firebase Cloud Functions for server processes, Firebase Auth for authentication and Firebase hosting for CDN hosting of static files. I'm still a few months off starting on the ServiceWorker and PWA enhancements like code splitting etc. Do you think the CDN/serverless approach has potential limitations with PWA's? I've never done code splitting so not sure I can properly pre-fetch without a server. To counteract the server rendered app shell, I'm simply hardcoding HTML with inline CSS to act as an app shell until react mounts to #app.

Leave a Reply