Merge branch 'main' of https://github.com/nishchay17/portfolio

nishchay17 · Nov 17, 2023 · d7c7767 · d7c7767 · vercel · Nov 17, 2023
2 parents b09059b + 73eda4d
commit d7c7767
Show file tree

Hide file tree

Showing 24 changed files with 1,032 additions and 819 deletions.
diff --git a/app/Analytics.tsx b/app/Analytics.tsx
@@ -0,0 +1,29 @@
+import Script from "next/script";
+
+import * as gtag from "../lib/gtag";
+
+function Analytics() {
+  return (
+    <>
+      <Script
+        strategy="afterInteractive"
+        src={`https://www.googletagmanager.com/gtag/js?id=${gtag.GA_TRACKING_ID}`}
+      />
+      <Script
+        id="gtag-init"
+        strategy="afterInteractive"
+        dangerouslySetInnerHTML={{
+          __html: `
+            window.dataLayer = window.dataLayer || [];
+            function gtag(){dataLayer.push(arguments);}
+            gtag('js', new Date());
+            gtag('config', '${gtag.GA_TRACKING_ID}', {
+              page_path: window.location.pathname,
+            });
+          `,
+        }}
+      />
+    </>
+  );
+}
+export default Analytics;
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -0,0 +1,32 @@
+import "../styles/globals.css";
+import type { Metadata } from "next";
+import { Inter } from "next/font/google";
+
+import { Providers } from "./provider";
+import Analytics from "./Analytics";
+
+export const metadata: Metadata = {
+  title: {
+    template: "%s | Nishchay",
+    default: "Nishchay",
+  },
+  description: "Portfolio made with Next JS | Nishchay17",
+  icons: ["/svg/logo.svg"],
+};
+
+const inter = Inter({ subsets: ["latin"] });
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body className={inter.className}>
+        <Analytics />
+        <Providers>{children}</Providers>
+      </body>
+    </html>
+  );
+}
diff --git a/pages/index.tsx → app/page.tsx b/pages/index.tsx → app/page.tsx
@@ -1,12 +1,10 @@
 import { ReactElement } from "react";
-import dynamic from "next/dynamic";
 import { Container } from "@chakra-ui/layout";
 
