diff --git a/client/src/Components/index.jsx b/client/src/Components/index.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..7477febb86a37673d07826726cc623070d5fa30d
--- /dev/null
+++ b/client/src/Components/index.jsx
@@ -0,0 +1,51 @@
+import React,{Component} from 'react';
+import { Redirect } from 'react-router-dom';
+import Navbar from './navbar';
+import './component.css';
+
+
+
+class MainPage extends Component {
+    state = {
+      toslogin: false,
+      totlogin: false,
+      toalogin: false,
+    }
+    handleSubmit1 = (user) => {
+      this.setState(() => ({
+          toslogin: true
+        }))
+    }
+   
+    handleSubmit3 = (user) => {
+      this.setState(() => ({
+          toalogin: true
+        }))
+    }
+    render() {
+      if (this.state.toslogin === true) {
+        return <Redirect to='/Slogin' />
+      }
+      
+      else if(this.state.toalogin === true) {
+        return <Redirect to='/Alogin' />
+      }
+      
+  
+      return(
+        <div>
+            <Navbar />
+            <h1 style={{textAlign : "center", color : "orange",fontFamily:"serif"}}><b>BOOK MANAGEMENT SYSTEM</b></h1>
+            <br/><br/><br/><br/><br/>          
+            <div>
+            <p><button class="color-1 btn btn-1 btn-1e" onClick={this.handleSubmit1}><b>User</b></button></p>
+          
+            <button class="color-3 btn btn-1 btn-1f" onClick={this.handleSubmit3}><b>Admin</b></button>
+            </div>
+        </div>
+     );
+ 
+    }
+  }
+    
+export default MainPage;
\ No newline at end of file