For the next 6 months I've to manage two or more developer on a web application development, based on Laravel (backend framework used for restful ws) and AngularJs (frontend framework which calls my ws).
As far as I know, the Angular code must resides into the public folder (the Laravel public folder), but in this way, I cannot use different repositories for two submodules (frontend app and backend app), in order to assign to each developer own repo (frontend repo to frontend dev, backend repo to backend dev).
How can I organize the project, allowing each dev to work independently?
How can I organize the project, in order to be able to deploy frontend and backend code on production server in different moments?
I'll plan to use agile methods.
Git Submodules can be the solution here.
You can organize you code this way: main repo (backend) + submodule (frontend).
to deploy backend only:
cd backend
git fetch && git reset --hard origin/master
to deploy frontend only:
cd frontend
git fetch && git reset --hard origin/master
to deploy both backend and frontend:
cd backend
git fetch && git reset --hard origin/master
git submodule sync
git submodule update --init --recursive
Of course this is only the simple example, but I assume it's clear enough to get the point of Git submodules :)
Related
So I am getting started on a project and the guy wants me to deploy tge react version of a website. Basically the current git repository has 2 folders, one is react and the other HTML(which is what is being served at tge url) how do I change that to the react version of the website?
I have an application that uses Laravel as backend and React as frontend
The two applications are stored in separate repositories.
In the local environment, I serve the Laravel application with "php artisan:serve" and the React application with "npm run start".
The two applications communicate with each other through POST/GET APIs.
Now I want to create a "deploy" repository.
The deploy repository should have two folders:
backend (containing Laravel application)
frontend (containing React application)
I want that every time a merge is made on the main branch of one of the two repos (backend or frontend) the changes are pushed to the deploy repository too.
The deploy repo will take care of building the app and eventually build a docker image.
Is this possible?
There are better ways/patterns to achieve what I want?
I have strapi as backend and react js as frontend developed in separate folders. When doing the development from localhost I have to run npm start for both strapi and react js which both running in two different port.
The thing is, I've been asked to deploy my project to heroku but I have no idea on the deployment process as there is no specific tutorial that I can find for that matter. I found this similar issue as mine here How to deploy Strapi backend and ReactJS frontend to a single Heroku app but the solutions given are not clear to follow.
Should I put the strapi and react js in one folder and add the middlewares like in the solution given then only deploy?
The first thing you need to do is to get a CLI instalation on your machine. After that you need to Login on heroku with the following command:
$ heroku login
After you've done this step you need to clone the repository or the remote location in case you have already a git repo on your localmachine as such.
Remember that before this you need to create a Heroku App on heroku.com first. then follow the step.
$ heroku git:clone -a [my-repository-name]
after you are done with this. Commit your project files. as such.
$ git add .
$ git commit -m "my first project commit front end"
$ git push heroku master
You need to make sure that you have a procfile that is needed in order to run the npm run command. so.. create a file called.
Procfile
(this is the name of the file that needs to be behind src file.
After you have done this. You may continue with the next project. example. this would work only for your frontend application. For the backend application you can create another application and repeat the same steps.
web: npm run start
Currently, I have a repo that contains both a Node.js Express backend and React frontend. The repo's image is in Google Container Registry and is used on a Google Kubernetes cluster. There is an url provided by a load balancer, where it is the backend url that is serving the static build server. In the future, I want to separate the backend/frontend into two different repos (one for backend and one for frontend).
I believe making changes for the backend in the cluster won't be difficult, but I am having trouble figuring out how to add the React frontend to this since the build folder will be in a different repo than the backend. I read online that to serve a React app on GCP, you would upload the build folder onto a bucket and have that bucket served on App Engine, which will provide a url to access it on the web.
I'm wondering if this is how it would be done on a Kubernetes cluster or if there is a different approach since it is not using App Engine, rather Google Kubernetes.
I hope this makes sense (I am still fairly new to Google Cloud) and any feedback/tips will be appreciated!
Thanks!
There are different approaches to this.
Approach 1: Serve your frontend via Google Cloud Storage.
There is a guide in the GCP documentation: Hosting a static website to set this up. After the build copy all the files to the cloud storage and you are done.
Approach 2: Add your fronted to your backend while building the Docker image
Build your frontend and pack it into a Docker image with something like this:
FROM node AS build
WORKDIR /app
COPY . .
RUN npm ci && npm run build
FROM scratch
COPY --from=build /app/dist /app
Build your backend and copy the frontend:
FROM myapp/frontend as frontend
FROM node
// build backend
COPY --from=frontend /app /path/where/frontend/belongs
This decouples both builds but you will always have to deploy the backend for a frontend change.
Approach 3: Serve your frontend with nginx (or another web server)
FROM node AS build
WORKDIR /app
COPY . .
RUN npm ci && npm run build
FROM nginx
COPY --from=build /app/dist /usr/share/nginx/html
You might also adapt the nginx.conf to enable routing without hash paths. See this article by codecentric for more information on that.
We are trying to set up a CI pipeline for our React application in Heroku.
For now, we have automatic deployment setup for our application which is triggered by any commit to the git repository.
We need to run tests before heroku releases the new version, and Heroku should only release the new version if all tests pass. Our tests are in a separate Git Repository, and we are using Mocha, Chai and puppeteer for the tests.
How can this be achieved in Heroku?
We have tried to include the tests repository in Heroku, but Heroku does not allow to connect to the second git repo, because it is already connected to the React application's git repo.
We went through Heroku docs but could not find anything that would solve our issue.
The final flow needed is: We commit to the application's git repo -> it triggers Heroku automatic CI -> Heroku runs tests that are in a separate git repository -> if tests pass, Heroku releases the new version.