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/user-event": "^13.2.1",
"bootstrap": "^5.1.3",
"prettier": "^3.3.2",
"react": "^18.1.0",
"react-bootstrap": "^2.3.1",
"react-dom": "^18.1.0",

View File

@@ -1,7 +1,6 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<head>
<meta charset="utf-8" />
<link rel="icon" href="favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
@@ -22,9 +21,9 @@
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>Aman Tahiliani</title>
</head>
</head>
<body>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
@@ -37,6 +36,5 @@
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</body>
</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

@@ -1,27 +1,27 @@
.App {
.App {
text-align: center;
background-color: black;
position: absolute;
top: 0px;
right: 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;
overflow: hidden
}
overflow: hidden;
}
.App-logo {
.App-logo {
height: 40vmin;
pointer-events: none;
}
}
@media (prefers-reduced-motion: no-preference) {
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
}
.App-header {
.App-header {
background-color: black;
min-height: 100vh;
display: flex;
@@ -30,45 +30,45 @@
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
}
.App-link {
.App-link {
color: #61dafb;
}
}
@keyframes App-logo-spin {
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
}
.About {
.About {
width: 100%;
position: absolute;
top: 120px;
bottom: 0px;
left: 0px;
right: 0px;
}
}
hr {
hr {
width: 70%;
margin-left: 15% !important;
margin-right: 15% !important;
border: 10px solid aquamarine;
}
}
.publications {
.publications {
margin-top: 230px;
}
}
.slick-dots button:before {
.slick-dots button:before {
color: grey !important;
}
}
.slick-dots li.slick-active button:before {
.slick-dots li.slick-active button:before {
color: White !important;
}
}

View File

@@ -9,29 +9,34 @@ import DevToolsComponent from "./components/devtools";
function App() {
return (
<div className="App" >
<div className="App">
<meta name="Aman Tahiliani's Portfolio"></meta>
<Header />
<hr></hr>
<About className ="About" id="About"/>
<About className="About" id="About" />
<div className="publications" id="Publications">
<h2 style={{color:"salmon", fontSize:"50px"}}><b>Publications</b></h2>
<SimpleSlider/>
<h2 style={{ color: "salmon", fontSize: "50px" }}>
<b>Publications</b>
</h2>
<SimpleSlider />
</div>
<div className="Experience" id="Experience">
<h2 style={{color:"salmon", fontSize:"50px", marginTop:"110px"}}><b>Experience</b></h2>
<Experience/>
<h2 style={{ color: "salmon", fontSize: "50px", marginTop: "110px" }}>
<b>Experience</b>
</h2>
<Experience />
</div>
<div className="DevTools" id="DevTools">
<h2 style={{color:"salmon", fontSize:"50px"}}><b>Dev Tools</b></h2>
<DevToolsComponent/>
<h2 style={{ color: "salmon", fontSize: "50px" }}>
<b>Dev Tools</b>
</h2>
<DevToolsComponent />
</div>
{/* <div className="Contact" id="Contact">
<h2 style={{color:"salmon", fontSize:"50px", marginTop:"60px"}}><b>Contact Me!</b></h2>
<Contact/>
</div> */}
</div>
);
}

View File

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

View File

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

View File

@@ -3,27 +3,38 @@ import "bootstrap/dist/css/bootstrap.css";
// import { Row, Col} from "react-bootstrap";
import "../css/experience.css";
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 Medsupervision from "../media/logos/companies/logo.png"
import GeorgiaTech from "../media/logos/companies/GeorgiaTech.png"
import Rimidi from "../media/logos/companies/rimidi.png"
import Medsupervision from "../media/logos/companies/logo.png";
import GeorgiaTech from "../media/logos/companies/GeorgiaTech.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 {
render() {
return (
<div className="ExperienceComponent">
{experienceData.map(({company,title, points, term}) =>(
{experienceData.map(({ company, title, points, term }) => (
<div>
<ExperienceCard company={company} title={title} points={points} photo={logos[company]} term={term}/>
<hr/>
<ExperienceCard
company={company}
title={title}
points={points}
photo={logos[company]}
term={term}
/>
<hr />
</div>
))}
</div>
);
}
}
}
export default Experience;
export default Experience;

View File

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

View File

@@ -3,8 +3,7 @@ import "bootstrap/dist/css/bootstrap.css";
// import { Row, Col, TabContainer } from "react-bootstrap";
import "../css/contact.css";
function Contact () {
function Contact() {
const [name, setName] = useState("");
const [organization, setOrganization] = useState("");
const [message, setMessage] = useState("");
@@ -22,7 +21,7 @@ function Contact () {
}),
});
// let resJson = await res.json();
console.log(res.status)
console.log(res.status);
if (res.status === 200) {
setName("");
setOrganization("");
@@ -43,32 +42,31 @@ function Contact () {
value={name}
placeholder="Name"
onChange={(e) => setName(e.target.value)}
required = "true"
required="true"
/>
<br/>
<br />
<input
type="text"
value={organization}
placeholder="Organization"
onChange={(e) => setOrganization(e.target.value)}
/>
<br/>
<br />
<textarea
className="MessageBox"
type="textarea"
value={message}
placeholder="Message"
onChange={(e) => setMessage(e.target.value)}
required = "true"
required="true"
/>
<br/>
<br />
<button type="submit">Send!</button>
<div className="popup">{popup ? <p>{popup}</p> : null}</div>
</form>
</div>
);
}
}
export default Contact;

