Upgrade yarn and added download handler in resume button

ayu023ban · May 20, 2024 · 99c22b8 · 99c22b8
1 parent e03dcd7
commit 99c22b8
Show file tree

Hide file tree

Showing 5 changed files with 4,350 additions and 5,578 deletions.
diff --git a/package.json b/package.json
@@ -7,14 +7,14 @@
   "dependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@testing-library/jest-dom": "^6.4.2",
-    "@testing-library/react": "^14.2.1",
+    "@testing-library/react": "^15.0.7",
     "@testing-library/user-event": "^14.5.2",
     "dotenv": "^16.4.4",
     "levenary": "^1.1.1",
     "node-fetch": "^3.3.2",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-scripts": "4.0.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-scripts": "5.0.1",
     "scroll-behavior-polyfill": "^2.0.13"
   },
   "scripts": {

diff --git a/public/index.html b/public/index.html
@@ -55,7 +55,7 @@
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
+    <div id="app"></div>
     <!--
       This HTML file is a template.
       If you open it directly in the browser, you will see an empty page.

diff --git a/src/components/Navigation/SideDrawer/SideDrawer.js b/src/components/Navigation/SideDrawer/SideDrawer.js
@@ -7,6 +7,9 @@ import BackDrop from '../../UI/BackDrop/BackDrop';
 
 const sideDrawer = (props) => {
   let attachedClasses = [classes.SideDrawer, classes.Close];
+  const resumeHandler = () => {
+    window.open(process.env.PUBLIC_URL + "/resume.pdf", "_blank");
+  };
 
   if (props.open) {
     attachedClasses = [classes.SideDrawer, classes.Open];
@@ -18,7 +21,7 @@ const sideDrawer = (props) => {
       <div className={attachedClasses.join(' ')}>
         <nav>
           <NavigationItems clicked={props.scrolledTo} />
-          <Button>RESUME</Button>
+          <Button clicked={resumeHandler} >RESUME</Button>
         </nav>
       </div>
     </Aux>

diff --git a/src/index.js b/src/index.js
@@ -1,16 +1,22 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
 import './index.css';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
 import 'scroll-behavior-polyfill';
+import { createRoot } from 'react-dom/client';
 
-ReactDOM.render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-  document.getElementById('root')
-);
+
+const container = document.getElementById('app');
+const root = createRoot(container); // createRoot(container!) if you use TypeScript
+root.render(<App/>);
+
+
+// ReactDOM.render(
+//   <React.StrictMode>
+//     <App />
+//   </React.StrictMode>,
+//   document.getElementById('root')
+// );
 
 // If you want your app to work offline and load faster, you can change
 // unregister() to register() below. Note this comes with some pitfalls.