Unable to access React Application from Minikube

Question

I've a simple HelloWorld ReactJs application Docker image and I created the deployment as:

kind: Deployment
apiVersion: apps/v1
metadata:
  name: minikube-react-app
spec:
  replicas: 2
  selector:
    matchLabels:
      app: minikube-react-app
  template:
    metadata:
      labels:
        app: minikube-react-app
    spec:
      containers:
        - name: minikube-react-app
          image: hello-react:1.0.1
          imagePullPolicy: Never
          ports:
            - containerPort: 80
          resources:
            requests:
              memory: "100Mi"
              cpu: "300m"
            limits:
              memory: "200Mi"
              cpu: "600m"
      restartPolicy: Always
---
kind: Service
apiVersion: v1
metadata:
  name: minikube-react-app
spec:
  type: NodePort
  ports:
    - port: 80
      targetPort: 80
      protocol: TCP
      nodePort: 31000
  selector:
    app: minikube-react-app

I ran, kubectl apply -f deployent.yaml

But when I access http://localhost:31000 it's not working(This site can't be reached).

Can someone help me with this please?

Answer 1

Should use 'node ip' instead of 'localhost' to acccess node port.

Run shell minikube ip to obtain ip of minikube node.

Check the service type: https://kubernetes.io/docs/concepts/services-networking/service/#publishing-services-service-types

Answer 2

Run the following command to get the actual address to connect with your app from host machine.

minikube service --url <service-name>

Ref: https://minikube.sigs.k8s.io/docs/handbook/accessing/