diff --git a/frontend/src/App.js b/frontend/src/App.js
index f0032cc..d4f1234 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -1,11 +1,11 @@
 import React from 'react';
 import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import { Container } from 'react-bootstrap';
-import Header from './components/Header';
-import Footer from './components/Footer';
-import HomeScreen from './screens/HomeScreen';
-import ProductScreen from './screens/ProductScreen';
-import CartScreen from './screens/CartScreen';
+import Header from './components/Header.jsx';
+import Footer from './components/Footer.jsx';
+import HomeScreen from './screens/HomeScreen.jsx';
+import ProductScreen from './screens/ProductScreen.jsx';
+import CartScreen from './screens/CartScreen.jsx';
 
 const App = () => {
   return (
diff --git a/frontend/src/index.js b/frontend/src/index.js
index 68f59c6..6322139 100644
--- a/frontend/src/index.js
+++ b/frontend/src/index.js
@@ -4,8 +4,8 @@ import { Provider } from 'react-redux';
 import store from "./redux/store.js"
 import './index.css';
 import './bootstrap.min.css'
-import App from './App';
-import reportWebVitals from './reportWebVitals';
+import App from './App.js';
+import reportWebVitals from './reportWebVitals.js';
 
 ReactDOM.render(
   <Provider store={store}>
diff --git a/frontend/src/redux/actions/productActions.js b/frontend/src/redux/actions/productActions.js
index 959a2c5..53fc5b5 100644
--- a/frontend/src/redux/actions/productActions.js
+++ b/frontend/src/redux/actions/productActions.js
@@ -6,7 +6,7 @@ import {
   PRODUCT_DETAILS_REQUEST,
   PRODUCT_DETAILS_SUCCESS,
   PRODUCT_DETAILS_FAIL
-} from '../../constants/productConstants';
+} from '../../constants/productConstants.js';
 
 export const listProducts = () => async (dispatch) => {
   try {
diff --git a/frontend/src/redux/reducer/productReducer.js b/frontend/src/redux/reducer/productReducer.js
index 2527529..3f9ae27 100644
--- a/frontend/src/redux/reducer/productReducer.js
+++ b/frontend/src/redux/reducer/productReducer.js
@@ -5,7 +5,7 @@ import {
   PRODUCT_DETAILS_FAIL,
   PRODUCT_DETAILS_REQUEST,
   PRODUCT_DETAILS_SUCCESS,
-} from '../../constants/productConstants';
+} from '../../constants/productConstants.js';
 
 export const productListReducer = (state = { products: [] }, action) => {
   switch (action.type) {