Skip to content

Commit

Permalink
seo optimize | static dir add
Browse files Browse the repository at this point in the history
  • Loading branch information
mattmajestic committed Apr 12, 2024
1 parent eb56872 commit a253679
Show file tree
Hide file tree
Showing 6 changed files with 99 additions and 176 deletions.
55 changes: 34 additions & 21 deletions main.go
Original file line number Diff line number Diff line change
@@ -1,32 +1,45 @@
package main

import (
"net/http"
"net/http"

"github.com/gin-gonic/gin"
"github.com/gin-gonic/gin"
)

func fetchYouTubeMetricsFromAPI(c *gin.Context) {
resp, err := http.Get("https://mattmajestic.dev/youtube-metrics")
if err != nil {
c.JSON(http.StatusInternalServerError, gin.H{"error": "Failed to fetch YouTube metrics"})
return
}
defer resp.Body.Close()

c.DataFromReader(http.StatusOK, resp.ContentLength, resp.Header.Get("Content-Type"), resp.Body, nil)
resp, err := http.Get("https://mattmajestic.dev/youtube-metrics")
if err != nil {
c.JSON(http.StatusInternalServerError, gin.H{"error": "Failed to fetch YouTube metrics"})
return
}
defer resp.Body.Close()
c.DataFromReader(http.StatusOK, resp.ContentLength, resp.Header.Get("Content-Type"), resp.Body, nil)
}

func main() {
router := gin.Default()

router.LoadHTMLGlob("templates/*")

router.GET("/", func(c *gin.Context) {
c.HTML(http.StatusOK, "index.tmpl", nil)
})

router.GET("/youtube-metrics", fetchYouTubeMetricsFromAPI)

router.Run(":8080")
// Initialize Gin router
router := gin.Default()

// Serve static files
router.GET("/styles.css", func(c *gin.Context) {
c.File("./static/styles.css")
})
router.GET("/script.js", func(c *gin.Context) {
c.File("./static/script.js")
})

// Load HTML templates
router.LoadHTMLGlob("templates/*")

// Define routes
router.GET("/", func(c *gin.Context) {
// Render the index template
c.HTML(http.StatusOK, "index.tmpl", nil)
})

// Route to fetch YouTube metrics from API
router.GET("/youtube-metrics", fetchYouTubeMetricsFromAPI)

// Run the server on port 8080
router.Run(":8080")
}
16 changes: 16 additions & 0 deletions static/script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
const body = document.body;

// Function to toggle between light and dark themes
function toggleTheme() {
if (body.classList.contains("dark")) {
// Switch to light theme
body.classList.remove("dark");
} else {
// Switch to dark theme
body.classList.add("dark");
}
}

// Add click event listener to the theme toggle button
const themeToggle = document.getElementById("theme-toggle");
themeToggle.addEventListener("click", toggleTheme);
43 changes: 43 additions & 0 deletions static/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
.custom-button {
background-color: #1C3D63;
color: #fff;
border: none;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
transition: background-color 0.3s ease;
margin-bottom: 10px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}

.custom-button:hover {
background-color: #0056b3;
}

.theme-toggle-icon {
font-size: 24px;
}

/* Dark Theme */
body.dark {
background-color: #fff;
color: #1C3D63;
}

footer {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #333;
color: #fff;
text-align: center;
padding: 8px 0;
}

.custom-button i {
margin-right: 5px; /* Adjust the margin as needed for spacing */
}
66 changes: 6 additions & 60 deletions templates/index.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -4,50 +4,13 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Majestic Coding</title>
<meta name="description" content="Majestic Coding Socials.">
<meta name="keywords" content="Full-Stack, Coding, Education, Software">
<meta name="author" content="Majestic Coding">
<link rel="icon" href="https://avatars.githubusercontent.com/u/33904170?v=4">
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.7/dist/tailwind.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<style>
.custom-button {
background-color: #1C3D63;
color: #fff;
border: none;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
transition: background-color 0.3s ease;
margin-bottom: 10px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.custom-button:hover {
background-color: #0056b3;
}
.theme-toggle-icon {
font-size: 24px;
}

/* Dark Theme */
body.dark {
background-color: #fff;
color: #1C3D63;
}
footer {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background-color: #333;
color: #fff;
text-align: center;
padding: 8px 0;
}
.custom-button i {
margin-right: 5px; /* Adjust the margin as needed for spacing */
}
</style>
<link rel="stylesheet" href="styles.css">
</head>
<body class="bg-gray-900 text-white">
<div class="flex flex-col items-center justify-center min-h-screen space-y-4">
Expand All @@ -64,32 +27,15 @@
</a>
<a href="https://leetcode.com/mattmajestic/" target="_blank" rel="noopener noreferrer" class="custom-button">
<i class="fas fa-code"></i> LeetCode
</a>
</a>
</div>
<div>
<button id="theme-toggle" class="custom-button">
<i class="fas fa-sun theme-toggle-icon"></i>
</button>
</div>
</div>
<script>
const body = document.body;

// Function to toggle between light and dark themes
function toggleTheme() {
if (body.classList.contains("dark")) {
// Switch to light theme
body.classList.remove("dark");
} else {
// Switch to dark theme
body.classList.add("dark");
}
}

// Add click event listener to the theme toggle button
const themeToggle = document.getElementById("theme-toggle");
themeToggle.addEventListener("click", toggleTheme);
</script>
<script src="script.js"></script>
</body>
<footer class="text-center text-gray-500 text-sm mt-8">
Made with GoLang ❤️
Expand Down
30 changes: 0 additions & 30 deletions templates/script.js

This file was deleted.

65 changes: 0 additions & 65 deletions templates/styles.css

This file was deleted.

0 comments on commit a253679

Please # to comment.