diff --git a/App.js b/App.js
new file mode 100644
index 0000000000..1eae97d902
--- /dev/null
+++ b/App.js
@@ -0,0 +1,34 @@
+import React from 'react';
+import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
+import LandingPage from './components/Landingpage';
+import LoginPage from './components/LoginPage';
+import DashboardPage from './components/DashboardPage';
+import GradeReportPage from './components/GradeReportPage';
+import MissingGradeFormPage from './components/MissingGradeFormPage';
+import InstructorContactPage from './components/InstructorContactPage';
+import HelpAndSupportPage from './components/HelpAndSupportPage';
+import Navbar from './components/Navbar';
+import Footer from './components/Footer';
+import './styles.css';
+
+const App = () => {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default App;
diff --git a/Backy.jpg b/Backy.jpg
new file mode 100644
index 0000000000..7c21993b54
Binary files /dev/null and b/Backy.jpg differ
diff --git a/Dash page.html b/Dash page.html
new file mode 100644
index 0000000000..af8f9d0793
--- /dev/null
+++ b/Dash page.html
@@ -0,0 +1,5 @@
+
+
+
+
+
+
+
+
+ Missing Grade Reporting System
+
+
+
+
+ Missing Grade Reporting System
+
+
+
+
+ Track and report missing grades
+ Ensure your academic record is accurate and up-to-date with our easy-to-use system.
+
+
+
+
+ Key Features
+
+ - Track your current grades and identify any missing ones.
+ - Report missing grades directly to your instructors or academic administration.
+ - Communicate with your instructors to resolve any grade discrepancies.
+
+
+
+
+
+
+
diff --git a/Landing page.js b/Landing page.js
new file mode 100644
index 0000000000..f37392413b
--- /dev/null
+++ b/Landing page.js
@@ -0,0 +1,35 @@
+import React from "react";
+
+function LandingPage() {
+ return (
+
+
+ Missing Grade Reporting System
+
+
+
+
+ Track and report missing grades
+ Ensure your academic record is accurate and up-to-date with our easy-to-use system.
+ Sign Up
+ Learn More
+
+
+
+ Key Features
+
+ - Track your current grades and identify missing ones.
+ - Report missing grades directly to your instructors or administration.
+ - Communicate with instructors to resolve grade discrepancies.
+
+
+
+
+
+
Missing Grade Reporting System
+
+
+
+
+ Login to your account
+
+
+
+
+
+
+
diff --git a/Login page.js b/Login page.js
new file mode 100644
index 0000000000..4870f8cfed
--- /dev/null
+++ b/Login page.js
@@ -0,0 +1,34 @@
+import React, { useState } from 'react';
+
+const LoginPage = () => {
+ const [studentId, setStudentId] = useState('');
+ const [pin, setPin] = useState('');
+
+ const handleLogin = () => {
+ // Add authentication logic here (mock-up)
+ console.log('Logging in with:', studentId, pin);
+ };
+
+ return (
+
+
Login
+
+
+ );
+};
+
+export default LoginPage;
diff --git a/MissingGradeFormPage.js b/MissingGradeFormPage.js
new file mode 100644
index 0000000000..df7446afc3
--- /dev/null
+++ b/MissingGradeFormPage.js
@@ -0,0 +1,46 @@
+import React, { useState } from 'react';
+
+const MissingGradeFormPage = () => {
+ const [courseName, setCourseName] = useState('');
+ const [instructorName, setInstructorName] = useState('');
+ const [expectedGrade, setExpectedGrade] = useState('');
+ const [explanation, setExplanation] = useState('');
+
+ const handleFormSubmit = () => {
+ // Add logic to handle form submission (mock-up)
+ console.log('Submitting missing grade report:', { courseName, instructorName, expectedGrade, explanation });
+ };
+
+ return (
+
+
Report Missing Grade
+