Resume Drive Link Added

package.json

@@ -9,6 +9,7 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-icons": "^5.2.1",
+    "react-router-dom": "^6.26.0",
     "react-scripts": "5.0.1",
     "vercel": "^34.3.0",
     "web-vitals": "^2.1.4"
@@ -38,7 +39,7 @@
     ]
   },
   "devDependencies": {
-    "tailwindcss": "^3.4.4",
-    "@babel/plugin-proposal-private-methods": "^7.16.7"
+    "@babel/plugin-proposal-private-methods": "^7.16.7",
+    "tailwindcss": "^3.4.4"
   }
 }

src/Name/Name.js

@@ -5,6 +5,9 @@ function Name() {
     <div className='text-left flex flex-row md:flex-col gap-4'>
         <p className='text-4xl md:text-6xl font-bold'>Khushaal</p>
         <p className='text-4xl md:text-6xl font-bold'>Nandwani</p>
+
+        {/* Subtitle */}
+        <p className='text md:text-4xl'>Software Developer</p>
     </div>
 
   );

src/Sections/Projects/ProjectSelector.js

@@ -6,11 +6,13 @@ import ExperienceData from './ExperienceData';
 import Frogger from './Frogger';
 import RaffleManager from './RaffleManager';
 import TPTracker from './TPTracker';
+import TallyToSQL from './TallyToSQL';
 
 const ProjectsDescription = ({ selectedProject }) => {
     return (
         <div className='flex'>
             <div>
+                {selectedProject === 'tallyToSQL' && <TallyToSQL />}
                 {selectedProject === 'proxiee' && <Proxiee />}
                 {selectedProject === 'learningEngine' && <LearningEngine />}
                 {selectedProject === 'questionSuggester' && <QuestionSuggester />}

src/Sections/Projects/Proxiee.js

@@ -1,18 +1,32 @@
+import GithubLink from "./_Github";
+
 const Proxiee = () => {
-    return (
-        <div>
-            <p className="text-2xl font-bold">Proxiee</p>
-            <p className="italic">Python, Flask</p>
-            <li>Engineered a secure server gateway, Proxiee, enabling company developers to access online
-APIs such as ChatGPT and those of online internal products through a locally hosted server connected to an internet-enabled
-server.</li>
-            <li>Implemented support for all HTTP method types, integrated API access restrictions, and designed an au-
-thentication system to ensure secure connections along with an extensive logging system and a log analysis
-tool.</li>
-<li>Has a config file, to assign users credentials, store Authorization keys and dynamically add headers specific to APIs </li>
-        </div>
-    );
-}
+  return (
+    <div>
+      <div class="flex flex-row justify-between">
+        <p className="text-2xl font-bold">Proxiee</p>
+        <GithubLink link="https://github.com/khushaal-nandwani/proxiee" />
+      </div>
+      <p className="italic">Python, Flask</p>
+      <li>
+        Engineered a secure server gateway, Proxiee, enabling company developers
+        to access online APIs such as ChatGPT and those of online internal
+        products through a locally hosted server connected to an
+        internet-enabled server.
+      </li>
+      <li>
+        Implemented support for all HTTP method types, integrated API access
+        restrictions, and designed an au- thentication system to ensure secure
+        connections along with an extensive logging system and a log analysis
+        tool.
+      </li>
+      <li>
+        Has a config file, to assign users credentials, store Authorization keys
+        and dynamically add headers specific to APIs{" "}
+      </li>
+    </div>
+  );
+};
 
 export default Proxiee;
-export const tags = ['Python', 'Flask', 'Backend'];
+export const tags = ["Python", "Flask", "Backend"];

src/Sections/Projects/RaffleManager.js

@@ -1,13 +1,28 @@
+import GithubLink from "./_Github"
+
 const RaffleManager = () => {
-    return (
-        <div class="text-left">
+  return (
+    <div class="text-left">
+        <div className="flex flex-row justify-between">
             <p className="text-2xl font-bold">Raffle Manager</p>
-            <p className="italic">Java, MySQL, AWS</p>
-            <li>A Java application to manager raffles, having a participant and an admin side. Create raffles, add participants, and draw winners.</li>
-            <li>Developed with a team of 7. Followed clean coding practices, used design patterns, and satisfied SOLID principles with an easy-to-follow package structure.</li>
-            <li>Hosted using Amazon Web Services (AWS) queried using MySQL. Linked to the Java app using JDBC connector and managed using MySQL Workbench.</li>
-        </div>
-    );
-}
+            <GithubLink link="https://github.com/CSC207-UofT/course-project-sedative-skyscrapers" />
+            </div>
+      <p className="italic">Java, MySQL, AWS</p>
+      <li>
+        A Java application to manager raffles, having a participant and an admin
+        side. Create raffles, add participants, and draw winners.
+      </li>
+      <li>
+        Developed with a team of 7. Followed clean coding practices, used design
+        patterns, and satisfied SOLID principles with an easy-to-follow package
+        structure.
+      </li>
+      <li>
+        Hosted using Amazon Web Services (AWS) queried using MySQL. Linked to
+        the Java app using JDBC connector and managed using MySQL Workbench.
+      </li>
+    </div>
+  );
+};
 
