chore: project revamp

upgraded dependencies, improved readme, new logo, added picture, added gh-pages workflow
f-aguzzi · May 11, 2024 · 442ba65 · 442ba65
1 parent 733c137
commit 442ba65
Show file tree

Hide file tree

Showing 15 changed files with 2,952 additions and 2,163 deletions.
diff --git a/.github/workflows/gh-pages.yml b/.github/workflows/gh-pages.yml
@@ -0,0 +1,51 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches:
+      - main
+    # Review gh actions docs if you want to further define triggers, paths, etc
+    # https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#on
+
+jobs:
+  build:
+    name: Build React.js
+    runs-on: ubuntu-latest 
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18
+          cache: yarn
+
+      - name: Install dependencies
+        run: npm install --frozen-lockfile
+      - name: Build website
+        run: yarn run build
+
+      - name: Upload Build Artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: build
+
+  deploy:
+    name: Deploy to GitHub Pages
+    needs: build
+
+    # Grant GITHUB_TOKEN the permissions required to make a Pages deployment
+    permissions:
+      pages: write # to deploy to Pages
+      id-token: write # to verify the deployment originates from an appropriate source
+
+    # Deploy to the github-pages environment
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+node_modules
+build
+**/.DS_Store
diff --git a/README.md b/README.md
@@ -1,5 +1,16 @@
-# linkshrub
-linktr.ee-styled landing page generator
+# LinkShrub
+
+`linktr.ee`-styled landing page generator.
+
+<p align="center">
+    <img src="./src/img/linkshrub.svg" style="width: 40%" alt="LinkShrub Logo" />
+</p>
+
+Check out the demo:
+
+[![GitHub Pages Demo](https://img.shields.io/badge/GitHub_Pages-LinkShrub_Demo-blue)](https://f-aguzzi.github.io/linkshrub/)
+
+---
 
 # Instructions
 
@@ -8,11 +19,20 @@ linktr.ee-styled landing page generator
 ### Install
 From the main folder:
 
-```yarn install```
+```sh
+yarn install
+```
 
 ### Startup
 
-```yarn start```
+This will run the development server:
+```sh
+yarn start
+```
+
+This will 
+
+### Static build
 
 ## Editing the links
 

diff --git a/README.old.md b/README.old.md
diff --git a/package.json b/package.json
@@ -3,12 +3,13 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^13.0.0",
     "@testing-library/user-event": "^13.2.1",
     "@types/jest": "^27.0.1",
     "@types/node": "^16.7.13",
-    "@types/react": "^18.0.0",
+    "@types/react": "^18.2.0",
     "@types/react-dom": "^18.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -24,7 +24,7 @@
       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`.
     -->
-    <title>React App</title>
+    <title>LinkShrub</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/public/logo192.png b/public/logo192.png
diff --git a/public/logo512.png b/public/logo512.png
diff --git a/public/manifest.json b/public/manifest.json
@@ -1,6 +1,6 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "LinkShrub",
+  "name": "LinkShrub: LinkTree-styled landing page",
   "icons": [
     {
       "src": "favicon.ico",

diff --git a/src/App.tsx b/src/App.tsx
@@ -21,9 +21,10 @@ const linksArray = () => {
 
 function App() {
   return (
-    <div className="bg-gradient-to-b from-blue-500 to-pink-500 min-h-screen w-screen">
+    <div className="bg-gradient-to-b from-teal-500 to-purple-500 min-h-screen w-screen py-6 px-20">
       <div className="flex flex-col mx-8">
         <h1 className="text-6xl font-bold drop-shadow-md text-slate-100 p-5 mx-auto"> {data.name} </h1>
+        <img src={data.img} className="object-scale-down rounded-full mx-auto" alt="Landing page." />
         <p className="text-xl font-bold drop-shadow-sm text-slate-200 p-3 mx-auto">
           {data.desc}
         </p>

diff --git a/src/data.json b/src/data.json
@@ -1,4 +1,5 @@
 {
-    "name" : "John Doe's Linkshrub",
-    "desc" : "Hey, I'm John Doe. Check out my links:"
+    "name" : "Federico Aguzzi's LinkShrub",
+    "img"  : "http://github.com/f-aguzzi.png",
+    "desc" : "Hi, I'm Federico Aguzzi. Check out my links:"
 }
diff --git a/src/img/linkshrub.svg b/src/img/linkshrub.svg
diff --git a/src/links.json b/src/links.json
@@ -1,17 +1,17 @@
 [
     {
-        "name" : "Google",
-        "desc" : "Google Search Engine",
-        "link" : "https://www.google.com"
+        "name" : "GitHub",
+        "desc" : "Check out my repositories!",
+        "link" : "https://www.github.com/f-aguzzi"
     },
     {
-        "name" : "YouTube",
-        "desc" : "The world's most popular video sharing platform",
-        "link" : "https://www.youtube.com"
+        "name" : "LinkedIn",
+        "desc" : "Check out my LinkedIn profile!",
+        "link" : "https://www.linkedin.com/in/federico-aguzzi-b500201b9/"
     },
     {
-        "name" : "DuckDuckGo",
-        "desc" : "A non-tracking search engine",
-        "link" : "https://www.duckduckgo.com"
+        "name" : "Personal page",
+        "desc" : "My personal website.",
+        "link" : "https://f-aguzzi.github.io/"
     }
 ]