View File

@@ -1,27 +1,25 @@
import React, { Component } from "react";
import PythonLogo from "../media/logos/languages/python-logo.png"
import JavaLogo from "../media/logos/languages/java-logo.png"
import CplusLogo from "../media/logos/languages/c++.png"
import JavaScriptLogo from "../media/logos/languages/JavaScript.webp"
import '../css/devtools.css'
import Languages from "../data/programmingLaguages.json"
import PythonLogo from "../media/logos/languages/python-logo.png";
import JavaLogo from "../media/logos/languages/java-logo.png";
import CplusLogo from "../media/logos/languages/c++.png";
import JavaScriptLogo from "../media/logos/languages/JavaScript.webp";
import "../css/devtools.css";
import Languages from "../data/programmingLaguages.json";
const logos = {
"Python":PythonLogo,
"Java":JavaLogo,
"C++":CplusLogo,
"JavaScript": JavaScriptLogo
}
Python: PythonLogo,
Java: JavaLogo,
"C++": CplusLogo,
JavaScript: JavaScriptLogo,
};
class DevToolsComponent extends Component {
render(){
render() {
return (
<div>
{/* <h2>Programming Languages</h2> */}
<div className="dev-tools-container">
{Languages.map(({name}) => (
{Languages.map(({ name }) => (
<div className="dev-tool">
<img src={logos[name]} alt={name} className="dev-tool-logo" />
<h3>{name}</h3>
@@ -30,8 +28,7 @@ render(){
</div>
</div>
);
}
}
};
export default DevToolsComponent;

View File

@@ -6,20 +6,23 @@ import "../css/experience.css";
class ExperienceCard extends Component {
render() {
return (
<div className="experience-detail" style={{marginTop:"30px", marginBottom:"30px"}}>
<div
className="experience-detail"
style={{ marginTop: "30px", marginBottom: "30px" }}
>
<Row>
<Col xs={12} md={5} className="Company1">
<img src={this.props.photo} className="Company-Image"/>
<img src={this.props.photo} className="Company-Image" />
{/* <h3 className="Company">{this.props.company}</h3> */}
<h4>({this.props.term})</h4>
</Col>
<Col xs={12} md={7} >
<Col xs={12} md={7}>
<div className="experience-details">
<h3 className="JobTitle">{this.props.title}</h3>
<hr/>
<hr />
<div>
<ul>
{this.props.points.map((item,i) =>(
{this.props.points.map((item, i) => (
<li>{item}</li>
))}
</ul>
@@ -27,12 +30,8 @@ class ExperienceCard extends Component {
</div>
</Col>
</Row>
</div>
// <div className="experience-detail">
// <h3>{this.props.title}</h3>
// <Row>

View File

@@ -1,10 +1,10 @@
import React, { Component } from "react";
import Slider from "react-slick";
import publicationData from "../data/publications.json"
import publicationData from "../data/publications.json";
import Publication from "./Publication";
import "slick-carousel/slick/slick.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 {
constructor(props) {
super(props);
@@ -26,16 +26,43 @@ export default class SimpleSlider extends Component {
slidesToScroll: 1,
};
return (
<div style={{height:"auto"}}>
<Slider ref={c => (this.slider = c)} {...settings}>
{publicationData.map(({title,authors, publish_date, abstract,link}) =>(
<Publication title={title} authors={authors} publish_date={publish_date} abstract={abstract} link={link}/>
))}
<div style={{ height: "auto" }}>
<Slider ref={(c) => (this.slider = c)} {...settings}>
{publicationData.map(
({ title, authors, publish_date, abstract, link }) => (
<Publication
title={title}
authors={authors}
publish_date={publish_date}
abstract={abstract}
link={link}
/>
),
)}
</Slider>
<div style={{ textAlign: "center"}}>
<FaArrowAltCircleLeft onClick={this.previous} style={{marginTop:"40px",marginBottom:"40px",borderRadius:"3em" ,fontSize:"40px", color:"aquamarine"}}/>
<div style={{ textAlign: "center" }}>
<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>
);

View File

@@ -40,7 +40,7 @@ li {
padding-right: 5%;
}
li>a {
li > a {
color: hotpink;
}

View File

@@ -1,4 +1,5 @@
input ,textarea {
input,
textarea {
background-color: black;
width: 35%;
height: 40px;
@@ -13,32 +14,29 @@ input ,textarea {
border-bottom: 2px solid aquamarine;
font-size: larger;
}
input[type=text]:focus {
input[type="text"]:focus {
border: none;
border-bottom: 3px solid salmon;
outline: none;
}
.MessageBox{
.MessageBox {
height: auto;
display: inline-block;
/* text-overflow: ellipsis; */
}
.MessageBox[type=textarea]:focus {
.MessageBox[type="textarea"]:focus {
border: 3px solid salmon;
outline: none;
}
button{
button {
margin-top: 20px;
margin-bottom: 30px;
border: 2px solid rgb(122, 224, 143);
color:darkblue;
border-radius: 0.8em ;
color: darkblue;
border-radius: 0.8em;
width: auto;
height: 40px;
font-size: larger;
font-weight:600;
font-weight: 600;
background-color: rgb(5, 255, 180);
}

View File

@@ -3,9 +3,9 @@
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
}
.dev-tool {
.dev-tool {
display: flex;
flex-direction: column;
align-items: center;
@@ -15,22 +15,22 @@
width: 200px;
max-width: 100%;
text-align: center;
}
}
.dev-tool-logo {
.dev-tool-logo {
width: 100px;
height: 100px;
border-radius: 50%;
object-fit: cover;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease-in-out;
}
}
.dev-tool-logo:hover {
.dev-tool-logo:hover {
transform: scale(1.1);
}
}
@keyframes toolAnimation {
@keyframes toolAnimation {
from {
opacity: 0;
transform: translateY(20px);
@@ -39,17 +39,16 @@
opacity: 1;
transform: translateY(0);
}
}
}
@media screen and (max-width: 768px) {
@media screen and (max-width: 768px) {
.dev-tool {
width: 150px;
}
}
}
@media screen and (max-width: 480px) {
@media screen and (max-width: 480px) {
.dev-tool {
width: 120px;
}
}
}

View File

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

View File

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

View File

@@ -1,7 +1,8 @@
[ {
[
{
"company": "Rimidi",
"title": "Software Engineer",
"points":[
"points": [
"Building Interoperable Health data parsers in order to be able to ingest health information from any US Electronic Health Record systems and write information back to them.",
"Focused on upgrades to the existing Rimidi Infrastructure to aid with efforts towards containerization and integration of cloud-first architecture.",
"Owner of the Rimidify (Data interpretation) and EhrMes (Data Writeback) micro-services and domain expert on FHIR and HL7 specs."

View File

@@ -11,4 +11,4 @@
{
"name": "JavaScript"
}
]
]

View File

@@ -1,4 +1,5 @@
[{
[
{
"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",
"publish_date": "29 July 2021",

View File

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

View File

@@ -1,14 +1,14 @@
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import React from "react";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
const root = ReactDOM.createRoot(document.getElementById('root'));
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
</React.StrictMode>,
);
// 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) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);

View File

@@ -2,4 +2,4 @@
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// 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";

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"
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:
version "5.6.0"
resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-5.6.0.tgz#356256f643804773c82f64723fe78c92c62beaeb"