3

Good evening, first of all, sorry if I don't respect all of the StackOverflow codes, this is the first time I've published one of my problems.

For a project, I developed an application with a node server and a React client, and I have some problems deploying the react on Kubernetes.

After several researches I learned that in order to use react docker, I had to launch the docker in interactive mode with the flag -it. So here are the queries I use to dockersize my front.

docker build -t front-end .   
docker run -it -p 3000:3000 -d front-end 

And here is the dockerfile.

FROM node:12-slim

ENV NODE_ENV production

WORKDIR /usr/src/app/front-end

COPY ./package.json ./

RUN npm install 

COPY . . 

EXPOSE 3000

CMD ["npm", "start"]

On the docker application, this setup works correctly. However I have some problems when using Kubernetes. I can't launch the pods with a container in interactive mode, I tried several methods, but here is my last one:

apiVersion: apps/v1
kind: Deployment
metadata: 
  name: front
spec:
  replicas: 1
  selector: 
    matchLabels: 
      app: webapps-front-test
      version: v01
  template:
    metadata:
      labels:
        app: webapps-front-test
        version: v01
    spec:
      volumes:
      containers:
      - name: front
        image: myRep/do_front
        stdin: true
        tty: true
        ports: 
        - containerPort: 3000
        args:
        - "-it"

edit : This happen on kubernetes :

kubectl get pods                                                                                                                                  
NAME                     READY   STATUS             RESTARTS   AGE
front-76998f6794-xx  0/1     CrashLoopBackOff   11         33m

This happen when i run on docker ( which is not a problem since a use -it)

> react-scripts start


ℹ 「wds」: Project is running at http://1xx.x.x.x/

ℹ 「wds」: webpack output is served from

ℹ 「wds」: Content not from webpack is served from /usr/src/app/front-end/public

ℹ 「wds」: 404s will fallback to /

Do you know how to solve this problem? Thank you, Good evening/day

4
  • Interactive mode is used when you execute a command in the container. It's only used to attach a container and you shouldn't need stdin, tty or args for this. Once the pod is up and running, you then can start a shell with kubectl exec -it POD_NAME -- /bin/bash. Commented Dec 22, 2020 at 21:59
  • thanks @tentative, but I can't even get a pod in running condition. I get stuck in the CrashLoopBackOff status. Commented Dec 22, 2020 at 22:03
  • Check events using this command kubectl describe pod front-76998f6794-xx or logs using kubectl logs front-76998f6794-xx Commented Dec 22, 2020 at 22:04
  • Can you make react-scripts start entrypoint of your image myRep/do_front? Commented Dec 22, 2020 at 22:07

3 Answers 3

2

-i and -t are specific options to docker run; they correspond to the stdin_open: true and tty: true Kubernetes pod settings. You don't need to repeat them in args:.

The Kubernetes args: setting actually replaces the CMD in your Dockerfile (somewhat confusingly, Kubernetes command: replaces Docker ENTRYPOINT), so when you provide args: ['-it'] you're actually overwriting the command the container's trying to run. You should see the same error you get if you incorrectly put the -it option after the image name instead of before it in the docker run command.

stdin: true  # docker run -i
tty: true    # docker run -t
# args: ...  # docker run <image-name> arg1 arg2
Sign up to request clarification or add additional context in comments.

Comments

1

look my Dockerfile production:

That way, I use the node to build and then nginx to serve html, css and static javascript. Which is the result of the react build:

# Stage 0, "build-stage", based on Node.js, to build and compile the frontend
FROM node:12 as build-stage

WORKDIR /app
COPY package*.json /app/

RUN npm install
COPY ./ /app/

RUN npm run build


# Stage 1, based on Nginx, to have only the compiled app, ready for production with Nginx
FROM nginx:1.15

COPY --from=build-stage /app/build/ /usr/share/nginx/html
# Copy the default nginx.conf provided by tiangolo/node-frontend
#COPY --from=build-stage /nginx.conf /etc/nginx/conf.d/default.conf

2 Comments

Can I then route this nginx/frontend container from my ingress rules? I am a little bit confused by the fact that my ingress uses nginx and now this frontend docker as well?
NGINX is a proxy so it is natural to have it controlling ingress. Still, it is also normal to use it to serve static files. So yes, you have nginx in ingress and also to serve static files!
0

I am not sure if you are doing this as a test. But the way you are deploying the front end is not best practice. Usually to deploy a react app you build it first, then you can serve those static files with a server such as nginx. This way you don't have to run any commands in the container. What you would do instead is copy the built files into the nginx container, where it can then serve them. The main reason for this is the built app is much more performant, and you avoid having the whole development tool chain unnecessarily running.Here is more information:https://create-react-app.dev/docs/production-build/

1 Comment

Ok thanks ! I will look for something like that !

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.