Unable to see my react application after deploying into Kubernetes - reactjs

Question

I've followed this reference to deploy my simple react application into Kubernetes.
https://medium.com/bb-tutorials-and-thoughts/aws-deploying-react-app-with-nodejs-backend-on-eks-e5663cb5017f
But after deploying, I can't see my application in the browser.
So I tried to set external ip address using this command line
kubectl patch svc XXX -p '{"spec":{"externalIPs":["10.2.8.19"]}}'
Reference is here
Assign External IP to a Kubernetes Service
But I can't see my application deployed in the browser.
http://10.2.8.192:3000
Here is my deployment.yml file
apiVersion: apps/v1
kind: Deployment
metadata:
creationTimestamp: null
labels:
app: test-app
name: test-app
spec:
replicas: 5
selector:
matchLabels:
app: test-app
strategy: {}
template:
metadata:
creationTimestamp: null
labels:
app: test-app
spec:
containers:
- image: XXX.dkr.ecr.XXX.amazonaws.com/XXX/XXX:v1
name: test-app
imagePullPolicy: Always
resources: {}
ports:
- containerPort: 3000
status: {}
---
apiVersion: v1
kind: Service
metadata:
name: test-app
labels:
run: test-app
spec:
ports:
- port: 3000
protocol: TCP
selector:
app: test-app
type: NodePort
Please give me any advice. Thank you...

Answer 1

You are mixing 2 ways to expose service outside. You want to use NodePort but you are setting ExternalIP.
Issue root cause
In your setup, you are using NodePort so you need to use ExternalIP of the node with NodePort which is 31300 (more details below).
Setting ExternalIP in NodePort service in this setup is pointless (also 10.2.8.19 is InternalIP which allows you to connect only in cluster).
In your example, you are trying to reach application using your application port number, but you should use service nodePort number, which is 31300.
Note
A Service can map any incoming port to a targetPort. By default and for convenience, the targetPort is set to the same value as the port field.
Exposing application
Generally, you have 3 main ways to expose your application:
NodePort
I don't have access to medium article, but I guess in this tutorial NodePort was used.
In this configuration, you have to use serviceType: NodePort. To connect using nodeport, you have to use ExternalHostIP:NodePort. As you are using cloud environment, your VM should already have ExternalIP.
ExternalHostIP is IP address of node, where application endpoint pod was deployed. To get ExternalIP of Node you can use command.
$ kubectl get node -o wide
To get information on what node, specific pod was deployed you can execute command
`$ kubectl get po -o wide
NodePort number is assigned from range 30000-32767.
IMPORTANT
Please remember to configure fiewall to allow traffic on this specific port, or if it's just for testing you can allow whole range 30000-32767.
Example
Let's say your application pod was deployed on Node with ExternalIP: 35.228.76.198 and your service NodePort is 31300.
If you configured firewall rules correctly and right containerPort (your application must listen on this port) was set, when you will use 35.228.76.198:31300 in the browser, you should reach your application.
LoadBalancer
In this option, service is LoadBalancer type, which means that cloud is creating LB with ExternalIP. You just need to enter this IP in your browser to reach your application. However, please remember that LoadBalancer is extra paid.
Ingress
In this option you have to use some kind of Ingress Controller. Most common is Nginx Ingress Controller. In this option, depends of your needs you can create Ingress as NodePort or LoadBalancer option.
Usefull links
Service
Exposing application in AWS
Nginx Ingress on AWS
Please let me know if you was able to reach your application or you have further questions.

Answer 2

If you want to expose your application with a NodePort you can have a look How do I expose the Kubernetes services running on my Amazon EKS cluster?:
It looks like your Deployment is missing a targetPort.
kubectl get nodes should return the NodeIP.
NodeIP:NodePort should be reachable if you enable the security group of the nodes to allow incoming traffic through port 31300.