diff --git a/front/package.json b/front/package.json
index d50c1d290..27b02a40a 100644
--- a/front/package.json
+++ b/front/package.json
@@ -56,7 +56,9 @@
   },
   "jest": {
     "coveragePathIgnorePatterns": [
-      ".stories.tsx$"
+      ".stories.tsx$",
+      "graphql.tsx$",
+      "apollo.tsx$"
     ],
     "coverageThreshold": {
       "global": {
diff --git a/front/src/App.tsx b/front/src/App.tsx
index 779b553ec..1f6a29d88 100644
--- a/front/src/App.tsx
+++ b/front/src/App.tsx
@@ -6,6 +6,7 @@ import Login from './pages/auth/Login';
 import AppLayout from './layout/AppLayout';
 import { Routes, Route, Navigate } from 'react-router-dom';
 import RequireAuth from './components/auth/RequireAuth';
+import Opportunities from './pages/opportunities/Opportunities';
 
 function App() {
   const user = {
@@ -50,6 +51,14 @@ function App() {
                 </RequireAuth>
               }
             />
+            <Route
+              path="/opportunities"
+              element={
+                <RequireAuth>
+                  <Opportunities />
+                </RequireAuth>
+              }
+            />
             <Route path="/auth/callback" element={<AuthCallback />} />
             <Route path="/auth/login" element={<Login />} />
           </Routes>
diff --git a/front/src/layout/navbar/Navbar.tsx b/front/src/layout/navbar/Navbar.tsx
index 41ddaac11..7413c71a1 100644
--- a/front/src/layout/navbar/Navbar.tsx
+++ b/front/src/layout/navbar/Navbar.tsx
@@ -6,7 +6,10 @@ import NavItem from './NavItem';
 import NavTitle from './NavTitle';
 import WorkspaceContainer from './WorkspaceContainer';
 import { faUser } from '@fortawesome/pro-regular-svg-icons';
-import { faBuildings } from '@fortawesome/pro-regular-svg-icons';
+import {
+  faBuildings,
+  faBullseyeArrow,
+} from '@fortawesome/pro-regular-svg-icons';
 
 const NavbarContainer = styled.div`
   display: flex;
@@ -56,6 +59,17 @@ function Navbar({ workspace }: OwnProps) {
               })
             }
           />
+          <NavItem
+            label="Opportunities"
+            to="/opportunities"
+            icon={faBullseyeArrow}
+            active={
+              !!useMatch({
+                path: useResolvedPath('/opportunities').pathname,
+                end: true,
+              })
+            }
+          />
         </NavItemsContainer>
       </NavbarContainer>
     </>
diff --git a/front/src/pages/opportunities/Opportunities.tsx b/front/src/pages/opportunities/Opportunities.tsx
new file mode 100644
index 000000000..ff9dbd14f
--- /dev/null
+++ b/front/src/pages/opportunities/Opportunities.tsx
@@ -0,0 +1,12 @@
+import { faBullseyeArrow } from '@fortawesome/pro-regular-svg-icons';
+import WithTopBarContainer from '../../layout/containers/WithTopBarContainer';
+
+function Opportunities() {
+  return (
+    <WithTopBarContainer title="Opportunities" icon={faBullseyeArrow}>
+      <></>
+    </WithTopBarContainer>
+  );
+}
+
+export default Opportunities;
diff --git a/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx b/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx
new file mode 100644
index 000000000..476b38e4e
--- /dev/null
+++ b/front/src/pages/opportunities/__stories__/Opportunities.stories.tsx
@@ -0,0 +1,19 @@
+import { MemoryRouter } from 'react-router-dom';
+import Opportunities from '../Opportunities';
+import { ThemeProvider } from '@emotion/react';
+import { lightTheme } from '../../../layout/styles/themes';
+
+const component = {
+  title: 'Opportunities',
+  component: Opportunities,
+};
+
+export default component;
+
+export const OpportunitiesDefault = () => (
+  <ThemeProvider theme={lightTheme}>
+    <MemoryRouter>
+      <Opportunities />
+    </MemoryRouter>
+  </ThemeProvider>
+);
diff --git a/front/src/pages/opportunities/__tests__/Opportunities.test.tsx b/front/src/pages/opportunities/__tests__/Opportunities.test.tsx
new file mode 100644
index 000000000..061ee00cc
--- /dev/null
+++ b/front/src/pages/opportunities/__tests__/Opportunities.test.tsx
@@ -0,0 +1,10 @@
+import { render } from '@testing-library/react';
+
+import { OpportunitiesDefault } from '../__stories__/Opportunities.stories';
+
+it('Checks the Companies page render', () => {
+  const { getByTestId } = render(<OpportunitiesDefault />);
+
+  const title = getByTestId('top-bar-title');
+  expect(title).toHaveTextContent('Opportunities');
+});