Vue Router Refresh Issue

### **Solution**
Since you are using Apache on your AWS EC2 instance, you need to configure it to redirect all requests to `index.html` so Vue Router can handle them.

#### **Steps to Fix:**

### **1. Update `.htaccess`**
In your Vue project’s deployment directory (`/var/www/share/frontend` if that’s where your frontend is hosted), create or modify the `.htaccess` file:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.html [L]
</IfModule>

This will ensure that any request that is not a file or directory will be redirected to `index.html`, allowing Vue Router to handle it.

### **2. Ensure Apache Mod_Rewrite is Enabled**
Run the following command on your EC2 instance:

sudo a2enmod rewrite
sudo systemctl restart apache2

### **3. Update Vue Router to Use History Mode (If Not Already)**
Modify your `router.js` file in Vue:

import { createRouter, createWebHistory } from 'vue-router';

const router = createRouter({
  history: createWebHistory(),
  routes: [
    { path: '/frontend/register', component: RegisterComponent }
  ]
});

export default router;

### **4. Restart Apache**
After making changes, restart Apache:

sudo systemctl restart apache2

#### **Why This Works**
– Apache is now set up to serve `index.html` for all non-static file requests.
– Vue Router takes over and renders the correct page.

Try these steps and let me know if you still face issues! 🚀