tweaks

package.json

@@ -10,6 +10,8 @@
   },
   "dependencies": {
     "@chakra-ui/react": "^2.3.6",
+    "@tanstack/react-query": "^4.13.0",
+    "axios": "^1.1.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-icons": "^4.6.0",

src/App.tsx

@@ -5,6 +5,7 @@ import SocialBar from "./components/SocialBar";
 import Hero from "./components/Hero";
 import About from "./components/About";
 import Experiences from "./components/Experiences";
+import Projects from "./components/Projects";
 
 function App() {
   return (
@@ -15,6 +16,7 @@ function App() {
       <Hero />
       <About />
       <Experiences />
+      <Projects />
     </Container>
   );
 }

src/components/About.tsx

@@ -18,6 +18,7 @@ export default function About() {
   const [index, setIndex] = useState(0);
   return (
     <Box
+      id="about"
       w="60%"
       mx="auto"
       h="100vh"

src/components/ExpTabs.tsx

@@ -32,7 +32,7 @@ export default function ExpTabs({ tab, setTab }: Props) {
           bg={tab === 0 ? "whiteAlpha.200" : "none"}
           justifyContent={"center"}
         >
-          <Text color={tab === 0 ? "themeCyan" : "gray.400"}>Work 1</Text>
+          <Text color={tab === 0 ? "themeCyan" : "gray.400"}>Freelance</Text>
         </HStack>
         <HStack
           bg={tab === 1 ? "whiteAlpha.200" : "none"}
@@ -42,7 +42,7 @@ export default function ExpTabs({ tab, setTab }: Props) {
           cursor={"pointer"}
           onClick={() => setTab(1)}
         >
-          <Text color={tab === 1 ? "themeCyan" : "gray.400"}>Work 2</Text>
+          <Text color={tab === 1 ? "themeCyan" : "gray.400"}>Internship</Text>
         </HStack>
         <HStack
           bg={tab === 2 ? "whiteAlpha.200" : "none"}
@@ -52,7 +52,7 @@ export default function ExpTabs({ tab, setTab }: Props) {
           cursor={"pointer"}
           onClick={() => setTab(2)}
         >
-          <Text color={tab === 2 ? "themeCyan" : "gray.400"}>Work 3</Text>
+          <Text color={tab === 2 ? "themeCyan" : "gray.400"}>Internship</Text>
         </HStack>
         <HStack
           cursor={"pointer"}