Merge pull request #17 from josueJURE/updated-News-Alert-Link

josueJURE · web-flow · commit 89a1839cd615 · 2026-02-25T14:20:05.000Z
(chore): make app Git Hub Pages ready
diff --git a/.github/workflows/deploy-pages.yml b/.github/workflows/deploy-pages.yml
@@ -0,0 +1,52 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches:
+      - main
+      - master
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: true
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build
+        run: npm run build
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: ./dist
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/dist/assets/index-BBGvUE3h.js b/dist/assets/index-BBGvUE3h.js
diff --git a/dist/assets/index-bjDilOya.js b/dist/assets/index-bjDilOya.js
diff --git a/dist/index.html b/dist/index.html
@@ -2,33 +2,22 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="stylesheet" href="index.css" />
-    <link rel="icon" href="favicon.ico" />
-    <link href="https://fonts.googleapis.com/css2?family=Caveat&amp;family=Onest:wght@300&amp;family=Open+Sans:ital,wght@1,300&amp;family=Quicksand:wght@300;400;500;600;700&amp;family=Roboto:wght@300&amp;family=Rowdies&amp;display=swap" rel="stylesheet">
+    <link
+      href="https://fonts.googleapis.com/css2?family=Caveat&amp;family=Onest:wght@300&amp;family=Open+Sans:ital,wght@1,300&amp;family=Quicksand:wght@300;400;500;600;700&amp;family=Roboto:wght@300&amp;family=Rowdies&amp;display=swap"
+      rel="stylesheet"
+    />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
       content="Web site created using create-react-app"
     />
-    <link rel="apple-touch-icon" href="/logo192.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <div id="root"></div>
+    <link rel="manifest" href="./manifest.json" />
     <title>React App</title>
-    <script type="module" crossorigin src="/assets/index-bjDilOya.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-zhooeMjb.css">
+    <script type="module" crossorigin src="./assets/index-BBGvUE3h.js"></script>
+    <link rel="stylesheet" crossorigin href="./assets/index-zhooeMjb.css">
   </head>
+  <body>
+    <div id="root"></div>
+  </body>
 </html>
diff --git a/index.html b/index.html
@@ -2,32 +2,21 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="stylesheet" href="index.css" />
-    <link rel="icon" href="favicon.ico" />
-    <link href="https://fonts.googleapis.com/css2?family=Caveat&amp;family=Onest:wght@300&amp;family=Open+Sans:ital,wght@1,300&amp;family=Quicksand:wght@300;400;500;600;700&amp;family=Roboto:wght@300&amp;family=Rowdies&amp;display=swap" rel="stylesheet">
+    <link
+      href="https://fonts.googleapis.com/css2?family=Caveat&amp;family=Onest:wght@300&amp;family=Open+Sans:ital,wght@1,300&amp;family=Quicksand:wght@300;400;500;600;700&amp;family=Roboto:wght@300&amp;family=Rowdies&amp;display=swap"
+      rel="stylesheet"
+    />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
       content="Web site created using create-react-app"
     />
-    <link rel="apple-touch-icon" href="/logo192.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <div id="root"></div>
-    <script type="module" src="/src/index.jsx"></script>
+    <link rel="manifest" href="./manifest.json" />
     <title>React App</title>
   </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
 </html>
diff --git a/package.json b/package.json
@@ -22,13 +22,9 @@
     "web-vitals": "^2.1.4"
   },
   "scripts": {
-    "frontend": "vite",
+    "dev": "vite",
     "build": "vite build",
     "preview": "vite preview",
-    "backend": "ts-node server.ts",
-    "backend:prod": "node build/server.js",
-    "build:backend": "tsc",
-    "dev": "concurrently \"npm run backend\" \"npm run frontend\"",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
@@ -50,6 +46,7 @@
       "last 1 safari version"
     ]
   },
