# Login as First Page

This section explains how to set the login page as the default starting page, skipping the landing page for cases where it is not needed.

{% tabs %}
{% tab title="VITE (TS)" %}
This section explains how to set the Login page as the default starting page, skipping the landing page, for cases where it is not needed.

1. Update Route start: ***full-version\src\routes\index.tsx***

{% code title="src\routes\index.tsx" %}

```typescript
// import { lazy } from 'react';
import { createBrowserRouter } from 'react-router-dom';

// routes
import AuthenticationRoutes from './AuthenticationRoutes';
import LoginRoutes from './LoginRoutes';
import MainRoutes from './MainRoutes';
import SimpleRoutes from './SimpleRoutes';

// project imports
// import Loadable from 'ui-component/Loadable';

// const PagesLanding = Loadable(lazy(() => import('views/pages/landing')));

// ==============================|| ROUTING RENDER ||============================== //

const router = createBrowserRouter(
  [
    // { path: '/', element: <PagesLanding /> },
    LoginRoutes,
    AuthenticationRoutes,
    SimpleRoutes,
    MainRoutes
  ],
  {
    basename: import.meta.env.VITE_APP_BASE_NAME
  }
);

export default router;
```

{% endcode %}

2. Add default Login route: ***full-version\src\routes\LoginRoutes.tsx***

{% code title="src\routes\LoginRoutes.tsx" %}

```typescript
import { lazy } from 'react';

// project imports
import GuestGuard from 'utils/route-guard/GuestGuard';
import MinimalLayout from 'layout/MinimalLayout';
import NavMotion from 'layout/NavMotion';
import Loadable from 'ui-component/Loadable';

// login routing
const AuthLogin = Loadable(lazy(() => import('views/pages/authentication/authentication3/Login3')));
const AuthRegister = Loadable(lazy(() => import('views/pages/authentication/authentication3/Register3')));
const AuthForgotPassword = Loadable(lazy(() => import('views/pages/authentication/authentication3/ForgotPassword3')));

// ==============================|| AUTH ROUTING ||============================== //

const LoginRoutes = {
    path: '/',
    element: (
        <NavMotion>
            <GuestGuard>
                <MinimalLayout />
            </GuestGuard>
        </NavMotion>
    ),
    children: [
        {
            path: '/',
            element: <AuthLogin />
        },
        {
            path: '/login',
            element: <AuthLogin />
        },
        {
            path: '/register',
            element: <AuthRegister />
        },
        {
            path: '/forgot',
            element: <AuthForgotPassword />
        }
    ]
};

export default LoginRoutes;
```

{% endcode %}
{% endtab %}

{% tab title="VITE (JS)" %}
This section explains how to set the Login page as the default starting page, skipping the landing page, for cases where it is not needed.

1. Update Route start: ***full-version\src\routes\index.tsx***

{% code title="src\routes\index.jsx" %}

```typescript
// import { lazy } from 'react';
import { createBrowserRouter } from 'react-router-dom';

// routes
import AuthenticationRoutes from './AuthenticationRoutes';
import LoginRoutes from './LoginRoutes';
import MainRoutes from './MainRoutes';
import SimpleRoutes from './SimpleRoutes';

// project imports
// import Loadable from 'ui-component/Loadable';

// const PagesLanding = Loadable(lazy(() => import('views/pages/landing')));

// ==============================|| ROUTING RENDER ||============================== //

const router = createBrowserRouter(
  [
    // { path: '/', element: <PagesLanding /> },
    LoginRoutes,
    AuthenticationRoutes,
    SimpleRoutes,
    MainRoutes
  ],
  {
    basename: import.meta.env.VITE_APP_BASE_NAME
  }
);

export default router;
```

{% endcode %}

2. Add default Login route: ***full-version\src\routes\LoginRoutes.tsx***

{% code title="src\routes\LoginRoutes.jsx" %}

```typescript
import { lazy } from 'react';

// project imports
import GuestGuard from 'utils/route-guard/GuestGuard';
import MinimalLayout from 'layout/MinimalLayout';
import NavMotion from 'layout/NavMotion';
import Loadable from 'ui-component/Loadable';

// login routing
const AuthLogin = Loadable(lazy(() => import('views/pages/authentication/authentication3/Login3')));
const AuthRegister = Loadable(lazy(() => import('views/pages/authentication/authentication3/Register3')));
const AuthForgotPassword = Loadable(lazy(() => import('views/pages/authentication/authentication3/ForgotPassword3')));

// ==============================|| AUTH ROUTING ||============================== //

const LoginRoutes = {
    path: '/',
    element: (
        <NavMotion>
            <GuestGuard>
                <MinimalLayout />
            </GuestGuard>
        </NavMotion>
    ),
    children: [
        {
            path: '/',
            element: <AuthLogin />
        },
        {
            path: '/login',
            element: <AuthLogin />
        },
        {
            path: '/register',
            element: <AuthRegister />
        },
        {
            path: '/forgot',
            element: <AuthForgotPassword />
        }
    ]
};

export default LoginRoutes;
```

{% endcode %}
{% endtab %}

{% tab title="NEXT (TS)" %}
This section explains how to set the Login page as the default starting page, skipping the landing page, for cases where it is not needed.

1. Update Route start: ***full-version/*****src/app/page.tsx**

{% code title="src/app/page.tsx" %}

```typescript
// project import
import MinimalLayout from 'layout/MinimalLayout';
import GuestGuard from 'utils/route-guard/GuestGuard';
// import Landing from 'views/pages/landing';
import Login from 'views/pages/authentication/Login';

// ==============================|| HOME PAGE ||============================== //

export default function HomePage() {
  return (
    <MinimalLayout>
      <GuestGuard>
        <Login />
      </GuestGuard>
    </MinimalLayout>
  );
}
```

{% endcode %}
{% endtab %}

{% tab title="NEXT (JS)" %}
This section explains how to set the Login page as the default starting page, skipping the landing page, for cases where it is not needed.

1. Update Route start: ***full-version/*****src/app/page.jsx**

{% code title="src/app/page.jsx" %}

```typescript
// project import
import MinimalLayout from 'layout/MinimalLayout';
import GuestGuard from 'utils/route-guard/GuestGuard';
// import Landing from 'views/pages/landing';
import Login from 'views/pages/authentication/Login';

// ==============================|| HOME PAGE ||============================== //

export default function HomePage() {
  return (
    <MinimalLayout>
      <GuestGuard>
        <Login />
      </GuestGuard>
    </MinimalLayout>
  );
}
```

{% endcode %}
{% endtab %}
{% endtabs %}