-export default RaffleManager;
+export default RaffleManager;

src/Sections/Projects/TPTracker.js

@@ -1,7 +1,12 @@
+import GithubLink from "./_Github";
+
 const TPTracker = () => {
     return (
-        <div class="text-left">
-            <p className="text-2xl font-bold">Toilet Paper Tracker</p>
+        <div className="text-left">
+            <div class="flex flex-row justify-between">
+                <p className="text-2xl font-bold">Toilet Paper Tracker</p>
+                <GithubLink link="https://devpost.com/software/tptracker" />
+            </div>
             <p className="italic">Python, Adruino</p>
             <li>A hardware project made in TartanHacks using Arduino and Python which read live data from the Arduino circuit to detect when the toilet paper would run out.</li>
             <li>Once the toilet paper runs out, an email is sent using smtplib, ssl certified to the custodial staff.</li>

src/Sections/Projects/TallyToSQL.js

@@ -0,0 +1,22 @@
+import GithubLink from "./_Github"
+
+const TallyToSQL = () => {
+  return (
+    <div>
+        <div class="flex flex-row justify-between">
+            <p className="text-2xl font-bold">Tally-To-SQL</p>
+            <GithubLink link="https://github.com/khushaal-nandwani/tally-to-SQL" />
+        </div>
+        <p className="italic">XML, SQL, Python</p>
+        <li>Developed a Python script to convert Tally - the largest software accounting software in India - export format XML files to an SQL database.</li>
+        <li>Used SQL queries to create tables and insert data into the database while providing an interactive GUI.</li>
+        <li>Wrote XLST scripts, to clean and modify the XML files</li>
+
+
+
+    </div>
+  );
+};
+
+export default TallyToSQL;
+export const tags = ["XML", "SQL", "Python"];

src/Sections/Projects/_Github.js

@@ -0,0 +1,19 @@
+import { FaGithub } from "react-icons/fa";
+
+const GithubLink = ({ link }) => {
+  const handleGithubClick = () => {
+    window.open(link, "_blank");
+  };
+
+  return (
+    <div>
+      <FaGithub
+        className="h-8 w-8 hover:scale-125 transition-transform cursor-pointer"
+        style={{ fill: "yellow" }}
+        onClick={handleGithubClick}
+      ></FaGithub>
+    </div>
+  );
+};
+
+export default GithubLink;

src/Sections/SectionContainer.js

@@ -18,6 +18,7 @@ function SectionContainer() {
     projects: "projects",
     experience: "experience",
     // projects
+    tallyToSQL: "tallyToSQL",
     proxiee: "proxiee",
     learningEngine: "learningEngine",
     questionSuggester: "questionSuggester",

src/Sections/SectionList.js

@@ -1,14 +1,15 @@
 import React from "react";
 
 function SectionList({ handleLinkClick }) {
+  const ResumeLink = "https://drive.google.com/file/d/1tUCYltf8Im0r27ai1YvUVXlqEmFcDh26/view?usp=share_link"
 
   return (
     <div className="flex flex-col gap-4 text-2xl ">
       <a onClick={() => handleLinkClick('education', 0)} className="hover:scale-125 transition-transform cursor-pointer">Education</a>
       {/* <a onClick={() => handleLinkClick('books', 0)} className="hover:scale-125 transition-transform cursor-pointer">Books</a> */}
       <a onClick={() => handleLinkClick('projects', 0)} className="hover:scale-125 transition-transform cursor-pointer">Projects</a>
       <a onClick={() => handleLinkClick('experience', 0)} className="hover:scale-125 transition-transform cursor-pointer">Experience</a>
-      <a href="knresume.pdf" target="_blank" className="hover:scale-125 transition-transform cursor-pointer">Resume</a>
+      <a href="https://drive.google.com/file/d/1tUCYltf8Im0r27ai1YvUVXlqEmFcDh26/view?usp=share_link" target="_blank" className="hover:scale-125 transition-transform cursor-pointer">Resume</a>
     </div>
     );
 }

src/Tip/Tip.js

@@ -14,7 +14,7 @@ function Tip({ message, duration }) {
 
 
   return (
-    <div className={`fixed top-4 text-xl left-1/2 transform -translate-x-1/2 p-2 rounded font-bold
+    <div className={`fixed top-4 text-sm md:text-xl left-1/2 transform -translate-x-1/2 p-2 rounded font-bold
     ${visible ? '' : 'button-hide'}
     `}>
       {message}