-const HeroSection = dynamic(() => import("../components/Landing/HeroSection"));
-const Projects = dynamic(() => import("../components/Landing/Projects"));
-const Tech = dynamic(() => import("../components/Landing/Tech"));
-const Social = dynamic(() => import("../components/Landing/Social"));
-
+import HeroSection from "../components/Landing/HeroSection";
+import Projects from "../components/Landing/Projects";
+import Tech from "../components/Landing/Tech";
+import Social from "../components/Landing/Social";
 import Layout from "../components/Layout";
 
 function Home(): ReactElement {

diff --git a/app/project/[id]/page.tsx b/app/project/[id]/page.tsx
@@ -0,0 +1,32 @@
+import React, { ReactElement } from "react";
+import type { Metadata } from "next";
+
+import ProjectLayout from "../../../components/ProjectPage/ProjectLayout";
+import Layout from "../../../components/Layout";
+import { projects } from "../../../config/project";
+import { Project } from "../../../interface/Project";
+
+export const metadata: Metadata = {
+  title: "Project",
+};
+
+function Project({ params: { id } }: { params: { id: string } }): ReactElement {
+  let project: Project = {
+    id: 99,
+    name: "No project found",
+    description: "No project with this Id found",
+    tag: "",
+  };
+  if (id) {
+    const currentProject = projects.find((project) => project.id == +id);
+    if (!!currentProject) {
+      project = currentProject;
+    }
+  }
+
+  return (
+    <Layout>{!project ? <></> : <ProjectLayout project={project} />}</Layout>
+  );
+}
+
+export default Project;
diff --git a/app/provider.tsx b/app/provider.tsx
@@ -0,0 +1,14 @@
+"use client";
+
+import { ChakraProvider } from "@chakra-ui/react";
+import { AnimatePresence } from "framer-motion";
+
+import { theme } from "../lib/theme";
+
+export function Providers({ children }: { children: React.ReactNode }) {
+  return (
+    <ChakraProvider theme={theme}>
+      <AnimatePresence>{children}</AnimatePresence>
+    </ChakraProvider>
+  );
+}
diff --git a/components/Landing/Experience.tsx b/components/Landing/Experience.tsx
@@ -2,30 +2,7 @@ import React, { ReactElement } from "react";
 import { Box, Flex, Text, List, ListItem, ListIcon } from "@chakra-ui/react";
 import { FiMinus } from "react-icons/fi";
 
-const exps = [
-  {
-    company: "Homelane",
-    title: "Software Engineer Intern",
-    date: "Jan 2022 - Present",
-    points: [
-      "Worked on developing dashboard using React js and SCSS",
-      "Migrated vanilla javascript code to React js code",
-      "Fixed existing bugs and added functionalities in dashboards",
-      "Converted design to pixel-perfect components",
-    ],
-  },
-  {
-    company: "The Internet Folks",
-    title: "Software Engineer Intern",
-    date: "Dec 2020 - June 2021",
-    points: [
-      "Used Next js (react js) with server-side rendering",
-      "Used Redux (Redux toolkit) for state management",
-      "Converted UI design to reusable, scalable react components",
-      "Implemented Debouncing to reduce API calls",
-    ],
-  },
-];
+import { experience } from "../../config/experience";
 
 function Experience(): ReactElement {
   return (
@@ -34,7 +11,7 @@ function Experience(): ReactElement {
         Experience
       </Text>
 
-      {exps.map(({ company, title, points, date }) => {
+      {experience.map(({ company, title, points, date }) => {
         return (
           <Box key={date} mb="2rem">
             <Box

diff --git a/components/Landing/HeroSection.tsx b/components/Landing/HeroSection.tsx
@@ -35,7 +35,7 @@ function HeroSection(): ReactElement {
                 fontSize={["2.75rem", "3rem", "4rem", "6vw"]}
                 letterSpacing="1px"
                 lineHeight={1}
-                fontWeight={600}
+                fontWeight={500}
                 textAlign="center"
               >
                 Hello there <br /> I am Nishchay
@@ -46,7 +46,7 @@ function HeroSection(): ReactElement {
               animate={{ opacity: 1 }}
               transition={{ delay: 0.6 }}
               as={Text}
-              fontSize={["1.1rem", "1.2rem", "1.4rem", "1.5rem", "1.5vw"]}
+              fontSize={["1.1rem", "1.2rem", "1.3rem", "1.4rem", "1.4vw"]}
               mt="1rem"
               color="blackAlpha.800"
               lineHeight="120%"
@@ -70,7 +70,6 @@ function HeroSection(): ReactElement {
               >
                 <Button
                   variant="btn-black"
-                  isFullWidth={false}
                   leftIcon={<FiDownload size="1.2rem" />}
                   size="sm"
                 >
@@ -84,7 +83,6 @@ function HeroSection(): ReactElement {
                   variant="btn-black"
                   initial={{ scale: 0.9 }}
                   animate={{ scale: 1 }}
-                  isFullWidth={false}
                   leftIcon={<FiMail size="1.2rem" />}
                   ml={[0, "1rem"]}
                   mt={["1rem", 0]}

diff --git a/components/Landing/Projects.tsx b/components/Landing/Projects.tsx
@@ -1,3 +1,5 @@
+"use client";
+
 import React, { ReactElement, useEffect } from "react";
 import Link from "next/link";
 import Image from "next/image";
@@ -116,7 +118,7 @@ function Projects(): ReactElement {
           textAlign="center"
           fontSize={["4xl", "5xl", "6xl"]}
           py="3.5rem"
-          fontWeight={600}
+          fontWeight={500}
           lineHeight={"100%"}
         >
           Featured Projects

diff --git a/components/Landing/Tech.tsx b/components/Landing/Tech.tsx
@@ -29,7 +29,7 @@ function Tech(): ReactElement {
         <Heading
           as="h3"
           fontSize={["4xl", "5xl", "6xl"]}
-          fontWeight={600}
+          fontWeight={500}
           lineHeight={"100%"}
           mb="1.5rem"
         >

diff --git a/components/Layout.tsx b/components/Layout.tsx
@@ -1,27 +1,22 @@
+"use client";
+
 import React, { ReactElement, useState } from "react";
-import Head from "next/head";
 import { Waypoint } from "react-waypoint";
 
 import MotionBox from "./MotionBox";
 import Nav from "./Nav";
 interface Props {
   children: ReactElement[] | ReactElement;
-  title: string;
-  withAuth: boolean;
-  withAnimation: boolean;
+  withAnimation?: boolean;
 }
 
 const variants = {
   hidden: { opacity: 0, x: 0, y: -100 },
   enter: { opacity: 1, x: 0, y: 0 },
   exit: { opacity: 0, x: 0, y: -100 },
 };
-function Layout({
-  children,
-  title,
-  withAuth,
-  withAnimation,
-}: Props): ReactElement {
+
+function Layout({ children, withAnimation = false }: Props): ReactElement {
   const [isSticky, setIsSticky] = useState<boolean>(false);
 
   const setSticky = () => {
@@ -52,9 +47,6 @@ function Layout({
       exit="exit"
       transition={{ type: "linear", duration: 0.45 }}
     >
-      <Head>
-        <title>{title !== "" ? `Nishchay | ${title}` : "Nishchay"}</title>
-      </Head>
       <Waypoint
         onEnter={removeSticky}
         onPositionChange={onWaypointPositionChange}
@@ -65,10 +57,4 @@ function Layout({
   );
 }
 
-Layout.defaultProps = {
-  title: "",
-  withAuth: false,
-  withAnimation: true,
-};
-
 export default Layout;
diff --git a/components/MotionBox.tsx b/components/MotionBox.tsx
@@ -1,3 +1,5 @@
+"use client";
+
 import React, { ReactElement } from "react";
 import { Box, BoxProps } from "@chakra-ui/layout";
 import { motion } from "framer-motion";

diff --git a/components/Nav.tsx b/components/Nav.tsx
@@ -1,3 +1,5 @@
+"use client";
+
 import React, { ReactElement } from "react";
 import Link from "next/link";
 import { Box, Flex, Text } from "@chakra-ui/react";

diff --git a/components/ProjectPage/ProjectLayout.tsx b/components/ProjectPage/ProjectLayout.tsx
@@ -1,3 +1,5 @@
+"use client";
+
 import React, { ReactElement, useEffect, useState } from "react";
 import Link from "next/link";
 import { Button, ButtonGroup } from "@chakra-ui/button";
@@ -162,7 +164,9 @@ function ProjectLayout({ project }: Props): ReactElement {
               </Badge>
             ))}
           </Flex>
-          <Text fontSize="lg">Created on: {project.createdOn}</Text>
+          {!!project?.createdOn ? (
+            <Text fontSize="lg">Created on: {project.createdOn}</Text>
+          ) : null}
           <Box mt="1rem">
             <Text>{project?.description}</Text>
             <ButtonGroup variant="btn-black" mt="2rem">

diff --git a/config/experience.ts b/config/experience.ts
@@ -0,0 +1,24 @@
+export const experience = [
+  {
+    company: "Homelane",
+    title: "Software Engineer Intern",
+    date: "Jan 2022 - Present",
+    points: [
+      "Worked on developing dashboard using React js and SCSS",
+      "Migrated vanilla javascript code to React js code",
+      "Fixed existing bugs and added functionalities in dashboards",
+      "Converted design to pixel-perfect components",
+    ],
+  },
+  {
+    company: "The Internet Folks",
+    title: "Software Engineer Intern",
+    date: "Dec 2020 - June 2021",
+    points: [
+      "Used Next js (react js) with server-side rendering",
+      "Used Redux (Redux toolkit) for state management",
+      "Converted UI design to reusable, scalable react components",
+      "Implemented Debouncing to reduce API calls",
+    ],
+  },
+];
diff --git a/interface/Project.ts b/interface/Project.ts
@@ -7,6 +7,6 @@ export type Project = {
   live?: string;
   tag: string;
   bg?: string;
-  createdOn: string;
+  createdOn?: string;
   additionalTags?: Readonly<string[]>;
 };
diff --git a/next.config.js b/next.config.js
@@ -2,11 +2,5 @@
 module.exports = {
   swcMinify: true,
   reactStrictMode: true,
-  typescript: {
-    ignoreBuildErrors: true,
-  },
-  images: {
-    domains: ["bkgsewdluleimqnwhzyo.supabase.co"],
-  },
   productionBrowserSourceMaps: true,
 };
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "portfolio",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -9,17 +9,18 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@chakra-ui/react": "^1.6.6",
-    "@emotion/react": "^11",
-    "@emotion/styled": "^11",
+    "@chakra-ui/next-js": "^2.1.5",
+    "@chakra-ui/react": "^2.8.1",
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
     "@fontsource/cormorant-garamond": "^4.5.10",
     "@fontsource/source-sans-pro": "^4.5.10",
     "chakra-ui-markdown-renderer": "^4.0.0",
-    "framer-motion": "^4",
+    "framer-motion": "^10.16.4",
     "next": "^14.0.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-icons": "^4.4.0",
+    "react-icons": "^4.11.0",
     "react-intersection-observer": "^8.32.1",
     "react-markdown": "^8.0.0",
     "react-waypoint": "^10.3.0"