+  
   "devDependencies": {
     "@playwright/test": "^1.54.2",
     "@types/express": "^5.0.1",
diff --git a/server.js b/server.js
@@ -210,4 +210,22 @@ app.use(express.static(path.join(__dirname, "public")));
 const port = process.env.PORT || 5173;
 app.listen(port, () => {
   console.log(`Server running on port ${port}`);
+
+
+ function countFours() {
+  let count = 0;
+
+  for (let i = 0; i < str.length; i++) {
+    if (str[i] === "4") {
+      count++
+    }
+  }
+  return count
+ }
+
 });
+
+
+let s = "283479131515574857242454150695950829533116861727855889075098381754637464939319255060400927701671139009848824012858361603563707660104710181942955596198946767837449448255379774726847104047534646208046684259069491293313677028989152104752162056966024058038150193511253382430035587640247496473263914199272604269922796"
+
+console.log("how many 4", countFours(s))
diff --git a/server.ts b/server.ts
@@ -53,11 +53,7 @@ const prisma = new PrismaClient();
 import { Request, Response } from "express";
 
 app.post("/", (req: Request, res: Response) => {
-  console
-    .log
-    // `${req.method} ${req.secure ? "https" : "http"}://${req.get("host")}${req.originalUrl}`
-    ();
-
+ 
   try {
     const { name, email, subject, message } = req.body;
 
diff --git a/speech.mp3 b/speech.mp3
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,8 +1,8 @@
 import React, { useState } from "react";
 import SkillsCard from "./components/SkillsCard";
 import ProjectsSection from "./components/ProjectsSection";
-import ContactLeft from "./components/ContactLeft";
-import ContactRight from "./components/ContactRight";
+// import ContactLeft from "./components/ContactLeft";
+// import ContactRight from "./components/ContactRight";
 import Footer from "./components/Footer";
 import Icon from "./components/Icon";
 // import UseTextToSpeech from "./components/UseTextToSpeech";
@@ -118,7 +118,7 @@ function App(props) {
 
         <ProjectsSection />
         {/* // End of Projects // Contact */}
-        <section className="contact" id="contact">
+        {/* <section className="contact" id="contact">
           <h1 className="section-bg-heading">Contact Me</h1>
           <h1 className="section-heading">Contact</h1>
           <h3 className="sub-heading">
@@ -129,7 +129,7 @@ function App(props) {
             <ContactLeft />
             <ContactRight />
           </div>
-        </section>
+        </section> */}
         <Footer />
       </div>
     </div>
diff --git a/src/components/ContactRight.tsx b/src/components/ContactRight.tsx
@@ -2,10 +2,34 @@ import React from "react";
 import InputGroups from "./InputGroups";
 
 function ContactRight() {
+  function handleSubmit(event: React.FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+
+    const formData = new FormData(event.currentTarget);
+    const name = (formData.get("name") as string)?.trim() ?? "";
+    const email = (formData.get("email") as string)?.trim() ?? "";
+    const subject = (formData.get("subject") as string)?.trim() ?? "";
+    const message = (formData.get("message") as string)?.trim() ?? "";
+
+    const body = [
+      message,
+      "",
+      `Regards,`,
+      name,
+      `Reply to: ${email}`,
+    ].join("\n");
+
+    const mailtoUrl = `mailto:josue.jure@gmail.com?subject=${encodeURIComponent(
+      subject
+    )}&body=${encodeURIComponent(body)}`;
+
+    window.location.href = mailtoUrl;
+  }
+
   return (
     <>
       <div className="contact-right">
-        <form action="http://localhost:4001/" method="POST">
+        <form onSubmit={handleSubmit}>
           <InputGroups />
 
           <div className="input-group">
diff --git a/src/components/TextToSpeechControls .tsx b/src/components/TextToSpeechControls .tsx
@@ -1,25 +1,14 @@
-// import React from "react";
-import React, { useState } from "react";
-import { FaPlay } from "react-icons/fa";
-import { FaCirclePause } from "react-icons/fa6";
-import { FaRegStopCircle } from "react-icons/fa";
-import { IoSpeedometer } from "react-icons/io5";
-// import '../APP.css';
+import React from "react";
 
 function TextToSpeechControls() {
-  const [count, setCount] = useState<number>(0.25);
-
-  function handleCount(event: React.ChangeEvent<HTMLInputElement>) {
-    const value = parseFloat(event.target.value);
-    setCount(value);
-  }
+  const audioSrc = `${import.meta.env.BASE_URL}speech.mp3`;
 
   return (
     <div className="recording">
       <audio 
         style={{ width: '25rem', height: '9rem' }} 
         controls 
-        src="/speech.mp3"  // Note the leading slash
+        src={audioSrc}
       />
       {/* Rest of your component */}
     </div>
diff --git a/vite.config.ts b/vite.config.ts
@@ -13,10 +13,11 @@ import { defineConfig
 
 // https://vitejs.dev/config/
 export default defineConfig({
+  base: "./",
   plugins: [react()],
   server: {
     hmr: {
       overlay: false,
     },
   },
-});
+});
