diff --git a/login-frontend/pack b/login-frontend/pack
deleted file mode 100644
index 526f06a..0000000
--- a/login-frontend/pack
+++ /dev/null
@@ -1,10 +0,0 @@
-
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.5",
-    "@fortawesome/fontawesome-free": "^6.5.2",
-    "@mui/icons-material": "^5.15.15",
-    "@mui/material": "^5.15.15",
-    "axios": "^1.6.8",
-    "bootstrap": "^5.3.3",
-    "react-bootstrap": "^2.10.2",
-    "react-router-dom": "^6.22.3"
\ No newline at end of file
diff --git a/login-frontend/src/App.js b/login-frontend/src/App.js
index d1772eb..5a615c3 100644
--- a/login-frontend/src/App.js
+++ b/login-frontend/src/App.js
@@ -4,10 +4,11 @@ import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
 import './App.css';
 import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
 
-import FirstPage from './pages/pages/FirstPage';
-import AuthPage from './pages/pages/authPage';
-import StudentDashBoard from './components/DashBoard/StudentDashboard';
-import { Login } from '@mui/icons-material';
+import FirstPage from './pages/FirstPage';
+import AuthPage from './pages/authPage';
+import StudentDashBoard from './pages/StudentDashboard';
+import Course from './components/coursePage/Course';
+import Course1 from './components/coursePage/Course1';
 
 function App() {
   const [username, setUsername] = useState('');
@@ -37,6 +38,8 @@ function App() {
         <Route path='/teacher/dashboard' element={< StudentDashBoard/>} />
         <Route path='/student/dashboard' element={< StudentDashBoard/>} />
         <Route path='/admin/dashboard' element={< StudentDashBoard/>} />
+        <Route path='/course' element={<Course />} />
+        <Route path='/course1' element={<Course1 />} />
       </Routes>
     </Router>
   );
diff --git a/login-frontend/src/components/DashBoard/studentInfo.js b/login-frontend/src/components/DashBoard/studentInfo.js
index c8a159e..72f57e8 100644
--- a/login-frontend/src/components/DashBoard/studentInfo.js
+++ b/login-frontend/src/components/DashBoard/studentInfo.js
@@ -1,5 +1,5 @@
 import React from 'react'; // Use React for functional components
-
+import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css';
 function StudentInfo(props) {
   return (
     <div className="student-info"> {/* Use a more specific class name */}
@@ -15,7 +15,7 @@ function StudentInfo(props) {
             Last profile photo update time: ___
           </p>
         </div>
-        <div className="data-box">
+        <div className="data-box col-3x">
           <p style={{ fontWeight: 'bold' }}>#Full Name</p>
           <p>SV000000</p>
           <p style={{ fontWeight: 'bold' }}>#Student ID</p>
diff --git a/login-frontend/src/components/coursePage/Course.js b/login-frontend/src/components/coursePage/Course.js
new file mode 100644
index 0000000..255b412
--- /dev/null
+++ b/login-frontend/src/components/coursePage/Course.js
@@ -0,0 +1,29 @@
+import React, { useState, useEffect } from 'react';
+import axios from 'axios';
+import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
+import Container from 'react-bootstrap/Container';
+import Nav from 'react-bootstrap/Nav';
+import Navbar from 'react-bootstrap/Navbar';
+import NavDropdown from 'react-bootstrap/NavDropdown';
+import { Button } from 'react-bootstrap';
+
+import Header from './../header_footer/Header';
+import Footer from './../header_footer/Footer';
+
+function Course() {
+  const course_bg = 'http://i.ibb.co/GVRnWJC/course-bg.jpg';
+  
+  return (
+    <>
+      <Header />
+      <div style={{ height: '80vh', backgroundImage: `url(${course_bg})`, backgroundSize: 'cover', backgroundPositionX: 'center', backgroundRepeat: 'noRepeat', border: '1px solid' }}>
+        <div style={{ marginTop: '0%', marginRight: 'auto', marginBottom: '0%', marginLeft: '15%', width: '50%', paddingTop: '2%', border: 'none' }}>
+          <h1>CHĂM CHỈ DỄ DÀNG THÀNH CÔNG</h1>
+        </div>
+      </div>
+      <Footer />
+    </>
+  );
+}
+
+export default Course;
\ No newline at end of file
diff --git a/login-frontend/src/components/coursePage/Course1.js b/login-frontend/src/components/coursePage/Course1.js
new file mode 100644
index 0000000..339cce9
--- /dev/null
+++ b/login-frontend/src/components/coursePage/Course1.js
@@ -0,0 +1,47 @@
+import React, { useState, useEffect } from 'react';
+import axios from 'axios';
+import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
+import Container from 'react-bootstrap/Container';
+import Nav from 'react-bootstrap/Nav';
+import Navbar from 'react-bootstrap/Navbar';
+import NavDropdown from 'react-bootstrap/NavDropdown';
+import { Button } from 'react-bootstrap';
+import Card from 'react-bootstrap/Card';
+import Col from 'react-bootstrap/Col';
+import Row from 'react-bootstrap/Row';
+
+import Header from './../header_footer/Header';
+import Footer from './../header_footer/Footer';
+
+function Course1() {
+  return (
+    <>
+      <Header />
+      <div style={{ margin: '5% 10%' }}>
+        <div style={{ marginBottom: '2%' }}>
+          <h2 style={{ color: '#eba234' }}>Khóa học của tôi</h2>
+        </div>
+        <Row xs={1} md={3} className="g-4">
+          {Array.from({ length: 7 }).map((_, idx) => (
+            <Col key={idx}>
+              <Card>
+                <Card.Img variant="top" src="holder.js/100px160" />
+                <Card.Body>
+                  <Card.Title>Card title</Card.Title>
+                  <Card.Text>
+                    This is a longer card with supporting text below as a natural
+                    lead-in to additional content. This content is a little bit
+                    longer.
+                  </Card.Text>
+                </Card.Body>
+              </Card>
+            </Col>
+          ))}
+        </Row>
+      </div>
+      <Footer />
+    </>
+  );
+}
+
+export default Course1;
\ No newline at end of file
diff --git a/login-frontend/src/components/header_footer/FirstFooter.js b/login-frontend/src/components/header_footer/FirstFooter.js
index 304a8cc..aa02d1f 100644
--- a/login-frontend/src/components/header_footer/FirstFooter.js
+++ b/login-frontend/src/components/header_footer/FirstFooter.js
@@ -6,10 +6,10 @@ import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css';
 function FirstFooter() {
   return (
     <>
-    <div style={{ marginTop: '5%', height: '100%', backgroundColor: '#0b3942', display: 'flex', textAlign: 'center' }}>
+    <div style={{ marginTop: '0%', height: '100%', backgroundColor: '#0b3942', display: 'flex', textAlign: 'center' }}>
         <div style={{ marginLeft: '8%', width: '12%' }}>
           <div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'blueviolet', borderRadius: '50%' }}>
-            <i class="fas fa-solid fa-phone fa-3x"></i>
+            <i class="fas fa-solid fa-phone fa-2x" style={{ marginTop: '25%', color: 'white' }}></i>
           </div>
           <div>
             <p style={{ color: 'white ', marginTop: '1rem' }}>
@@ -19,7 +19,7 @@ function FirstFooter() {
         </div>
         <div style={{ marginLeft: '3%', width: '12%' }}>
           <div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'blueviolet', borderRadius: '50%' }}>
-            <i class="fas fa-regular fa-envelope fa-3x"></i>
+            <i class="fas fa-regular fa-envelope fa-2x" style={{ marginTop: '25%', color: 'white' }}></i>
           </div>
           <div>
             <p style={{ color: 'white ', marginTop: '1rem' }}>
@@ -29,7 +29,7 @@ function FirstFooter() {
         </div>
         <div style={{ marginLeft: '3%', width: '12%' }}>
           <div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'blueviolet', borderRadius: '50%' }}>
-            <i class="fas fa-solid fa-location-dot fa-3x"></i>
+            <i class="fas fa-solid fa-location-dot fa-2x" style={{ marginTop: '25%', color: 'white' }}></i>
           </div>
           <div>
             <p style={{ color: 'white ', marginTop: '1rem' }}>
@@ -40,7 +40,7 @@ function FirstFooter() {
 
         <div style={{ marginLeft: '4%', width: '12%' }}>
           <div style={{ marginTop: '30%', marginRight: '30%', marginLeft: '30%', width: '40%', height: '40%', backgroundColor: 'white', borderRadius: '50%' }}>
-            <i class="fas fa-solid fa-paper-plane fa-3x"></i>
+            <i class="fas fa-solid fa-paper-plane fa-2x" style={{ marginTop: '25%', color: 'blueviolet' }}></i>
           </div>
           <div>
             <p style={{ color: 'white ', marginTop: '1rem' }}>
@@ -61,7 +61,7 @@ function FirstFooter() {
         </div>
     </div>
     </>
-  )
+  );
 }
 
 export default FirstFooter;
\ No newline at end of file
diff --git a/login-frontend/src/components/header_footer/FirstHeader.js b/login-frontend/src/components/header_footer/FirstHeader.js
index adafc87..334897c 100644
--- a/login-frontend/src/components/header_footer/FirstHeader.js
+++ b/login-frontend/src/components/header_footer/FirstHeader.js
@@ -7,7 +7,7 @@ import { styled } from "@mui/material/styles";
 import Badge from "@mui/material/Badge";
 import NotificationsIcon from "@mui/icons-material/Notifications";
 
-function Header() {
+function FirstHeader() {
   const [notifications, setNotifications] = useState([]);
 
   const StyledBadge = styled(Badge)(() => ({
@@ -21,8 +21,17 @@ function Header() {
   return (
     <>
       <Navbar style={{ display: 'flex' }}>
-        <img style={{ width: '15%' }} src={'https://i.ibb.co/CMwkBmw/lSgDz8N.png'} alt="logo" />
-        <div style={{ marginLeft: '62%', width: '10%' }}>
+        <img style={{ width: '20vh', marginLeft: '3vh' }} src={'https://i.ibb.co/CMwkBmw/lSgDz8N.png'} alt="logo" />
+        <Link to={'/teacher'} style={{ marginLeft: '5vh', color: 'black', textDecorationLine: 'none' }}>
+          <h4 style={{width:'15vh'}}>GIẢNG VIÊN</h4>
+        </Link>
+        <Link to={'/student'} style={{ color: 'black', textDecorationLine: 'none' }}>
+          <h4 style={{width:'15vh'}}>SINH VIÊN</h4>
+        </Link>
+        <Link to={'/admin'} style={{ color: 'black', textDecorationLine: 'none' }}>
+          <h4 style={{width:'15vh'}}>QUẢN LÝ</h4>
+        </Link>
+        <div style={{ marginLeft: '40vh', width: '10%' }}>
           <Dropdown className="ms-2 me-2">
             <Dropdown.Toggle
               variant="light"
@@ -61,12 +70,9 @@ function Header() {
             </Dropdown.Menu>
           </Dropdown>
         </div>
-        <div style={{ marginLeft: '2%', width: '10%', backgroundColor: 'gainsboro', borderRadius: '50%', textAlign: 'center' }}>
-          <p style={{ padding: '15% 0%', marginTop: '1rem' }}>TÊN VIẾT TẮT</p>
-        </div>
       </Navbar>
     </>
-  )
+  );
 }
 
-export default Header;
\ No newline at end of file
+export default FirstHeader;
\ No newline at end of file
diff --git a/login-frontend/src/components/header_footer/Footer.js b/login-frontend/src/components/header_footer/Footer.js
new file mode 100644
index 0000000..e6cb36a
--- /dev/null
+++ b/login-frontend/src/components/header_footer/Footer.js
@@ -0,0 +1,20 @@
+import React, { useState, useEffect } from 'react';
+import axios from 'axios';
+import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
+
+function Footer() {
+  return (
+    <>
+      <div className="text-center foot">
+        <p style={{ paddingTop: '2vh', margin: 0 }}>
+          Copyright &copy; 2024 | All rights reserved
+        </p>
+        <p style={{ padding: '1vh', margin: 0 }}>
+          Mọi thắc mắc vui lòng liên hệ email: info@mut.edu.vn
+        </p>
+      </div>
+    </>
+  );
+}
+
+export default Footer;
\ No newline at end of file
diff --git a/login-frontend/src/components/header_footer/Header.js b/login-frontend/src/components/header_footer/Header.js
new file mode 100644
index 0000000..43df0e1
--- /dev/null
+++ b/login-frontend/src/components/header_footer/Header.js
@@ -0,0 +1,37 @@
+import React, { useState, useEffect } from 'react';
+import axios from 'axios';
+import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
+import { Navbar, Nav, Form, Button, Row, Col } from "react-bootstrap";
+import NavDropdown from 'react-bootstrap/NavDropdown';
+
+function Header() {
+  return (
+    <>
+      <Navbar expand="lg">
+        <img style={{ width: '15%' }} src={'https://i.ibb.co/CMwkBmw/lSgDz8N.png'} alt="logo" />
+        {/*<Navbar.Toggle aria-controls="basic-navbar-nav" />*/}
+        <Navbar.Collapse id="basic-navbar-nav" style={{ marginLeft: '5%' }}>
+          <Nav className="me-auto">
+            <NavDropdown title="Các khóa học" id="basic-nav-dropdown" style={{ fontSize: '1.5em' }}>
+              <NavDropdown.Item href="/course1">Khóa học của tôi</NavDropdown.Item>
+            </NavDropdown>
+            <Nav.Link href="/course3" style={{ fontSize: '1.5em' }}>Đăng ký môn học</Nav.Link>
+          </Nav>
+        </Navbar.Collapse>
+        <div>
+          <h4 style={{ marginTop: '0.5rem' }}>NGUYEN VAN A - MSSV</h4>
+        </div>
+        <Button style={{ marginLeft: '3%', color: 'black', backgroundColor: 'white', border: 'none' }}>
+          <div style={{ marginLeft: '30%', marginRight: '30%', backgroundColor: 'blue', borderRadius: '50%' }}>
+            <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M14 5L12.59 6.41L14.17 8H6V10H14.17L12.59 11.58L14 13L18 9L14 5ZM2 2H9V0H2C0.9 0 0 0.9 0 2V16C0 17.1 0.9 18 2 18H9V16H2V2Z" fill="white" />
+            </svg>
+          </div>
+          <h6>Đăng xuất</h6>
+        </Button>
+      </Navbar>
+    </>
+  );
+}
+
+export default Header;
\ No newline at end of file
diff --git a/login-frontend/src/pages/FirstPage.js b/login-frontend/src/pages/FirstPage.js
new file mode 100644
index 0000000..49fadb9
--- /dev/null
+++ b/login-frontend/src/pages/FirstPage.js
@@ -0,0 +1,33 @@
+import React, { useState, useEffect } from 'react';
+import '../../node_modules/bootstrap/dist/css/bootstrap.min.css';
+import '../../node_modules/@fortawesome/fontawesome-free/css/all.css';
+import axios from 'axios';
+import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
+import FirstHeader from './../components/header_footer/FirstHeader';
+import FirstFooter from './../components/header_footer/FirstFooter';
+//import './FirstPage.css';
+
+const slide1 = 'https://i.ibb.co/RbNBFv1/8ktXyJ-n.jpg';
+
+function FirstPage() {
+  return (
+    <>
+      <FirstHeader />
+      <div style={{ height: '75vh', backgroundImage: `url(${slide1})`, backgroundSize: 'cover', backgroundPositionX: 'center', backgroundRepeat: 'noRepeat' }}>
+        <div style={{ marginTop: '0%', marginRight: '50%', marginBottom: '0%', marginLeft: '22%', width: '28%', padding: '0%', border: 'none', }}>
+          <h2 style={{ color: '#fff', fontSize: '1.5em' }}>
+            CHƯƠNG TRÌNH CHẤT LƯỢNG VỚI ĐA DẠNG NGÀNH
+          </h2>
+          <div style={{ marginTop: '1%', marginRight: '35%', marginBottom: '1%', marginLeft: '10%', width: '55%', padding: '0%', borderColor: '#ebff00', borderStyle: 'solid', borderWidth: '1px', borderRadius: '20px' }}>
+            <h3 style={{ color: '#ebff00', textAlign: 'center', marginBlockStart: '3px', marginBlockEnd: '3px', fontSize: '1.17em' }}>
+              Training Program
+            </h3>
+          </div>
+        </div>
+      </div>
+      <FirstFooter/>
+    </>
+  );
+}
+
+export default FirstPage;
diff --git a/login-frontend/src/components/DashBoard/StudentDashboard.css b/login-frontend/src/pages/StudentDashboard.css
similarity index 86%
rename from login-frontend/src/components/DashBoard/StudentDashboard.css
rename to login-frontend/src/pages/StudentDashboard.css
index 0b41b57..1060c35 100644
--- a/login-frontend/src/components/DashBoard/StudentDashboard.css
+++ b/login-frontend/src/pages/StudentDashboard.css
@@ -28,22 +28,21 @@
   background-color: wheat;
   height: 8%;
 }
-.navigation a{
+a{
   color: #020202;
   padding: 2vh 10vh;
   text-decoration: none;
 }
+.active{
+  border-top: 3px solid blue;
+}
 .smallbox {
   background-color: rgb(204, 203, 203);
   font-weight: bold;
   width: 95%;
   margin: auto;
-}
-.smallbox p {
   box-shadow: 2px 2px 10px rgb(104, 103, 103);
 }
-.data_box {
-  margin-left: 1vh;
+.data-box{
   width: 35vh;
-  border-right: 1px solid rgb(204, 203, 203);
 }
\ No newline at end of file
diff --git a/login-frontend/src/components/DashBoard/StudentDashboard.js b/login-frontend/src/pages/StudentDashboard.js
similarity index 63%
rename from login-frontend/src/components/DashBoard/StudentDashboard.js
rename to login-frontend/src/pages/StudentDashboard.js
index 721c0d2..f41d615 100644
--- a/login-frontend/src/components/DashBoard/StudentDashboard.js
+++ b/login-frontend/src/pages/StudentDashboard.js
@@ -1,6 +1,9 @@
 import React, { useState } from 'react';
-import StudentInfo from './studentInfo';
-import Training from './studentTraining';
+import StudentInfo from './../components/DashBoard/studentInfo';
+import Training from './../components/DashBoard/studentTraining';
+import Footer from './../components/header_footer/Footer';
+import '../../node_modules/bootstrap/dist/css/bootstrap.min.css';
+import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
 import './StudentDashboard.css';
 
 function DataTable() {
@@ -9,6 +12,7 @@ function DataTable() {
   const handleNavigation = (viewName) => {
     setCurrentView(viewName);
   };
+  const [isOpen, setIsOpen] = useState(false);
 
   return (
     <div className="student-dashboard">
@@ -16,14 +20,14 @@ function DataTable() {
         <a className="navbar-brand" href="#">
           <img className="logo" src="https://i.ibb.co/CMwkBmw/lSgDz8N.png" alt="logo" />
         </a>
-        <ul className="navbar-nav ml-auto">
-          <li className="nav-item">
+        <ul className="navbar-nav ms-auto">
+          <li style={{padding: '2vh'}}>
             <a className="nav-link" href="#">Nguyen Van A - SVxxxxx</a>
           </li>
-          <li className="nav-item">
+          <li style={{padding: '2vh'}}>
             <i className="fa fa-solid fa-bell fa-lg fa-3x"></i>
+            Logout
           </li>
-          <li className="nav-item">Logout</li>
         </ul>
       </nav>
 
@@ -37,8 +41,15 @@ function DataTable() {
               <li className="nav-item" style={{ paddingTop: '2rem' }}>
                 <i className="fas fa-regular fa-id-badge fa-md fa-2x"></i> Student
               </li>
-              <li className="nav-item" style={{ paddingTop: '2rem' }}>
-                <i className="fa fa-solid fa-book fa-md fa-2x"></i> Course
+              <li className="nav-item" style={{ paddingTop: '2rem', cursor: 'pointer'}} onClick={() => setIsOpen(!isOpen)}>
+                <i className="fa fa-solid fa-book fa-md fa-2x"></i>  Study
+                <i class="fa-solid fa-angles-down"></i>
+                {isOpen && (
+                  <ul>                    
+                    <li className="nav-item" style={{ paddingTop: '2rem'}}><Link to={'/course'} style={{color: 'white', padding: '0'}}>Course</Link></li>
+                    <li className="nav-item" style={{ paddingTop: '2rem' }}><Link to={'/course1'} style={{color: 'white', padding: '0'}}>Course registration</Link></li>
+                  </ul>
+                )}
               </li>
               <li className="nav-item" style={{ paddingTop: '2rem' }}>
                 <i className="fa fa-solid fa-question fa-md fa-2x"></i> Assistant
@@ -48,13 +59,12 @@ function DataTable() {
 
           <div className="col-md-10 rightBody">
             <div className="dataTable mx-auto">
-              <div className="navigation">
-                <nav>
+              <nav>
+                <div className="navigation">
                   <a
-                    href="#"
                     onClick={() => handleNavigation('StudentInfo')}
-                    id="info"
-                    style={{ fontWeight: 'bold', borderTop: '3px solid blue' }}
+                    style={{ fontWeight: 'bold'}}
+                    className={currentView === 'StudentInfo' ? 'active' : ''}
                   >
                     Student Information
                   </a>
@@ -62,11 +72,12 @@ function DataTable() {
                     href="#"
                     onClick={() => handleNavigation('Training')}
                     style={{ fontWeight: 'bold' }}
+                    className={currentView === 'Training' ? 'active' : ''}
                   >
                     Training Information
                   </a>
-                </nav>
-              </div>
+                </div>
+              </nav>
               <div style={{ padding: '10px' }}>
                 <i style={{ fontWeight: 'bold' }}>Last updated time: dd/mm/yyyy realtime</i>
               </div>
@@ -76,15 +87,7 @@ function DataTable() {
           </div>
         </div>
       </div>
-
-      <div className="text-center foot">
-        <p style={{ paddingTop: '2vh', margin: 0 }}>
-          Copyright &copy; 2024 | All rights reserved
-        </p>
-        <p style={{ padding: '1vh', margin: 0 }}>
-          Mọi thắc mắc vui lòng liên hệ email: info@mut.edu.vn
-        </p>
-      </div>
+      <Footer />
     </div>
   );
 }
diff --git a/login-frontend/src/pages/pages/authPage.js b/login-frontend/src/pages/authPage.js
similarity index 89%
rename from login-frontend/src/pages/pages/authPage.js
rename to login-frontend/src/pages/authPage.js
index 61bfdfa..de937ee 100644
--- a/login-frontend/src/pages/pages/authPage.js
+++ b/login-frontend/src/pages/authPage.js
@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
-import { AuthProvider } from '../../context/authContext';
-import Login from '../../components/auth/login';
-import Register from '../../components/auth/register';
+import { AuthProvider } from '../context/authContext';
+import Login from '../components/auth/login';
+import Register from '../components/auth/register';
 
 const authBG = "https://i.ibb.co/9YFh3Tn/lhuEjVn.jpg";
 const logo = "https://i.ibb.co/CMwkBmw/lSgDz8N.png";
@@ -25,7 +25,6 @@ function App() {
           mozOsxFontSmoothing: 'grayscale',
           backgroundImage: `url(${authBG})`,
           backgroundSize: 'cover',
-          margin: 0,
         }}
       >
         <div className="row">
diff --git a/login-frontend/src/pages/pages/FirstPage.js b/login-frontend/src/pages/pages/FirstPage.js
deleted file mode 100644
index 207ecdc..0000000
--- a/login-frontend/src/pages/pages/FirstPage.js
+++ /dev/null
@@ -1,53 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css';
-import '../../../node_modules/@fortawesome/fontawesome-free/css/all.css';
-import axios from 'axios';
-import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
-import FirstHeader from '../../components/header_footer/FirstHeader';
-import FirstFooter from '../../components/header_footer/FirstFooter';
-//import './FirstPage.css';
-
-const slide1 = 'https://i.ibb.co/RbNBFv1/8ktXyJ-n.jpg';
-
-function FirstPage() {
-  return (
-    <>
-      <FirstHeader />
-      <div style={{backgroundImage: `url(${slide1})`, backgroundSize: 'cover', backgroundPositionX: 'center', backgroundRepeat: 'noRepeat' }}>
-        <div style={{ marginTop: '0%', marginRight: '50%', marginBottom: '0%', marginLeft: '22%', width: '28%', padding: '0%', border: 'none', }}>
-          <h2 style={{ color: '#fff', fontSize: '1.5em' }}>
-            CHƯƠNG TRÌNH CHẤT LƯỢNG VỚI ĐA DẠNG NGÀNH
-          </h2>
-          <div style={{ marginTop: '1%', marginRight: '35%', marginBottom: '1%', marginLeft: '10%', width: '55%', padding: '0%', borderColor: '#ebff00', borderStyle: 'solid', borderWidth: '1px', borderRadius: '20px' }}>
-            <h3 style={{ color: '#ebff00', textAlign: 'center', marginBlockStart: '3px', marginBlockEnd: '3px', fontSize: '1.17em' }}>
-              Training Program
-            </h3>
-          </div>
-        </div>
-        <div style={{ marginTop: '0%', marginRight: '0%', marginBottom: '0%', marginLeft: '0%', width: '100%', padding: '0%', display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gridGap: '10px' }}>
-          <Link to={'/teacher'} style={{ marginTop: '70%', marginRight: '0%', marginBottom: '0%', marginLeft: '60%', width: '40%', height: '45%', padding: '0%', backgroundColor: '#9ff5f5', textAlign: 'center', textDecorationLine: 'none' }}>
-            <h3 style={{ color: '#2909a7', textAlign: 'center', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
-              TEACHER
-            </h3>
-            <i class="fa-solid fa-person-chalkboard fa-md fa-5x"></i>
-          </Link>
-          <Link to={'/student'} style={{ marginTop: '70%', marginRight: '0%', marginBottom: '0%', marginLeft: '30%', width: '40%', height: '45%', padding: '0%', backgroundColor: '#9ff5f5', textAlign: 'center', textDecorationLine: 'none' }}>
-            <h3 style={{ color: '#2909a7', textAlign: 'center', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
-              STUDENT
-            </h3>
-            <i class="fa-solid fa-person-chalkboard fa-md fa-5x"></i>
-          </Link>
-          <Link to={'/admin'} style={{ marginTop: '70%', marginRight: '0%', marginBottom: '0%', marginLeft: '0%', width: '40%', height: '45%', padding: '0%', backgroundColor: '#9ff5f5', textAlign: 'center', textDecorationLine: 'none' }}>
-            <h3 style={{ color: '#2909a7', textAlign: 'center', marginBlockStart: '1em', marginBlockEnd: '1em' }}>
-              ADMIN
-            </h3>
-            <i class="fa-solid fa-person-chalkboard fa-md fa-5x"></i>
-          </Link>
-        </div>
-      </div>
-      <FirstFooter />
-    </>
-  )
-}
-
-export default FirstPage;