This commit is contained in:
2024-06-24 00:15:38 -04:00
parent 2cc88cdf72
commit 323e9474f9
28 changed files with 632 additions and 573 deletions

View File

@@ -11,6 +11,7 @@
"@testing-library/react": "^13.0.0", "@testing-library/react": "^13.0.0",
"@testing-library/user-event": "^13.2.1", "@testing-library/user-event": "^13.2.1",
"bootstrap": "^5.1.3", "bootstrap": "^5.1.3",
"prettier": "^3.3.2",
"react": "^18.1.0", "react": "^18.1.0",
"react-bootstrap": "^2.3.1", "react-bootstrap": "^2.3.1",
"react-dom": "^18.1.0", "react-dom": "^18.1.0",

View File

@@ -1,6 +1,5 @@
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="favicon.ico" /> <link rel="icon" href="favicon.ico" />
@@ -38,5 +37,4 @@
To create a production bundle, use `npm run build` or `yarn build`. To create a production bundle, use `npm run build` or `yarn build`.
--> -->
</body> </body>
</html> </html>

View File

@@ -1 +1,19 @@
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"} {
"name": "",
"short_name": "",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}

View File

@@ -5,9 +5,9 @@
top: 0px; top: 0px;
right: 0px; right: 0px;
left: 0px; left: 0px;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
color: azure; color: azure;
overflow: hidden overflow: hidden;
} }
.App-logo { .App-logo {

View File

@@ -15,23 +15,28 @@ function App() {
<hr></hr> <hr></hr>
<About className="About" id="About" /> <About className="About" id="About" />
<div className="publications" id="Publications"> <div className="publications" id="Publications">
<h2 style={{color:"salmon", fontSize:"50px"}}><b>Publications</b></h2> <h2 style={{ color: "salmon", fontSize: "50px" }}>
<b>Publications</b>
</h2>
<SimpleSlider /> <SimpleSlider />
</div> </div>
<div className="Experience" id="Experience"> <div className="Experience" id="Experience">
<h2 style={{color:"salmon", fontSize:"50px", marginTop:"110px"}}><b>Experience</b></h2> <h2 style={{ color: "salmon", fontSize: "50px", marginTop: "110px" }}>
<b>Experience</b>
</h2>
<Experience /> <Experience />
</div> </div>
<div className="DevTools" id="DevTools"> <div className="DevTools" id="DevTools">
<h2 style={{color:"salmon", fontSize:"50px"}}><b>Dev Tools</b></h2> <h2 style={{ color: "salmon", fontSize: "50px" }}>
<b>Dev Tools</b>
</h2>
<DevToolsComponent /> <DevToolsComponent />
</div> </div>
{/* <div className="Contact" id="Contact"> {/* <div className="Contact" id="Contact">
<h2 style={{color:"salmon", fontSize:"50px", marginTop:"60px"}}><b>Contact Me!</b></h2> <h2 style={{color:"salmon", fontSize:"50px", marginTop:"60px"}}><b>Contact Me!</b></h2>
<Contact/> <Contact/>
</div> */} </div> */}
</div> </div>
); );
} }

View File

