GitLab Pages and React

I have a high level question for anyone that can answer. I am new to React, CI/CD, DevOps, etc. and am just learning. Anyway, I stumbled upon GitLab.com which I found I could use for free to host my React apps . Even better, you get SSL for free too!

But what I am doing I suspect is wrong and I need confirmation from someone. After coding and testing my apps locally (localhost:3000) I do a build. Then what I do is Git push the output in the build folder (yes, the transpiled JSX and optimized files in the build folder on my Mac) up to my empty GitLab project. I then add a YAML file, and CI/CD then kicks in and a few minutes later my app is up and running. And it looks and works fine.

My question is, am I doing things backwards. Am I supposed to be pushing to GitLab the untranspiled and unoptimized code, and then using a more sophisticated YAML file to have the pipeline (CI/CD) do the build?

Any advice on this would be great. Here’s my link to my Gitlab files for one of my projects https://gitlab.com/jamesallan626/reactcounter/tree/master and the app can be viewed here https://jamesallan626.gitlab.io/reactcounter/. The reason I ask now is that I’m starting to push lots of stuff up to GitLab and I want to get it right asap. I just want a high level response from anyone who can immediately point out that yes, I am doing things wrong.

Thanks!

James - I don’t know if there is a right or wrong way, but my preference is to push the untranspiled code and have Gitlab and kick off the build. I’ve never build the yaml file myself, others in my team had done that in the past.
These two links may help:

:slight_smile:

It’s a really good question when you think of it! It makes sense to push the untranspiled code so people can read and make sense of it. And so that we have CI/CD do the build.

I’ll change the YAML for my new projects and do it this new way going forward. Once I get a better grip on DevOps and this CI/CD thing which is new to me, it will all make sense one way or another!

Thanks for the links too, saves me having to dig around for proper YAML… :grinning:

1 Like