<p>I have developed spring boot backend and <code>vue</code> <code>js</code> front end I could successfully deploy the spring boot app and create cluster <code>ip</code> service for spring boot app but I have never work with NPM project on docker and <code>kubernetes</code>. I also have problem in <code>Axios</code> when I locally testing backend and frontend I give <code>(localhost:backendport/endpoint)</code> for <code>axios</code> and how can I adapt it to <code>kubernetes</code>. should I give cluster <code>ip</code> service name instead of <code>localhost:port/endpoint -&gt; clusteripservice/endpoint</code> if so how can I externalize the configurations and how can I deploy both app.</p>
<p>here is <code>Axios</code> call</p>
<pre><code>import axios from 'axios'


const API_URL = 'http://localhost:8084'
//const API_URL = '/'


class UserDataService {


    retrieveAllUsers() {

        return axios.get(`${API_URL}/user/getall`);
    }


}

export default new UserDataService()  
</code></pre>

<p>Idea is to use nginx as your app container and proxy pass to proxy to back-end. So you need to define location for your api, i.e. /api and proxy that.</p>
<p>Then if you are using axios, you would call all back-end endpoints on relative path, i.e.</p>
<pre><code>axios.get('/api/v1/myApiPath')
</code></pre>
<p>So you do not need to worry about hostname in calls to back-end.</p>
<p>Also, for development you similarly use vue.js development settings to also proxy back-end via npm.</p>
<p>See my toy project here for details how it's done:
Deployment piece - <a href="https://github.com/taleodor/mafia-deployment" rel="nofollow noreferrer">https://github.com/taleodor/mafia-deployment</a>
UI piece - <a href="https://github.com/taleodor/mafia-vue" rel="nofollow noreferrer">https://github.com/taleodor/mafia-vue</a></p>
<p>Specifically nginx settings with proxy configuration - <a href="https://github.com/taleodor/mafia-vue/blob/master/nginx/default.conf" rel="nofollow noreferrer">https://github.com/taleodor/mafia-vue/blob/master/nginx/default.conf</a> (note that it's using websockets which you may remove if you're not using them). Specifically vue development server configuration - <a href="https://github.com/taleodor/mafia-vue/blob/master/vue.config.js" rel="nofollow noreferrer">https://github.com/taleodor/mafia-vue/blob/master/vue.config.js</a>.</p>
<p>Write up on CI / CD workings (unrelated to your question but maybe useful) - <a href="https://itnext.io/building-kubernetes-cicd-pipeline-with-github-actions-argocd-and-reliza-hub-e7120b9be870" rel="nofollow noreferrer">https://itnext.io/building-kubernetes-cicd-pipeline-with-github-actions-argocd-and-reliza-hub-e7120b9be870</a></p>