@@ -1,7 +1,7 @@
import { render, screen } from '@testing-library/react'; import { render, screen } from "@testing-library/react";
import App from './App'; import App from "./App";
test('renders learn react link', () => { test("renders learn react link", () => {
render(<App />); render(<App />);
const linkElement = screen.getByText(/learn react/i); const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument(); expect(linkElement).toBeInTheDocument();

View File

@@ -31,10 +31,11 @@ class About extends Component {
<ul> <ul>
<li> <li>
Currently working at <a href="https://rimidi.com/">Rimidi</a>, Currently working at <a href="https://rimidi.com/">Rimidi</a>,
a Software as a Service (SaaS) startup, full-time as a Software a Software as a Service (SaaS) startup, full-time as a
Engineer with a special emphasis on data interoperabiltiy and Software Engineer with a special emphasis on data
building a robust set of tools to enable secure flow of interoperabiltiy and building a robust set of tools to enable
sensitive patient health information across health systems. secure flow of sensitive patient health information across
health systems.
</li> </li>
<li> <li>
Graduated from Georgia Tech in 2024 with a Master's Of Science Graduated from Georgia Tech in 2024 with a Master's Of Science

View File

@@ -3,13 +3,18 @@ import "bootstrap/dist/css/bootstrap.css";
// import { Row, Col} from "react-bootstrap"; // import { Row, Col} from "react-bootstrap";
import "../css/experience.css"; import "../css/experience.css";
import ExperienceCard from "./experienceCard"; import ExperienceCard from "./experienceCard";
import experienceData from "../data/experience.json" import experienceData from "../data/experience.json";
import InnovaccerLogo from "../media/logos/companies/innovaccerLogo.png"; import InnovaccerLogo from "../media/logos/companies/innovaccerLogo.png";
import Medsupervision from "../media/logos/companies/logo.png" import Medsupervision from "../media/logos/companies/logo.png";
import GeorgiaTech from "../media/logos/companies/GeorgiaTech.png" import GeorgiaTech from "../media/logos/companies/GeorgiaTech.png";
import Rimidi from "../media/logos/companies/rimidi.png" import Rimidi from "../media/logos/companies/rimidi.png";
const logos = {Innovaccer:InnovaccerLogo,Medsupervision:Medsupervision,"Georgia Tech":GeorgiaTech,Rimidi:Rimidi} const logos = {
Innovaccer: InnovaccerLogo,
Medsupervision: Medsupervision,
"Georgia Tech": GeorgiaTech,
Rimidi: Rimidi,
};
class Experience extends Component { class Experience extends Component {
render() { render() {
@@ -17,7 +22,13 @@ class Experience extends Component {
<div className="ExperienceComponent"> <div className="ExperienceComponent">
{experienceData.map(({ company, title, points, term }) => ( {experienceData.map(({ company, title, points, term }) => (
<div> <div>
<ExperienceCard company={company} title={title} points={points} photo={logos[company]} term={term}/> <ExperienceCard
company={company}
title={title}
points={points}
photo={logos[company]}
term={term}
/>
<hr /> <hr />
</div> </div>
))} ))}

View File

@@ -14,12 +14,12 @@ class Publication extends Component {
<Row> <Row>
<div>Publish Date: {this.props.publish_date}</div> <div>Publish Date: {this.props.publish_date}</div>
</Row> </Row>
<div>Link: <a href={this.props.link}>{this.props.link}</a></div> <div>
Link: <a href={this.props.link}>{this.props.link}</a>
</div>
<br /> <br />
<div style={{ fontWeight: "bolder" }}>Abstract:</div> <div style={{ fontWeight: "bolder" }}>Abstract:</div>
<div>{this.props.abstract}</div> <div>{this.props.abstract}</div>
</div> </div>
); );
} }

View File

@@ -3,7 +3,6 @@ import "bootstrap/dist/css/bootstrap.css";
// import { Row, Col, TabContainer } from "react-bootstrap"; // import { Row, Col, TabContainer } from "react-bootstrap";
import "../css/contact.css"; import "../css/contact.css";
function Contact() { function Contact() {
const [name, setName] = useState(""); const [name, setName] = useState("");
const [organization, setOrganization] = useState(""); const [organization, setOrganization] = useState("");
@@ -22,7 +21,7 @@ function Contact () {
}), }),
}); });
// let resJson = await res.json(); // let resJson = await res.json();
console.log(res.status) console.log(res.status);
if (res.status === 200) { if (res.status === 200) {
setName(""); setName("");
setOrganization(""); setOrganization("");
@@ -70,5 +69,4 @@ function Contact () {
); );
} }
export default Contact; export default Contact;

View File

@@ -1,21 +1,19 @@
import React, { Component } from "react"; import React, { Component } from "react";
import PythonLogo from "../media/logos/languages/python-logo.png" import PythonLogo from "../media/logos/languages/python-logo.png";
import JavaLogo from "../media/logos/languages/java-logo.png" import JavaLogo from "../media/logos/languages/java-logo.png";
import CplusLogo from "../media/logos/languages/c++.png" import CplusLogo from "../media/logos/languages/c++.png";
import JavaScriptLogo from "../media/logos/languages/JavaScript.webp" import JavaScriptLogo from "../media/logos/languages/JavaScript.webp";
import '../css/devtools.css' import "../css/devtools.css";
import Languages from "../data/programmingLaguages.json" import Languages from "../data/programmingLaguages.json";
const logos = { const logos = {
"Python":PythonLogo, Python: PythonLogo,
"Java":JavaLogo, Java: JavaLogo,
"C++": CplusLogo, "C++": CplusLogo,
"JavaScript": JavaScriptLogo JavaScript: JavaScriptLogo,
} };
class DevToolsComponent extends Component { class DevToolsComponent extends Component {
render() { render() {
return ( return (
<div> <div>
@@ -31,7 +29,6 @@ render(){
</div> </div>
); );
} }
}
};
export default DevToolsComponent; export default DevToolsComponent;

View File

@@ -6,7 +6,10 @@ import "../css/experience.css";
class ExperienceCard extends Component { class ExperienceCard extends Component {
render() { render() {
return ( return (
<div className="experience-detail" style={{marginTop:"30px", marginBottom:"30px"}}> <div
className="experience-detail"
style={{ marginTop: "30px", marginBottom: "30px" }}
>
<Row> <Row>
<Col xs={12} md={5} className="Company1"> <Col xs={12} md={5} className="Company1">
<img src={this.props.photo} className="Company-Image" /> <img src={this.props.photo} className="Company-Image" />
@@ -27,12 +30,8 @@ class ExperienceCard extends Component {
</div> </div>
</Col> </Col>
</Row> </Row>
</div> </div>
// <div className="experience-detail"> // <div className="experience-detail">
// <h3>{this.props.title}</h3> // <h3>{this.props.title}</h3>
// <Row> // <Row>

View File

@@ -1,10 +1,10 @@
import React, { Component } from "react"; import React, { Component } from "react";
import Slider from "react-slick"; import Slider from "react-slick";
import publicationData from "../data/publications.json" import publicationData from "../data/publications.json";
import Publication from "./Publication"; import Publication from "./Publication";
import "slick-carousel/slick/slick.css"; import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css"; import "slick-carousel/slick/slick-theme.css";
import {FaArrowAltCircleRight,FaArrowAltCircleLeft} from "react-icons/fa" import { FaArrowAltCircleRight, FaArrowAltCircleLeft } from "react-icons/fa";
export default class SimpleSlider extends Component { export default class SimpleSlider extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
@@ -27,15 +27,42 @@ export default class SimpleSlider extends Component {
}; };
return ( return (
<div style={{ height: "auto" }}> <div style={{ height: "auto" }}>
<Slider ref={c => (this.slider = c)} {...settings}> <Slider ref={(c) => (this.slider = c)} {...settings}>
{publicationData.map(({title,authors, publish_date, abstract,link}) =>( {publicationData.map(
<Publication title={title} authors={authors} publish_date={publish_date} abstract={abstract} link={link}/> ({ title, authors, publish_date, abstract, link }) => (
))} <Publication
title={title}
authors={authors}
publish_date={publish_date}
abstract={abstract}
link={link}
/>
),
)}
</Slider> </Slider>
<div style={{ textAlign: "center" }}> <div style={{ textAlign: "center" }}>
<FaArrowAltCircleLeft onClick={this.previous} style={{marginTop:"40px",marginBottom:"40px",borderRadius:"3em" ,fontSize:"40px", color:"aquamarine"}}/> <FaArrowAltCircleLeft
onClick={this.previous}
style={{
marginTop: "40px",
marginBottom: "40px",
borderRadius: "3em",
fontSize: "40px",
color: "aquamarine",
}}
/>
<FaArrowAltCircleRight onClick={this.next} style={{marginTop:"40px", marginBottom:"40px", borderRadius:"3em",fontSize:"40px",marginLeft:"30px", color:"salmon"}}/> <FaArrowAltCircleRight
onClick={this.next}
style={{
marginTop: "40px",
marginBottom: "40px",
borderRadius: "3em",
fontSize: "40px",
marginLeft: "30px",
color: "salmon",
}}
/>
</div> </div>
</div> </div>
); );

View File

@@ -1,4 +1,5 @@
input ,textarea { input,
textarea {
background-color: black; background-color: black;
width: 35%; width: 35%;
height: 40px; height: 40px;
@@ -13,7 +14,7 @@ input ,textarea {
border-bottom: 2px solid aquamarine; border-bottom: 2px solid aquamarine;
font-size: larger; font-size: larger;
} }
input[type=text]:focus { input[type="text"]:focus {
border: none; border: none;
border-bottom: 3px solid salmon; border-bottom: 3px solid salmon;
outline: none; outline: none;
@@ -22,13 +23,10 @@ input[type=text]:focus {
height: auto; height: auto;
display: inline-block; display: inline-block;
/* text-overflow: ellipsis; */ /* text-overflow: ellipsis; */
} }
.MessageBox[type=textarea]:focus { .MessageBox[type="textarea"]:focus {
border: 3px solid salmon; border: 3px solid salmon;
outline: none; outline: none;
} }
button { button {
margin-top: 20px; margin-top: 20px;

View File

@@ -52,4 +52,3 @@
width: 120px; width: 120px;
} }
} }

View File

@@ -9,7 +9,7 @@
.Company-Image { .Company-Image {
width: 65%; width: 65%;
border: 3px solid #B5EAD7; border: 3px solid #b5ead7;
border-radius: 10px; border-radius: 10px;
margin-bottom: 10%; margin-bottom: 10%;
margin-top: 10%; margin-top: 10%;

View File

@@ -37,5 +37,5 @@ tr:hover {
} }
.publication-detail a { .publication-detail a {
color: aquamarine color: aquamarine;
} }

View File

@@ -1,4 +1,5 @@
[ { [
{
"company": "Rimidi", "company": "Rimidi",
"title": "Software Engineer", "title": "Software Engineer",
"points": [ "points": [

View File

@@ -1,4 +1,5 @@
[{ [
{
"title": "Framework for determining the suitability of blockchain: Criteria and issues to consider", "title": "Framework for determining the suitability of blockchain: Criteria and issues to consider",
"authors": "Vikas Hassija, Sherali Zeadally, Ishan Jain, Aman Tahiliani, Vinay Chamola, Shashank Gupta", "authors": "Vikas Hassija, Sherali Zeadally, Ishan Jain, Aman Tahiliani, Vinay Chamola, Shashank Gupta",
"publish_date": "29 July 2021", "publish_date": "29 July 2021",

View File

@@ -1,13 +1,13 @@
body { body {
margin: 0; margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif; sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
code { code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
monospace; monospace;
} }

View File

@@ -1,14 +1,14 @@
import React from 'react'; import React from "react";
import ReactDOM from 'react-dom/client'; import ReactDOM from "react-dom/client";
import './index.css'; import "./index.css";
import App from './App'; import App from "./App";
import reportWebVitals from './reportWebVitals'; import reportWebVitals from "./reportWebVitals";
const root = ReactDOM.createRoot(document.getElementById('root')); const root = ReactDOM.createRoot(document.getElementById("root"));
root.render( root.render(
<React.StrictMode> <React.StrictMode>
<App /> <App />
</React.StrictMode> </React.StrictMode>,
); );
// If you want to start measuring performance in your app, pass a function // If you want to start measuring performance in your app, pass a function

View File

@@ -1,6 +1,6 @@
const reportWebVitals = onPerfEntry => { const reportWebVitals = (onPerfEntry) => {
if (onPerfEntry && onPerfEntry instanceof Function) { if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry); getCLS(onPerfEntry);
getFID(onPerfEntry); getFID(onPerfEntry);
getFCP(onPerfEntry); getFCP(onPerfEntry);

View File

@@ -2,4 +2,4 @@
// allows you to do things like: // allows you to do things like:
// expect(element).toHaveTextContent(/react/i) // expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom // learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom'; import "@testing-library/jest-dom";

View File

@@ -1,2 +1,2 @@
import React from 'react'; import React from "react";
import "./App.css"; import "./App.css";

View File

@@ -7044,6 +7044,11 @@ prelude-ls@~1.1.2:
resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54" resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
integrity sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ= integrity sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ=
prettier@^3.3.2:
version "3.3.2"
resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.3.2.tgz#03ff86dc7c835f2d2559ee76876a3914cec4a90a"
integrity sha512-rAVeHYMcv8ATV5d508CFdn+8/pHPpXeIid1DdrPwXnaAdH7cqjVbpJaT5eq4yRAFU/lsbwYwSF/n5iNrdJHPQA==
pretty-bytes@^5.3.0, pretty-bytes@^5.4.1: pretty-bytes@^5.3.0, pretty-bytes@^5.4.1:
version "5.6.0" version "5.6.0"
resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-5.6.0.tgz#356256f643804773c82f64723fe78c92c62beaeb" resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-5.6.0.tgz#356256f643804773c82f64723fe78c92c62beaeb"