├── public
├── favicon.ico
├── logo192.png
├── logo512.png
├── robots.txt
├── manifest.json
└── index.html
├── src
├── assets
│ ├── Logo.png
│ ├── Margo.jpg
│ ├── profile.png
│ ├── lp_vector.png
│ └── icon _search.png
├── setupTests.js
├── App.test.js
├── reportWebVitals.js
├── index.css
├── index.js
├── Doc.js
├── Patient3.js
├── profile.js
├── App.css
├── Navbar.js
├── TodaysApp.css
├── Navbar.css
├── Patient2.css
├── Patient2.js
├── Psign.js
├── SignUp.js
├── DocList.js
├── Patient1.js
├── profile.css
├── login.js
├── Doclist.css
├── App.js
├── landingPage.js
├── TodaysApp.js
├── Patient1.css
├── Dlogin.js
├── logo.svg
├── Psign.css
├── Dsign.css
├── Dsignup.js
├── SignUp.css
├── login.css
├── Patient3.css
├── Dsign.js
└── landingPage.css
├── backend
└── models
│ ├── patientschema.js
│ ├── drschema.js
│ ├── PatientInfo.js
│ └── DrInfo.js
├── .gitignore
├── package.json
├── README.md
└── server.js
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/public/favicon.ico
--------------------------------------------------------------------------------
/public/logo192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/public/logo192.png
--------------------------------------------------------------------------------
/public/logo512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/public/logo512.png
--------------------------------------------------------------------------------
/src/assets/Logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/src/assets/Logo.png
--------------------------------------------------------------------------------
/src/assets/Margo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/src/assets/Margo.jpg
--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | # https://www.robotstxt.org/robotstxt.html
2 | User-agent: *
3 | Disallow:
4 |
--------------------------------------------------------------------------------
/src/assets/profile.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/src/assets/profile.png
--------------------------------------------------------------------------------
/src/assets/lp_vector.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/src/assets/lp_vector.png
--------------------------------------------------------------------------------
/src/assets/icon _search.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/akpadia02/HTF_24/HEAD/src/assets/icon _search.png
--------------------------------------------------------------------------------
/backend/models/patientschema.js:
--------------------------------------------------------------------------------
1 | const mongoose = require('mongoose')
2 | const patientSchema = new mongoose.Schema({
3 | email: String,
4 | password: String,
5 | });
6 | const Patient = mongoose.model('Patient', patientSchema);
7 | module.exports = Patient;
--------------------------------------------------------------------------------
/src/setupTests.js:
--------------------------------------------------------------------------------
1 | // jest-dom adds custom jest matchers for asserting on DOM nodes.
2 | // allows you to do things like:
3 | // expect(element).toHaveTextContent(/react/i)
4 | // learn more: https://github.com/testing-library/jest-dom
5 | import '@testing-library/jest-dom';
6 |
--------------------------------------------------------------------------------
/backend/models/drschema.js:
--------------------------------------------------------------------------------
1 | const mongoose=require('mongoose')
2 |
3 | const doctorSchema = new mongoose.Schema({
4 | email: String,
5 | password: String,
6 | });
7 |
8 | const Doctor = mongoose.model('Doctor', doctorSchema);
9 |
10 | module.exports=Doctor;
--------------------------------------------------------------------------------
/src/App.test.js:
--------------------------------------------------------------------------------
1 | import { render, screen } from '@testing-library/react';
2 | import App from './App';
3 |
4 | test('renders learn react link', () => {
5 | render( );
6 | const linkElement = screen.getByText(/learn react/i);
7 | expect(linkElement).toBeInTheDocument();
8 | });
9 |
--------------------------------------------------------------------------------
/backend/models/PatientInfo.js:
--------------------------------------------------------------------------------
1 | const mongoose = require('mongoose')
2 | const patientInfoSchema = new mongoose.Schema({
3 | name: String,
4 | age: String,
5 | address: String,
6 | });
7 | const patientInfo = mongoose.model('patientInfo', patientInfoSchema);
8 | module.exports = patientInfo;
--------------------------------------------------------------------------------
/backend/models/DrInfo.js:
--------------------------------------------------------------------------------
1 | const mongoose = require('mongoose')
2 | const drInfoSchema = new mongoose.Schema({
3 | name: String,
4 | age: String,
5 | qualification: String,
6 | experience: String,
7 | address: String,
8 | about: String,
9 | });
10 | const drInfo = mongoose.model('drInfo', drInfoSchema);
11 | module.exports = drInfo;
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # production
12 | /build
13 |
14 | # misc
15 | .DS_Store
16 | .env.local
17 | .env.development.local
18 | .env.test.local
19 | .env.production.local
20 |
21 | npm-debug.log*
22 | yarn-debug.log*
23 | yarn-error.log*
24 |
--------------------------------------------------------------------------------
/src/reportWebVitals.js:
--------------------------------------------------------------------------------
1 | const reportWebVitals = onPerfEntry => {
2 | if (onPerfEntry && onPerfEntry instanceof Function) {
3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
4 | getCLS(onPerfEntry);
5 | getFID(onPerfEntry);
6 | getFCP(onPerfEntry);
7 | getLCP(onPerfEntry);
8 | getTTFB(onPerfEntry);
9 | });
10 | }
11 | };
12 |
13 | export default reportWebVitals;
14 |
--------------------------------------------------------------------------------
/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
5 | sans-serif;
6 | -webkit-font-smoothing: antialiased;
7 | -moz-osx-font-smoothing: grayscale;
8 | }
9 |
10 | code {
11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
12 | monospace;
13 | }
14 |
15 |
16 | /* *{
17 | border: 1px solid red;
18 | } */
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom/client';
3 | import './index.css';
4 | import App from './App';
5 | import reportWebVitals from './reportWebVitals';
6 |
7 | const root = ReactDOM.createRoot(document.getElementById('root'));
8 | root.render(
9 |
10 |
11 |
12 | );
13 |
14 | // If you want to start measuring performance in your app, pass a function
15 | // to log results (for example: reportWebVitals(console.log))
16 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
17 | reportWebVitals();
18 |
--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "short_name": "React App",
3 | "name": "Create React App Sample",
4 | "icons": [
5 | {
6 | "src": "favicon.ico",
7 | "sizes": "64x64 32x32 24x24 16x16",
8 | "type": "image/x-icon"
9 | },
10 | {
11 | "src": "logo192.png",
12 | "type": "image/png",
13 | "sizes": "192x192"
14 | },
15 | {
16 | "src": "logo512.png",
17 | "type": "image/png",
18 | "sizes": "512x512"
19 | }
20 | ],
21 | "start_url": ".",
22 | "display": "standalone",
23 | "theme_color": "#000000",
24 | "background_color": "#ffffff"
25 | }
26 |
--------------------------------------------------------------------------------
/src/Doc.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import './Doclist.css';
3 | const Doc = (props) => {
4 | return (
5 |
11 | );
12 | };
13 |
14 | const Image = (props) => {
15 | return
16 | }
17 | const Name = (props) => {props.t}
18 | const Specialist = (props) => {props.a}
19 | const Address = (props) => {props.aa}
20 |
21 | export default Doc;
--------------------------------------------------------------------------------
/src/Patient3.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Navbar from './Navbar.js';
3 | import './Patient3.css';
4 | import Profile1 from './profile.js';
5 |
6 | function Patient3() {
7 | return (
8 | <>
9 | {/* */}
10 |
11 |
12 |
13 |
Current patient number: pqr
14 |
Your appointment number: xyz
15 |
16 |
17 | >
18 | );
19 | }
20 |
21 | export default Patient3;
22 |
--------------------------------------------------------------------------------
/src/profile.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import './profile.css';
3 | import Profile from './assets/profile.png';
4 |
5 | function Profile1() {
6 | return (
7 |
8 |
9 |
10 |
11 |
12 |
13 |
Dr. Lorem Ipsum
14 |
DENTISTRY
15 | MBBS M.D
16 | Kroma Multispeciality Dental Clinic, Gandhinagar
17 | 30 yrs
18 |
19 |
20 |
21 |
22 | );
23 | }
24 | export default Profile1;
--------------------------------------------------------------------------------
/src/App.css:
--------------------------------------------------------------------------------
1 | .App {
2 | text-align: center;
3 | }
4 |
5 | .App-logo {
6 | height: 40vmin;
7 | pointer-events: none;
8 | }
9 |
10 | @media (prefers-reduced-motion: no-preference) {
11 | .App-logo {
12 | animation: App-logo-spin infinite 20s linear;
13 | }
14 | }
15 |
16 | .App-header {
17 | background-color: #282c34;
18 | min-height: 100vh;
19 | display: flex;
20 | flex-direction: column;
21 | align-items: center;
22 | justify-content: center;
23 | font-size: calc(10px + 2vmin);
24 | color: white;
25 | }
26 |
27 | .App-link {
28 | color: #61dafb;
29 | }
30 |
31 | @keyframes App-logo-spin {
32 | from {
33 | transform: rotate(0deg);
34 | }
35 | to {
36 | transform: rotate(360deg);
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/src/Navbar.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Logo from './assets/Logo.png';
3 | import './Navbar.css';
4 | import { BrowserRouter as Router, Link } from 'react-router-dom';
5 |
6 | const Navbar = () => {
7 | return (
8 |
9 |
10 |
11 |
12 |
13 |
14 | Home
15 | Contact
16 |
17 |
18 |
19 |
20 | );
21 | }
22 |
23 | export default Navbar;
--------------------------------------------------------------------------------
/src/TodaysApp.css:
--------------------------------------------------------------------------------
1 | .main{
2 | display: flex;
3 | flex-direction: column;
4 | justify-content: center;
5 | align-items: center;
6 | width: 100%;
7 | }
8 |
9 | /* styles.css */
10 | table {
11 | width: 100%;
12 | }
13 |
14 | h1{
15 | text-align: center;
16 | }
17 |
18 | th, td {
19 | padding: 8px;
20 | text-align: left;
21 | }
22 |
23 | th {
24 | background-color: #fff0bd;
25 | }
26 |
27 | tr:nth-child(even) {
28 | background-color: #fff0bd;
29 | }
30 |
31 | input[type="checkbox"] {
32 | transform: scale(1.5);
33 | }
34 |
35 |
36 | @media screen and (max-width: 840px) {
37 | .list{
38 | margin-top: -18rem;
39 | }
40 | }
41 |
42 | @media screen and (max-width: 430px) {
43 | .list{
44 | margin-top: -18rem;
45 | }
46 | }
--------------------------------------------------------------------------------
/src/Navbar.css:
--------------------------------------------------------------------------------
1 | /* Navbar.css */
2 |
3 | .landing-page {
4 | background-color: #fff0bd; /* Change the background color as needed */
5 | padding: 20px; /* Adjust padding as needed */
6 | height: 90px;
7 | }
8 |
9 | .navbar {
10 | display: flex;
11 | justify-content: space-between;
12 | align-items: center;
13 | }
14 |
15 | .logo img {
16 | width: 90px; /* Adjust logo width as needed */
17 | height: 70px; /* Maintain aspect ratio */
18 | }
19 |
20 | .nav-links {
21 | display: flex;
22 | font-size: 25px;
23 | }
24 |
25 | .nav-links a {
26 | margin-right: 20px; /* Adjust link spacing as needed */
27 | color: #000000; /* Change link color as needed */
28 | text-decoration: none;
29 | }
30 |
31 | .nav-links a:hover {
32 | color: #007bff; /* Change link hover color as needed */
33 | }
--------------------------------------------------------------------------------
/src/Patient2.css:
--------------------------------------------------------------------------------
1 | .profile-container {
2 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
3 | display: flex;
4 | flex-direction: column;
5 | align-items: center;
6 | }
7 |
8 | .action-button {
9 | margin-top: 7rem;
10 | padding: 0rem 2rem;
11 | background-color: #007bff; /* Adjust color as needed */
12 | color: white;
13 | border: none;
14 | border-radius: 5px;
15 | cursor: pointer;
16 |
17 | }
18 | .action-button:hover {
19 | background-color: #0056b3; /* Adjust color as needed */
20 | }
21 | .additional-text {
22 | margin-top: 1rem;
23 | margin-left: 6rem;
24 | margin-right: 8rem;
25 | }
26 | @media screen and (max-width : 840px){
27 | .action-button {
28 | margin-top: -7rem;
29 | }
30 | }
31 | @media screen and (max-width : 430px){
32 | .action-button {
33 | margin-top: 3rem;
34 | }
35 | .action-button {
36 | margin-top: 7rem;
37 | }
38 | }
--------------------------------------------------------------------------------
/src/Patient2.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Navbar from './Navbar.js';
3 | import './Patient2.css';
4 | import Profile1 from './profile.js';
5 | import Patient3 from './Patient3.js';
6 | import { BrowserRouter as Router, Link } from 'react-router-dom';
7 |
8 | function Patient2() {
9 | return (
10 | <>
11 | {/* */}
12 |
13 |
14 |
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
15 |
16 |
17 | Make an Appointment
18 |
19 | >
20 | );
21 | }
22 |
23 | export default Patient2;
24 |
--------------------------------------------------------------------------------
/src/Psign.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import './Psign.css'; // Assuming you have a corresponding CSS file for Psign
3 | import { BrowserRouter as Router, Link } from 'react-router-dom';
4 | import Patient1 from './Patient1';
5 |
6 | const Psign = () => {
7 | return (
8 |
9 |
Patient Sign Up
10 |
27 |
28 | );
29 | };
30 |
31 | export default Psign;
32 |
--------------------------------------------------------------------------------
/src/SignUp.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import './SignUp.css';
3 | import Logo from './assets/Logo.png';
4 | function SignUp() {
5 | return (
6 |
7 |
8 |
9 |
10 |
11 |
12 |
lorem
13 |
14 |
15 |
16 |
29 |
30 | );
31 | }
32 |
33 | export default SignUp;
34 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "docit",
3 | "version": "0.1.0",
4 | "private": true,
5 | "dependencies": {
6 | "@testing-library/jest-dom": "^5.17.0",
7 | "@testing-library/react": "^13.4.0",
8 | "@testing-library/user-event": "^13.5.0",
9 | "axios": "^1.6.8",
10 | "body-parser": "^1.20.2",
11 | "cors": "^2.8.5",
12 | "express": "^4.19.2",
13 | "mongoose": "^8.3.4",
14 | "nodemon": "^3.1.0",
15 | "react": "^18.2.0",
16 | "react-dom": "^18.2.0",
17 | "react-router-dom": "^6.22.0",
18 | "react-scripts": "^5.0.1",
19 | "web-vitals": "^2.1.4"
20 | },
21 | "scripts": {
22 | "start": "react-scripts start",
23 | "build": "react-scripts build",
24 | "test": "react-scripts test",
25 | "eject": "react-scripts eject"
26 | },
27 | "eslintConfig": {
28 | "extends": [
29 | "react-app",
30 | "react-app/jest"
31 | ]
32 | },
33 | "browserslist": {
34 | "production": [
35 | ">0.2%",
36 | "not dead",
37 | "not op_mini all"
38 | ],
39 | "development": [
40 | "last 1 chrome version",
41 | "last 1 firefox version",
42 | "last 1 safari version"
43 | ]
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/src/DocList.js:
--------------------------------------------------------------------------------
1 | import Doc from "./Doc.js";
2 | import React from 'react';
3 | import './Doclist.css';
4 | import ps from './assets/profile.png';
5 | import { BrowserRouter as Router, Link } from 'react-router-dom';
6 |
7 | const Doclist = () => {
8 | return(
9 |
10 | {/* */}
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 | {/* */}
21 |
22 | );
23 | };
24 | export default Doclist;
--------------------------------------------------------------------------------
/src/Patient1.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Navbar from './Navbar.js';
3 | import './Patient1.css';
4 | import simg from './assets/icon _search.png';
5 | import Doclist from './DocList.js';
6 | import { Link } from 'react-router-dom';
7 |
8 | const Patient1 = () => {
9 | return (
10 | <>
11 | {/* */}
12 |
13 |
14 |
15 |
16 | Appoint to the Best Doctors here!
17 |
18 |
19 | Looking to schedule a primary care doctor appointment this week? Let DocIt help you effortlessly locate nearby doctors who accept your insurance. It's easy, confidential, and completely free.
20 |
21 |
22 |
23 | {/*
24 |
25 |
Search Your Doctor
26 |
*/}
27 |
28 |
29 |
30 |
31 |
32 |
33 | >
34 | );
35 | }
36 |
37 | export default Patient1;
--------------------------------------------------------------------------------
/src/profile.css:
--------------------------------------------------------------------------------
1 | .profile-container {
2 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
3 | display: flex;
4 | flex-direction: column;
5 | align-items: center;
6 | height: 20rem;
7 | }
8 |
9 | .profile-info {
10 | display: flex;
11 | align-items: center;
12 | margin-right: 30rem;
13 | margin-top: 1.5rem;
14 | }
15 |
16 | .profile-image {
17 | margin-right: 20px;
18 | }
19 |
20 | .profile-image img {
21 | width: 80% ;/* Adjust the size as needed */
22 | border-radius: 50%; /* Make it circular */
23 | }
24 |
25 |
26 | .profile-text{
27 | margin-left: -2rem;
28 | margin-top: 3rem;
29 | font-size: x-large;
30 | }
31 | @media screen and (max-width : 840px){
32 | .profile-info {
33 | margin-right: 5rem;
34 | }
35 | .profile-container {
36 | height: 40rem;
37 | }
38 | }
39 | @media screen and (max-width : 430px){
40 | .additional-text {
41 | margin-top: 1rem;
42 | margin-left: 4rem;
43 | margin-right: 4rem;
44 | }
45 | .profile-info {
46 | margin-right: 0rem;
47 | }
48 | .profile-image img {
49 | width: 89% ;
50 | }
51 | .profile-container {
52 | height: 32rem;
53 | margin-right: 0rem;
54 | }
55 | .profile-image {
56 | margin-right: 1rem;
57 | margin-left: 1rem;
58 | }
59 | }
60 | .profile-text {
61 | margin-left: -1rem;
62 | margin-top: 0rem;
63 | font-size: small;
64 | }
--------------------------------------------------------------------------------
/src/login.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import './login.css';
3 | import Logo from './assets/Logo.png';
4 | import { BrowserRouter as Router, Link } from 'react-router-dom';
5 |
6 |
7 | function Login() {
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
Welcome!
16 |
17 |
18 |
19 |
34 |
35 | );
36 | }
37 |
38 | export default Login;
39 |
--------------------------------------------------------------------------------
/src/Doclist.css:
--------------------------------------------------------------------------------
1 | * {
2 | margin: 0;
3 | padding: 0;
4 | box-sizing: border-box;
5 | }
6 |
7 | body {
8 | font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
9 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
10 | color: #222;
11 | }
12 |
13 | .Doclist {
14 | display: grid;
15 | width: 90%;
16 | max-width: 1170px;
17 | margin: 3rem auto;
18 | gap: 2rem;
19 | grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* Adjusted to auto-fill with a minimum width of 300px */
20 | }
21 |
22 | @media screen and (min-width: 840px) {
23 | .Doclist {
24 | grid-template-columns: repeat(3, 1fr);
25 | margin: 3rem auto;
26 | gap: 3rem; /* Adjusted gap for larger screens */
27 | }
28 | }
29 |
30 | .Doc {
31 | background: #fff;
32 | border-radius: 1rem;
33 | padding: 2rem;
34 | text-align: center;
35 | font-size: 1.5rem; /* Adjusted font size for better readability on smaller screens */
36 | }
37 |
38 | .Doc img {
39 | width: 100%;
40 | height: auto; /* Ensuring image maintains aspect ratio */
41 | object-fit: cover;
42 | }
43 |
44 | .name {
45 | font-size: 1.2rem; /* Adjusted font size for better readability on smaller screens */
46 | font-weight: 400;
47 | }
48 |
49 | .spec .address {
50 | font-size: 1rem; /* Adjusted font size for better readability on smaller screens */
51 | font-weight: 300;
52 | }
53 |
--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import './App.css';
3 | import LandingPage from './landingPage';
4 | import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
5 | import Patient1 from './Patient1';
6 | import Navbar from './Navbar';
7 | import Dsign from './Dsign';
8 | import Psign from './Psign';
9 | import Login from './login';
10 | import Patient3 from './Patient3';
11 | import Patient2 from './Patient2';
12 | import TodaysApp from './TodaysApp';
13 | import Dlogin from './Dlogin';
14 | import Doclist from './DocList';
15 | import DoctorSign from './Dsignup';
16 |
17 | function App() {
18 | return (
19 | // <>
20 | //
21 | //
22 | //
23 | //
24 | //
25 | //
26 | <>
27 |
28 |
29 |
30 |
31 | } />
32 |
33 |
34 | } />
35 |
36 | } />
37 |
38 | } />
39 |
40 | } />
41 |
42 | } />
43 |
44 |
45 | } />
46 |
47 |
48 | } />
49 |
50 | } />
51 | }/>
52 | } />
53 | } />
54 |
55 |
56 |
57 |
58 | >
59 |
60 | );
61 | }
62 |
63 | export default App;
64 |
65 |
66 |
--------------------------------------------------------------------------------
/src/landingPage.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import Logo from './assets/Logo.png';
3 | import { BrowserRouter as Router, Link } from 'react-router-dom';
4 | import './landingPage.css';
5 | import lp from './assets/lp_vector.png';
6 | import Navbar from './Navbar.js';
7 |
8 | const LandingPage = () => {
9 | return (
10 |
11 | <>
12 |
13 |
14 |
15 | Welcome to DocIt, where healthcare meets convenience. At DocIt, we're on a mission to simplify the patient-doctor interaction. Say goodbye to long waits and embrace streamlined communication.
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 | How do you want to use DocIt?
25 |
26 |
27 |
28 | We'll personalize your setup experience accordingly.
29 |
30 |
31 |
32 |
33 | Doctor
34 |
35 |
36 |
37 | Patient
38 |
39 |
40 |
41 |
42 |
43 |
>
44 | );
45 | };
46 |
47 | export default LandingPage;
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
12 |
13 |
17 |
18 |
27 | React App
28 |
29 |
30 | You need to enable JavaScript to run this app.
31 |
32 |
42 |
43 |
44 |
--------------------------------------------------------------------------------
/src/TodaysApp.js:
--------------------------------------------------------------------------------
1 |
2 | import React from 'react';
3 | import Navbar from './Navbar.js';
4 | import './TodaysApp.css';
5 | import Profile1 from './profile.js';
6 | import { useEffect , useState} from 'react';
7 | import axios from 'axios';
8 |
9 | function TodaysApp() {
10 | const [patients , setPatients] = useState([])
11 | const [count,setCount]=useState(0);
12 | useEffect(()=>{
13 | fetch("http://localhost:5000/").then(console.log)
14 | axios.get('http://localhost:5000/getPatientInfo/')
15 | .then(response => {
16 | console.log(response.data);
17 | setPatients(response.data);
18 | })
19 | .catch(error => {
20 | console.error('Error fetching patient data:', error);
21 | });
22 | },[])
23 |
24 | const handleCheckboxChange = index => {
25 | setPatients(prevPatients => {
26 | const newPatients = [...prevPatients];
27 | newPatients.splice(index, 1);
28 | setCount(count+1);
29 | console.log(count);
30 | return newPatients;
31 | });
32 | };
33 |
34 | return (
35 | <>
36 | {/* */}
37 |
38 |
39 |
40 |
Today's Appointment
41 |
64 |
65 |
66 |
67 | >
68 |
69 | );
70 | }
71 |
72 | export default TodaysApp;
--------------------------------------------------------------------------------
/src/Patient1.css:
--------------------------------------------------------------------------------
1 | .info {
2 | display: flex;
3 | flex-direction: column;
4 | align-items: center;
5 | }
6 |
7 | .para2 {
8 | font-weight: bold;
9 | align-items: center;
10 | margin-top: 2rem;
11 | }
12 |
13 | .para3 {
14 | margin-top: -3rem;
15 | margin-left: 15rem;
16 | margin-right: 15rem;
17 | align-items:center;
18 | }
19 |
20 |
21 | .search{
22 | width: 80rem;
23 | height: 2.5rem;
24 | border-radius: 2rem;
25 | background-color: #F9E4A0;
26 | margin-left: 7rem;
27 | margin-top: 3rem;
28 | display: flex;
29 | justify-content: start;
30 | }
31 |
32 | .search-icon-img{
33 | display: flex;
34 | margin-left: 1rem;
35 | margin-top: 0.6rem;
36 | height: 60%;
37 | }
38 |
39 | .text1 {
40 | color: #00000087;
41 | font-size: 1.5rem;
42 | margin-top: -vh;
43 | margin-bottom: 2rem;
44 | font-weight: 600;
45 | height:fit-content;
46 | width: fit-content;
47 | }
48 |
49 | .pati1{
50 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
51 | height: 15rem;
52 | }
53 |
54 |
55 |
56 | @media screen and (max-width : 840px){
57 | .para2{
58 | margin-left: 1rem;
59 | }
60 |
61 | .para3{
62 | margin-left: 5rem;
63 | margin-right: 5rem;
64 | }
65 |
66 | .search{
67 | margin-top: -10rem;
68 | margin-left: 2rem;
69 | width:45rem ;
70 | }
71 |
72 | .pati1{
73 | height: 10.5rem;
74 | }
75 |
76 | .doctors{
77 | margin-left: -8rem;
78 |
79 | }
80 | }
81 |
82 | @media screen and (max-width : 430px){
83 | .para2{
84 | margin-left: 1.3rem;
85 | font-size: 1.3rem;
86 | }
87 |
88 | .para3{
89 | margin-left: 2.5rem;
90 | font-size: 1rem;
91 | align-items: center;
92 | }
93 |
94 | .search{
95 | width: 20rem;
96 | }
97 | .doctors{
98 | margin-left: 1rem;
99 | margin-top: 30vh;
100 | }
101 | }
102 |
103 |
--------------------------------------------------------------------------------
/src/Dlogin.js:
--------------------------------------------------------------------------------
1 | import React, {useState} from 'react';
2 | import './login.css';
3 | import Logo from './assets/Logo.png';
4 | import axios from 'axios';
5 | import { useNavigate } from 'react-router-dom';
6 | import { BrowserRouter as Router, Link } from 'react-router-dom';
7 |
8 |
9 | function Login() {
10 | const [email, setEmail] = useState('');
11 | const [password, setPassword] = useState('');
12 | const navigate=useNavigate();
13 |
14 |
15 |
16 | const handleSubmit = async (e) => {
17 | e.preventDefault();
18 |
19 | try {
20 | const response = await axios.post('http://localhost:5000/api/doctor/login/', { email, password });
21 | console.log(response.data);
22 | navigate('/TodaysApp');
23 | } catch (error) {
24 | console.error('Login failed', error);
25 | alert("Invalid username or password");
26 | }
27 | };
28 |
29 | return (
30 |
31 |
32 |
33 |
34 |
35 |
36 |
Welcome!
37 |
38 |
39 |
40 |
41 |
42 |
Login
43 |
44 |
45 |
46 |
47 | setEmail(e.target.value)}
52 | style={{ borderRadius: '10px', marginBottom: '10px' }}
53 | required
54 | />
55 | setPassword(e.target.value)}
60 | style={{ borderRadius: '10px', marginBottom: '10px' }}
61 | required
62 | />
63 |
64 | Forgot Password?
65 | Don't have an account? Sign Up
66 | Log In
67 |
68 |
69 |
70 | );
71 | }
72 |
73 | export default Login;
74 |
--------------------------------------------------------------------------------
/src/logo.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/Psign.css:
--------------------------------------------------------------------------------
1 | .text1 {
2 | margin-left: 42rem;
3 | color: black;
4 | font-size: 1.5rem;
5 | margin-top: 1.5rem;
6 | margin-bottom: 3rem;
7 | font-weight: 600;
8 | }
9 |
10 | .PSup {
11 | width: 35rem;
12 | margin: 0 auto;
13 | padding: 2rem;
14 | border: 1px solid #ccc;
15 | border-radius: 2rem;
16 | background-color: #F9E4A0;
17 | margin-bottom: 2rem;
18 | }
19 |
20 | .PSup h2 {
21 | text-align: center;
22 | margin-bottom: 2rem;
23 | color: #333;
24 | }
25 |
26 | .PSup form {
27 | display: flex;
28 | flex-direction: column;
29 | }
30 |
31 | .PSup label {
32 | margin-bottom: 1rem;
33 | color: #555;
34 | }
35 |
36 | .PSup input[type='text'],
37 | .PSup input[type='number'],
38 | .PSup textarea,
39 | .PSup button[type='submit'] {
40 | width: 100%;
41 | padding: 1rem;
42 | margin-bottom: 1rem;
43 | border: 1px solid #ccc;
44 | border-radius: 0.5rem;
45 | box-sizing: border-box;
46 | font-size: 1rem;
47 | }
48 |
49 | .PSup textarea {
50 | height: 4rem;
51 | }
52 |
53 | .PSup button[type='submit'] {
54 | background-color: #007bff;
55 | color: #fff;
56 | cursor: pointer;
57 | transition: background-color 0.3s ease;
58 | width: 5rem;
59 | margin-bottom: 1rem;
60 | }
61 |
62 | .PSup * {
63 | margin: 0rem 0;
64 | }
65 |
66 | @media screen and (max-width: 840px) {
67 | .text1 {
68 | margin-left: 20rem;
69 | color: black;
70 | font-weight: 600;
71 | }
72 | }
73 |
74 | @media screen and (max-width: 430px) {
75 | .text1 {
76 | margin-left: 8rem;
77 | font-size: 1.2rem;
78 | margin-top: 1rem;
79 | margin-bottom: 2rem;
80 | }
81 |
82 | .PSup {
83 | width: 70%;
84 | padding: 1rem;
85 | border-radius: 1rem;
86 | margin-bottom: 1rem;
87 | }
88 |
89 | .PSup h2 {
90 | margin-bottom: 1rem;
91 | }
92 |
93 | .PSup label {
94 | margin-bottom: 0.5rem;
95 | }
96 |
97 | .PSup input[type='text'],
98 | .PSup input[type='number'],
99 | .PSup textarea,
100 | .PSup button[type='submit'] {
101 | width: 100%;
102 | padding: 0.8rem;
103 | margin-bottom: 0.5rem;
104 | }
105 |
106 | .PSup textarea {
107 | height: 3rem;
108 | }
109 |
110 | .PSup button[type='submit'] {
111 | background-color: #007bff;
112 | width: 40%;
113 | margin-bottom: 0;
114 | }
115 |
116 | .PSup * {
117 | margin: 0;
118 | }
119 | }
120 |
--------------------------------------------------------------------------------
/src/Dsign.css:
--------------------------------------------------------------------------------
1 | .text1 {
2 | margin-left: 42rem;
3 | color: black;
4 | font-size: 1.5rem;
5 | margin-top: 1.5rem;
6 | margin-bottom: 3rem;
7 | font-weight: 600;
8 | }
9 |
10 | .DSup {
11 | width: 35rem;
12 | margin: 0 auto;
13 | padding: 2rem;
14 | border: 1px solid #ccc;
15 | border-radius: 2rem;
16 | background-color: #F9E4A0;
17 | margin-bottom: 2rem;
18 | }
19 |
20 | .DSup h2 {
21 | text-align: center;
22 | margin-bottom: 2rem;
23 | color: #333;
24 | }
25 |
26 | .DSup form {
27 | display: flex;
28 | flex-direction: column;
29 | }
30 |
31 | .DSup label {
32 | margin-bottom: 1rem;
33 | color: #555;
34 | }
35 |
36 | .DSup input[type='text'],
37 | .DSup input[type='number'],
38 | .DSup textarea,
39 | .DSup button[type='submit'] {
40 | width: 100%;
41 | padding: 1rem;
42 | margin-bottom: 1rem;
43 | border: 1px solid #ccc;
44 | border-radius: 0.5rem;
45 | box-sizing: border-box;
46 | font-size: 1rem;
47 | }
48 |
49 | .DSup textarea {
50 | height: 4rem;
51 | }
52 |
53 | .DSup button[type='submit'] {
54 | background-color: #007bff;
55 | color: #fff;
56 | cursor: pointer;
57 | transition: background-color 0.3s ease;
58 | width: 5rem;
59 | margin-bottom: 1rem;
60 | }
61 |
62 |
63 | .DSup * {
64 | margin: 0rem 0;
65 | }
66 |
67 |
68 | @media screen and (max-width : 840px){
69 | .text1 {
70 | margin-left: 20rem;
71 | color: black;
72 | font-weight: 600;
73 | }
74 | }
75 |
76 | @media screen and (max-width: 430px){
77 | .text1 {
78 | margin-left: 8rem;
79 | font-size: 1.2rem;
80 | margin-top: 1rem;
81 | margin-bottom: 2rem;
82 |
83 | }
84 |
85 | .DSup {
86 | width: 70%;
87 | padding: 1rem;
88 | border-radius: 1rem;
89 | margin-bottom: 1rem;}
90 |
91 | .DSup h2 {
92 | margin-bottom: 1rem; /* Adjusted for smaller screens */
93 | }
94 |
95 |
96 | .DSup label {
97 | margin-bottom: 0.5rem;
98 | }
99 |
100 | .DSup input[type='text'],
101 | .DSup input[type='number'],
102 | .DSup textarea,
103 | .DSup button[type='submit'] {
104 | width: 100%;
105 | padding: 0.8rem;
106 | margin-bottom: 0.5rem;
107 | }
108 |
109 | .DSup textarea {
110 | height: 3rem;
111 | }
112 |
113 | .DSup button[type='submit'] {
114 | background-color: #007bff;
115 | width: 40%;
116 | margin-bottom: 0;
117 | }
118 |
119 | .DSup * {
120 | margin: 0;
121 | }
122 |
123 | }
124 |
--------------------------------------------------------------------------------
/src/Dsignup.js:
--------------------------------------------------------------------------------
1 | import React, {useState} from 'react';
2 | import './login.css';
3 | import Logo from './assets/Logo.png';
4 | import axios from 'axios';
5 | import { useNavigate } from 'react-router-dom';
6 | import { BrowserRouter as Router, Link } from 'react-router-dom';
7 |
8 |
9 | function DoctorSign() {
10 | const [email, setEmail] = useState('');
11 | const [password, setPassword] = useState('');
12 | const [errors, setErrors] = useState({});
13 | const navigate=useNavigate();
14 |
15 | const handleSubmit = async (e) => {
16 | e.preventDefault();
17 |
18 | // Validate email and password
19 | const errors = {};
20 | if (!/\S+@\S+\.\S+/.test(email)) {
21 | alert("Email id should be in the form abc@abc.abc")
22 | }
23 | if (password.length < 6) {
24 | alert('Password must be at least 6 characters long');
25 | }
26 |
27 | if (Object.keys(errors).length > 0) {
28 | setErrors(errors);
29 | return;
30 | }
31 |
32 | try {
33 | const response = await axios.post('http://localhost:5000/api/doctor/signup/', { email, password });
34 | console.log(response.data);
35 | navigate('/Dsign');
36 | } catch (error) {
37 | console.error('Login failed', error);
38 | }
39 | };
40 |
41 | return (
42 |
43 |
44 |
45 |
46 |
47 |
48 |
Welcome!
49 |
50 |
51 |
52 |
53 |
54 |
Sign Up
55 |
56 |
57 |
58 |
59 | setEmail(e.target.value)}
64 | style={{ borderRadius: '10px', marginBottom: '10px' }}
65 | required
66 | />
67 | setPassword(e.target.value)}
72 | style={{ borderRadius: '10px', marginBottom: '10px' }}
73 | required
74 | />
75 |
76 | Already have an account? Log In
77 | Sign Up
78 |
79 |
80 |
81 | );
82 | }
83 |
84 | export default DoctorSign;
85 |
--------------------------------------------------------------------------------
/src/SignUp.css:
--------------------------------------------------------------------------------
1 | .container {
2 | display: flex;
3 | justify-content: space-between;
4 | margin: 10rem;
5 | }
6 |
7 | .box {
8 | width: 50%; /* Adjust the width as needed */
9 | padding: 20px;
10 | border: 1px solid #ccc;
11 | }
12 |
13 | .box:first-child {
14 | background-color: #F9E4A0; /* Background color for the left box */
15 | }
16 |
17 | input[type="text"] {
18 | width: 80%;
19 | padding: 10px;
20 | margin-bottom: 10px;
21 | box-sizing: border-box;
22 | color: #777; /* Faint grey color for input text */
23 | }
24 |
25 | input[type="submit"] {
26 | width: 50%;
27 | padding: 10px;
28 | background-color: #007bff;
29 | color: #fff;
30 | border: none;
31 | cursor: pointer;
32 | }
33 |
34 | .grid {
35 | margin-top: 6rem;
36 | font-size: 2rem;
37 | }
38 |
39 | .LOGO {
40 | width: 35%;
41 | display: flex;
42 | margin: auto;
43 | margin-top: -3rem;
44 | }
45 |
46 | hr {
47 | padding: -1rem;
48 | }
49 |
50 | .box1 {
51 | padding: -3rem;
52 | }
53 |
54 | .box2 {
55 | font-size: 0.7rem;
56 | margin-left: 18rem;
57 | color: #145ead;
58 | margin-top: -0.5rem;
59 | font-weight: bold;
60 | }
61 |
62 | .SignUp {
63 | margin-left: 7rem;
64 | font-size: 1rem;
65 | }
66 | .Welcome{
67 | font-size: 3rem;
68 | margin-bottom: 3rem;
69 | font-weight: bold;
70 | }
71 |
72 |
73 | @media screen and (max-width : 840px){
74 | .box2{
75 | margin-left: 6rem;
76 | font-size: 0.6rem;
77 | }
78 | .SignUp{
79 | margin-left: 1.5rem;
80 | font-size: 0.7rem;
81 | }
82 | .Welcome{
83 | font-size: 1.5rem;
84 | }
85 | .Container{
86 | margin-top: 50rem;
87 | }
88 | }
89 | @media screen and (max-width : 430px){
90 | .container {
91 | position: relative;
92 | width: 100%;
93 | height: 100vh;
94 | display: flex;
95 | flex-direction: column;
96 | justify-content: center;
97 | align-items: center;
98 | margin: 2rem;
99 | margin-right: 6rem;
100 | }
101 |
102 | .box {
103 | width: 50%;
104 | padding: 20px;
105 | border: 1px solid #ccc;
106 | margin-bottom: 20px;
107 | }
108 |
109 | .box:first-child {
110 | background-color: #F9E4A0;
111 | }
112 |
113 | input[type="text"] {
114 | width: 100%;
115 | }
116 |
117 | input[type="submit"] {
118 | width: 60%;
119 | }
120 |
121 | .grid {
122 | margin-top: 2rem;
123 | font-size: 2rem;
124 | }
125 |
126 | .LOGO {
127 | width: 20%;
128 | }
129 |
130 | hr {
131 | padding: -1rem;
132 | }
133 |
134 | .box2 {
135 | font-size: 0.7rem;
136 | margin-left: 50%;
137 | color: #145ead;
138 | margin-top: -0.5rem;
139 | font-weight: bold;
140 | }
141 |
142 | .SignUp {
143 | margin-left: 9%;
144 | font-size: 1rem;
145 | }
146 |
147 | .Welcome {
148 | position: absolute;
149 | top: calc(50% - 260px); /* Adjust the top position to center vertically */
150 | left: 50%;
151 | transform: translateX(-50%);
152 | text-align: center;
153 | padding: 42px;
154 | width: -4rem;
155 | font-size: 1rem;
156 | }
157 | }
--------------------------------------------------------------------------------
/src/login.css:
--------------------------------------------------------------------------------
1 | .container {
2 | display: flex;
3 | justify-content: space-between;
4 | margin: 10rem;
5 | }
6 |
7 | .box {
8 | width: 50%; /* Adjust the width as needed */
9 | padding: 20px;
10 | border: 1px solid #ccc;
11 | }
12 |
13 | .box:first-child {
14 | background-color: #F9E4A0; /* Background color for the left box */
15 | }
16 |
17 | input[type="email"] {
18 | width: 80%;
19 | padding: 10px;
20 | margin-bottom: 10px;
21 | box-sizing: border-box;
22 | color: #777; /* Faint grey color for input text */
23 | }
24 |
25 | input[type="password"] {
26 | width: 80%;
27 | padding: 10px;
28 | margin-bottom: 10px;
29 | box-sizing: border-box;
30 | color: #777; /* Faint grey color for input text */
31 | }
32 |
33 | input[type="submit"] {
34 | width: 50%;
35 | padding: 10px;
36 | background-color: #007bff;
37 | color: #fff;
38 | border: none;
39 | cursor: pointer;
40 | }
41 |
42 | .grid {
43 | margin-top: 6rem;
44 | font-size: 2rem;
45 | }
46 |
47 | .LOGO {
48 | width: 39%;
49 | display: flex;
50 | margin: auto;
51 | margin-top: 0rem;
52 | }
53 |
54 | hr {
55 | padding: -1rem;
56 | }
57 |
58 | .box1 {
59 | padding: -3rem;
60 | }
61 |
62 | .box2 {
63 | font-size: 0.7rem;
64 | margin-left: 25rem;
65 | color: #145ead;
66 | margin-top: -0.5rem;
67 | font-weight: bold;
68 | }
69 |
70 | .SignUp {
71 | margin-top: 2rem;
72 | margin-left: 10rem;
73 | font-size: 1rem;
74 | margin-bottom: 1rem;
75 | }
76 | .Welcome{
77 | font-size: 3rem;
78 | margin-bottom: 3rem;
79 | font-weight: bold;
80 | }
81 |
82 |
83 | @media screen and (max-width : 840px){
84 | .box2 {
85 | margin-left: 6rem;
86 | font-size: 0.6rem;
87 | }
88 | .SignUp {
89 | margin-left: 1.5rem;
90 | font-size: 0.7rem;
91 | }
92 | .Welcome{
93 | font-size: 1.5rem;
94 | }
95 | .Container{
96 | margin-top: 50rem;
97 | }
98 | }
99 | @media screen and (max-width: 430px) {
100 | .container {
101 | position: relative;
102 | width: 90%;
103 | height: 100vh;
104 | display: flex;
105 | flex-direction: column;
106 | justify-content: center;
107 | align-items: center;
108 | margin: 2rem;
109 | margin-right: 6rem;
110 | }
111 |
112 | .box {
113 | width: 90%;
114 | height: 70vh;
115 | padding: 20px;
116 | border: 1px solid #ccc;
117 | margin-bottom: 20px;
118 | }
119 |
120 | .box:first-child {
121 | background-color: #F9E4A0;
122 | }
123 |
124 | input[type="email"] {
125 | width: 100%;
126 | }
127 |
128 | input[type="password"] {
129 | width: 100%;
130 | }
131 |
132 | input[type="submit"] {
133 | width: 60%;
134 | }
135 |
136 | .grid {
137 | margin-top: 2rem;
138 | font-size: 2rem;
139 | }
140 |
141 | .LOGO {
142 | margin-top:-1rem;
143 | width: 60%;
144 | height: 120px;
145 | }
146 |
147 | hr {
148 | padding: -1rem;
149 | }
150 |
151 | .box2 {
152 | font-size: 0.7rem;
153 | margin-left: 11rem;
154 | color: #145ead;
155 | margin-top: -0.5rem;
156 | font-weight: bold;
157 | }
158 |
159 | .SignUp {
160 | margin-left: 9%;
161 | font-size: 1rem;
162 | }
163 |
164 | .Welcome {
165 | position:static;
166 | top: calc(55% - 200px);
167 | left: 50%;
168 | text-align: center;
169 | padding: 42px;
170 | font-size: 2rem;
171 | margin-left: 1rem;
172 | }
173 | }
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Getting Started with Create React App
2 |
3 | This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
4 |
5 | ## Available Scripts
6 |
7 | In the project directory, you can run:
8 |
9 | ### `npm start`
10 |
11 | Runs the app in the development mode.\
12 | Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
13 |
14 | The page will reload when you make changes.\
15 | You may also see any lint errors in the console.
16 |
17 | ### `npm test`
18 |
19 | Launches the test runner in the interactive watch mode.\
20 | See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
21 |
22 | ### `npm run build`
23 |
24 | Builds the app for production to the `build` folder.\
25 | It correctly bundles React in production mode and optimizes the build for the best performance.
26 |
27 | The build is minified and the filenames include the hashes.\
28 | Your app is ready to be deployed!
29 |
30 | See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
31 |
32 | ### `npm run eject`
33 |
34 | **Note: this is a one-way operation. Once you `eject`, you can't go back!**
35 |
36 | If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
37 |
38 | Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
39 |
40 | You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
41 |
42 | ## Learn More
43 |
44 | You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
45 |
46 | To learn React, check out the [React documentation](https://reactjs.org/).
47 |
48 | ### Code Splitting
49 |
50 | This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
51 |
52 | ### Analyzing the Bundle Size
53 |
54 | This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
55 |
56 | ### Making a Progressive Web App
57 |
58 | This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
59 |
60 | ### Advanced Configuration
61 |
62 | This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
63 |
64 | ### Deployment
65 |
66 | This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
67 |
68 | ### `npm run build` fails to minify
69 |
70 | This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)
71 |
--------------------------------------------------------------------------------
/src/Patient3.css:
--------------------------------------------------------------------------------
1 | .rectangle-container {
2 | display: flex;
3 | justify-content: space-between;
4 | margin-top: 20px; /* Adjust spacing as needed */
5 | }
6 |
7 | .rectangle {
8 | width: 20rem; /* Adjust width as needed */
9 | height: 10rem; /* Adjust height as needed */
10 | border: none; /* Adjust border properties as needed */
11 | margin-right: 10rem;
12 | margin-left: 10rem;
13 | margin-bottom: 3rem; /* Add margin to create space between rectangles */
14 | border-radius: 1rem;
15 | justify-content: center;
16 | display: flex;
17 | align-items: center; /* Center text vertically */
18 | font-size: 1.3rem;
19 | }
20 |
21 | .profile-container {
22 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
23 | display: flex;
24 | flex-direction: column;
25 | align-items: center;
26 | }
27 |
28 | @media screen and (max-width : 430px){
29 | .rectangle-container {
30 | display: flex;
31 | flex-wrap: wrap; /* Allow flex items to wrap to next line */
32 | justify-content: center; /* Center flex items horizontally */
33 | margin-top: 20px; /* Adjust spacing as needed */
34 | }
35 |
36 | .rectangle {
37 | width: 20rem; /* Adjust width as needed */
38 | height: 10rem; /* Adjust height as needed */
39 | border: none; /* Adjust border properties as needed */
40 | margin-bottom: 3rem; /* Add margin to create space between rectangles */
41 | border-radius: 1rem;
42 | display: flex;
43 | justify-content: center;
44 | align-items: center; /* Center text vertically */
45 | font-size: 1.3rem;
46 | }
47 |
48 | .profile-container {
49 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
50 | display: flex;
51 | flex-direction: column;
52 | align-items: center;
53 | }
54 |
55 | @media screen and (max-width: 430px) {
56 | .rectangle-container {
57 | justify-content: center; /* Center flex items horizontally */
58 | display: flex;
59 | flex-wrap: wrap;
60 | justify-content: center;
61 | margin-top: -15rem;
62 |
63 | }
64 |
65 | .rectangle {
66 | width: calc(100% - 2rem); /* Full width with 2rem margin on each side */
67 | margin-left: 1rem;
68 | margin-right: 1rem;
69 | }
70 | }
71 |
72 | }
73 |
74 | @media screen and (max-width: 840px){
75 | .rectangle-container {
76 | display: flex;
77 | justify-content: space-between;
78 | margin-top: -13rem; /* Adjust spacing as needed */
79 | }
80 |
81 | .rectangle {
82 | width: 20rem; /* Adjust width as needed */
83 | height: 10rem; /* Adjust height as needed */
84 | border: none; /* Adjust border properties as needed */
85 | margin-right: 10rem;
86 | margin-left: 10rem;
87 | margin-bottom: 3rem; /* Add margin to create space between rectangles */
88 | border-radius: 1rem;
89 | display: flex;
90 | justify-content: center;
91 | align-items: center; /* Center text vertically */
92 | font-size: 1.3rem;
93 | }
94 |
95 | .profile-container {
96 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
97 | display: flex;
98 | flex-direction: column;
99 | align-items: center;
100 | }
101 |
102 | @media screen and (max-width: 840px) {
103 | .rectangle-container {
104 | flex-direction: column; /* Change to column layout for smaller screens */
105 | align-items: center; /* Center items horizontally */
106 | }
107 |
108 | .rectangle {
109 | /* width: calc(100% - 2rem); Full width with 2rem margin on each side */
110 | margin-left: 1rem;
111 | margin-right: 1rem;
112 | }
113 | }
114 |
115 | }
--------------------------------------------------------------------------------
/server.js:
--------------------------------------------------------------------------------
1 | const express = require('express');
2 | const bodyParser = require('body-parser');
3 | const mongoose = require('mongoose');
4 | const cors = require('cors');
5 | const app = express();
6 | const Doctor = require('./backend/models/drschema');
7 | const Patient = require('./backend/models/patientschema');
8 | const drInfo = require('./backend/models/DrInfo');
9 | const patientInfo = require('./backend/models/PatientInfo');
10 |
11 | app.use(bodyParser.json());
12 | app.use(cors());
13 |
14 | // Connect to MongoDB
15 | mongoose.connect('mongodb+srv://aneyshamika:TheBeginners@atlascluster.ey9nerv.mongodb.net/', {
16 | }).then(() => {
17 | console.log("MongoDB connected successfully");
18 | }).catch((e) => {
19 | console.log("MongoDB connection error:", e);
20 | });
21 |
22 | app.get("/", (req, res) => {
23 | res.send("BACKEND IS WORKING");
24 | });
25 |
26 | app.get("/getDrInfo", (req, res) => {
27 | drInfo.find()
28 | .then(doctors => res.json(doctors))
29 | .catch(err => res.json(err))
30 | });
31 |
32 | app.get("/getPatientInfo", (req, res) => {
33 | patientInfo.find()
34 | .then(patients => res.json(patients))
35 | .catch(err => res.json(err))
36 | });
37 |
38 | // Doctor signup
39 | app.post('/api/doctor/signup', async (req, res) => {
40 | const { email, password } = req.body;
41 | try {
42 | const newDoctor = new Doctor({ email, password });
43 | await newDoctor.save();
44 | res.status(201).json(newDoctor);
45 | } catch (error) {
46 | console.error('Doctor signup failed', error);
47 | res.status(500).json({ message: 'Internal server error' });
48 | }
49 | });
50 |
51 | // Patient signup
52 | app.post('/api/patient/signup', async (req, res) => {
53 | const { email, password } = req.body;
54 | try {
55 | const newPatient = new Patient({ email, password });
56 | await newPatient.save();
57 | res.status(201).json(newPatient);
58 | } catch (error) {
59 | console.error('Patient signup failed', error);
60 | res.status(500).json({ message: 'Internal server error' });
61 | }
62 | });
63 | // Dr Info signup
64 | app.post('/api/drInfo/signup', async (req, res) => {
65 | const { name, age, qualification, experience, address, about } = req.body;
66 | try {
67 | const newDrInfo = new drInfo({ name , age , qualification , experience , address, about });
68 | await newDrInfo.save();
69 | res.status(201).json(newDrInfo);
70 | } catch (error) {
71 | console.error('Doctor signup failed', error);
72 | res.status(500).json({ message: 'Internal server error' });
73 | }
74 | });
75 | // Patient Info signup
76 | app.post('/api/patientInfo/signup', async (req, res) => {
77 | const { name, age, address } = req.body;
78 | try {
79 | const newPatientInfo = new patientInfo({ name , age , address});
80 | await newPatientInfo.save();
81 | res.status(201).json(newPatientInfo);
82 | } catch (error) {
83 | console.error('Patient signup failed', error);
84 | res.status(500).json({ message: 'Internal server error' });
85 | }
86 | });
87 |
88 | app.listen(5000, () => {
89 | console.log(`Server is running`);
90 | });
91 |
92 | // Doctor login
93 | app.post('/api/doctor/login', async (req, res) => {
94 | const { email, password } = req.body;
95 | try {
96 | const doctor = await Doctor.findOne({ email });
97 | if (!doctor) {
98 | return res.status(404).json({ message: 'Doctor not found' });
99 | }
100 | if (password !== doctor.password) {
101 | return res.status(401).json({ message: 'Incorrect password' });
102 | }
103 | res.status(200).json(doctor);
104 | } catch (error) {
105 | console.error('Doctor login failed', error);
106 | res.status(500).json({ message: 'Internal server error' });
107 | }
108 | });
109 |
110 | // Patient login
111 | app.post('/api/patient/login', async (req, res) => {
112 | const { email, password } = req.body;
113 | try {
114 | const patient = await Patient.findOne({ email });
115 | if (!patient) {
116 | return res.status(404).json({ message: 'Patient not found' });
117 | }
118 | if (password !== patient.password) {
119 | return res.status(401).json({ message: 'Incorrect password' });
120 | }
121 | res.status(200).json(patient);
122 | } catch (error) {
123 | console.error('Patient login failed', error);
124 | res.status(500).json({ message: 'Internal server error' });
125 | }
126 | });
127 |
128 |
129 |
--------------------------------------------------------------------------------
/src/Dsign.js:
--------------------------------------------------------------------------------
1 | import React,{useState} from 'react';
2 | import axios from 'axios';
3 | import './Dsign.css';
4 | import { BrowserRouter as Router, Link } from 'react-router-dom';
5 |
6 | const Dsign = () => {
7 | const [formData, setFormData] = useState({
8 | name: '',
9 | age: '',
10 | qualification: '',
11 | experience: '',
12 | address: '',
13 | about: '',
14 | });
15 | const [errors, setErrors] = useState({});
16 |
17 | const handleChange = (e) => {
18 | const { name, value } = e.target;
19 | setFormData({
20 | ...formData,
21 | [name]: value
22 | });
23 | };
24 |
25 | const handleSubmit = async (e) => {
26 | e.preventDefault();
27 |
28 | const errors = {};
29 | // Check if fields are filled
30 | if (!formData.name) {
31 | errors.name = 'Name is required';
32 | }
33 | if (!formData.age) {
34 | errors.age = 'Age is required';
35 | }
36 | if (!formData.qualification) {
37 | errors.qualification = 'Qualification is required';
38 | }
39 | if (!formData.experience) {
40 | errors.experience = 'Experience is required';
41 | }
42 | if (!formData.about) {
43 | errors.about = 'About is required';
44 | } else if (formData.about.length < 50) {
45 | errors.about = 'About must be at least 50 characters';
46 | }
47 | if (!formData.address) { // Corrected validation for address
48 | errors.address = 'Address is required';
49 | }
50 |
51 | if (Object.keys(errors).length === 0) {
52 | try {
53 | const response = await axios.post('http://localhost:5000/api/drInfo/signup/', formData);
54 | console.log(response.data);
55 | } catch (error) {
56 | console.error('Form submission failed', error);
57 | }
58 | // Reset form data
59 | setFormData({
60 | name: '',
61 | age: '',
62 | qualification: '',
63 | experience: '',
64 | address: '',
65 | about: '',
66 | });
67 | } else {
68 | // Set errors
69 | setErrors(errors);
70 | }
71 | };
72 |
73 | return (
74 |
75 |
Doctor Details
76 |
77 |
78 |
79 |
Name:
80 |
81 | {errors.name &&
{errors.name}
}
82 |
83 |
84 |
Age:
85 |
92 | {errors.age &&
{errors.age}
}
93 |
94 |
95 |
Qualification:
96 |
103 | {errors.qualification &&
{errors.qualification}
}
104 |
105 |
106 |
Experience (yrs):
107 |
114 | {errors.experience &&
{errors.experience}
}
115 |
116 |
117 |
Address:
118 |
124 | {errors.address &&
{errors.address}
}
125 |
126 |
127 |
About:
128 |
134 | {errors.about &&
{errors.about}
}
135 |
136 | Submit
137 |
138 |
139 |
140 |
141 | );
142 | };
143 |
144 | export default Dsign;
145 |
--------------------------------------------------------------------------------
/src/landingPage.css:
--------------------------------------------------------------------------------
1 | .below-navbar{
2 | display: flex;
3 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
4 | height: 24rem;
5 | }
6 |
7 | .info{
8 | display: flex;
9 | }
10 |
11 | .para1{
12 | display: flex;
13 | font-size: 2.4rem;
14 | margin-left: 4rem;
15 | margin-top: 5rem;
16 | margin-right: 40rem;
17 | font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif
18 | }
19 |
20 | .vector1{
21 | display: flex;
22 | height: 100%;
23 | margin-left: 48rem;
24 | margin-top: -7rem;
25 | }
26 |
27 | @media screen and (max-width : 430px){
28 | .below-navbar{
29 | width: 27rem;
30 | }
31 | .para1{
32 | font-size: 1rem;
33 | margin:1.9rem;
34 | }
35 |
36 | .info{
37 | align-items: center;
38 | }
39 |
40 | .vector1{
41 | height: 100%;
42 | margin-right: 2rem;
43 | margin-top: 2rem;
44 | margin-left: -10rem;
45 | }
46 |
47 | .info{
48 | height: 15rem;
49 | }
50 | }
51 |
52 | @media screen and (max-width : 840px){
53 | .para1{
54 | font-size: 1.7rem;
55 | margin-right: 2rem;
56 | margin-top: 3rem;
57 | margin-left: 2rem;
58 | order: 1;
59 | }
60 |
61 | .info{
62 | display: flex;
63 | flex-direction: column;
64 | height: 30rem;
65 | }
66 |
67 | .vector1{
68 | height: 90%;
69 | width: 70%;
70 | margin-right: 3rem;
71 | margin-top: 4rem;
72 | margin-left: 2rem;
73 | order: 2;
74 | }
75 |
76 | .below-navbar{
77 | height: 45rem;
78 | }
79 | }
80 |
81 | /* ////////////////////////////// */
82 |
83 | .below-vector{
84 | display: flex;
85 | background-image: linear-gradient(to right, #fff0bd, #fffdf5);
86 | height: 17rem;
87 | }
88 |
89 | .choose-d-p{
90 | /* margin-top: 2rem; */
91 | margin-left: 4rem;
92 | }
93 |
94 | .para2{
95 | margin-top: -3rem;
96 | font-size: 3rem;
97 | margin-bottom: 3rem;
98 | font-weight:700;
99 | }
100 |
101 | .para3{
102 | margin-top: -3rem;
103 | font-size: 1.5rem;
104 | margin-left: 0rem;
105 | }
106 |
107 | .lp-buttons{
108 | margin-top: 0rem;
109 | }
110 |
111 | .doctor-button{
112 | background-color: #F9E4A0;
113 | margin: 2rem;
114 | padding: 1rem;
115 | color: black;
116 | font-size: 1.2rem;
117 | padding: 1.4rem;
118 | border-radius: 1rem;
119 | cursor: pointer;
120 | transition: box-shadow 0.3s ease;
121 | border: none;
122 | margin-top: 2rem;
123 | }
124 |
125 | .doctor-button:hover {
126 | box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); /* Add shadow on hover */
127 | }
128 |
129 | .patient-button{
130 | background-color: #F9E4A0;
131 | margin: 2rem;
132 | padding: 1.4rem;
133 | color: black;
134 | font-size: 1.2rem;
135 | border-radius: 1rem;
136 | cursor: pointer;
137 | transition: box-shadow 0.3s ease;
138 | border: none;
139 | }
140 |
141 | .patient-button:hover {
142 | box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); /* Add shadow on hover */
143 | }
144 |
145 | @media screen and (max-width: 840px) {
146 | .below-vector {
147 | height: 18rem;
148 | flex-direction: column;
149 | }
150 |
151 | .choose-d-p {
152 | margin-left: 10rem;
153 | }
154 |
155 | .para2 {
156 | margin-left: 20rem;
157 | font-size: 2rem;
158 | }
159 |
160 | .para3 {
161 | margin-left: 10rem;
162 | font-size: 1.2rem;
163 | }
164 |
165 | .lp-buttons {
166 | margin-top: 1rem;
167 | margin-left: 10rem;
168 | }
169 |
170 | .doctor-button,
171 | .patient-button {
172 | margin: 1rem;
173 | padding: 1rem;
174 | }
175 | }
176 |
177 |
178 | @media screen and (max-width: 430px){
179 | .below-vector {
180 | height: auto;
181 | width: 27rem;
182 | }
183 |
184 | .choose-d-p {
185 | margin-left: 2rem;
186 | align-items: center;
187 | }
188 |
189 | /* .para2 {
190 | margin-left: 20rem;
191 | font-size: 2rem;
192 | }
193 |
194 | .para3 {
195 | margin-left: 0rem;
196 | font-size: 1.2rem;
197 | } */
198 |
199 | .lp-buttons {
200 | margin-top: 1rem;
201 | margin-left: 4rem;
202 | }
203 |
204 | .doctor-button,
205 | .patient-button {
206 | margin: 1rem;
207 | padding: 1rem;
208 | }
209 | }
--------------------------------------------------------------------------------