Merge pull request #24 from TheAsel/seo_improvements

Improve the website's SEO

index.html

@@ -5,6 +5,45 @@
 
     <meta charset="utf-8" />
     <meta name="description" content="<%= productDescription %>" />
+
+    <!-- Keywords -->
+    <meta
+      name="keywords"
+      content="bybe, pathfinder, 2e, second edition, pf 2e, pf2e, beyond your bestiary explorer, encounter builder, random, combat, generator, dm tools, gm tools, shop, npc"
+    />
+
+    <!-- Facebook meta tags -->
+    <meta property="og:url" content="https://bybe.fly.dev/" />
+    <meta property="og:type" content="website" />
+    <meta property="og:title" content="BYBE - Pathfinder 2e GM Tools" />
+    <meta
+      property="og:description"
+      content="Beyond Your Bestiary Explorer (BYBE) is a one-stop shop for the most useful tools for Pathfinder Second Edition GMs"
+    />
+    <meta
+      property="og:image"
+      content="https://raw.githubusercontent.com/TheAsel/BYBE-frontend/HEAD/.github/logo.png"
+    />
+
+    <!-- Twitter meta tags -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta property="twitter:domain" content="bybe.fly.dev" />
+    <meta property="twitter:url" content="https://bybe.fly.dev/" />
+    <meta name="twitter:title" content="BYBE - Pathfinder 2e GM Tools" />
+    <meta
+      name="twitter:description"
+      content="Beyond Your Bestiary Explorer (BYBE) is a one-stop shop for the most useful tools for Pathfinder Second Edition GMs"
+    />
+    <meta
+      name="twitter:image"
+      content="https://raw.githubusercontent.com/TheAsel/BYBE-frontend/HEAD/.github/logo.png"
+    />
+
+    <!-- Other meta tags -->
+    <meta name="robots" content="index, follow" />
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <meta name="language" content="English" />
+    <meta name="author" content="TheAsel" />
     <meta name="format-detection" content="telephone=no" />
     <meta name="msapplication-tap-highlight" content="no" />
     <meta
@@ -13,6 +52,7 @@
     />
     <meta name="google-site-verification" content="qtv93-j8tUOTtsuxOS988l9RF9L4-KGMgRYmOrUpQ5k" />
 
+    <!-- Icons -->
     <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
     <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
     <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />

nginx.conf

@@ -26,7 +26,7 @@ http {
             add_header X-Content-Type-Options "nosniff";
         }
 
-        location ~* .(?:css|js|webmanifest)$ {
+        location ~* .(?:css|js|webmanifest|xml)$ {
             charset utf-8;
             charset_types *;
             add_header Cache-Control "max-age=31536000, public, immutable";

package.json

@@ -1,7 +1,7 @@
 {
   "name": "bybe-frontend",
-  "version": "1.0.0",
-  "description": "Beyond Your Bestiary Explorer (BYBE) - Pathfinder 2e Tools Frontend",
+  "version": "1.2.1",
+  "description": "Beyond Your Bestiary Explorer (BYBE) is a one-stop shop for the most useful tools for Pathfinder Second Edition GMs",
   "productName": "BYBE - Pathfinder 2e GM Tools",
   "author": "TheAsel",
   "private": true,
@@ -15,6 +15,7 @@
   },
   "dependencies": {
     "@quasar/extras": "^1.16.9",
+    "@unhead/vue": "^1.8.10",
     "lodash": "^4.17.21",
     "pinia": "^2.1.7",
     "quasar": "^2.14.2",
@@ -23,17 +24,17 @@
     "vue3-tour": "^0.3.4"
   },
   "devDependencies": {
-    "@quasar/app-vite": "^1.7.2",
+    "@quasar/app-vite": "^1.7.3",
     "@quasar/cli": "^2.3.0",
     "@types/lodash": "^4.14.202",
-    "@types/node": "^20.11.4",
+    "@types/node": "^20.11.5",
     "@typescript-eslint/eslint-plugin": "^6.19.0",
     "@typescript-eslint/parser": "^6.19.0",
-    "autoprefixer": "^10.4.16",
+    "autoprefixer": "^10.4.17",
     "eslint": "^8.56.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-vue": "^9.20.1",
-    "prettier": "^3.2.2",
+    "prettier": "^3.2.4",
     "tailwindcss": "^3.4.1",
     "typescript": "^5.3.3"
   },

public/sitemap.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+	<url>
+		<loc>https://bybe.fly.dev/</loc>
+		<lastmod>2024-01-22</lastmod>
+		<priority>0.8</priority>
+	</url>
+	<url>
+		<loc>https://bybe.fly.dev/encounter</loc>
+		<lastmod>2024-01-22</lastmod>
+		<priority>1.0</priority>
+	</url>
+	<url>
+		<loc>https://bybe.fly.dev/npc</loc>
+		<lastmod>2024-01-22</lastmod>
+		<priority>1.0</priority>
+	</url>
+	<url>
+		<loc>https://bybe.fly.dev/shop</loc>
+		<lastmod>2024-01-22</lastmod>
+		<priority>1.0</priority>
+	</url>
+</urlset>

src/boot/globals.ts

@@ -1,10 +1,13 @@
 import { boot } from 'quasar/wrappers';
 import Vue3Tour from 'vue3-tour';
+import { createHead } from '@unhead/vue';
 
 const backendUrl = 'https://backbybe.fly.dev';
 
 export default boot(({ app }) => {
   app.use(Vue3Tour);
+  app.use(createHead);
+
   app.config.globalProperties.$BACKEND_URL = backendUrl;
 });
 

src/pages/EncounterPage.vue

@@ -1,12 +1,17 @@
 <script setup lang="ts">
 import { shallowRef } from 'vue';
+import { useHead } from '@unhead/vue';
 import { requestCreatures, requestFilters } from 'src/utils/api-calls';
 import { partyStore, filtersStore, creaturesStore, encounterStore } from 'stores/store';
 import { party } from 'src/types/party';
 import { creature_encounter } from 'src/types/creature';
 import { encounterList } from 'src/types/encounter';
 import CreatureList from 'src/components/Encounter/CreatureList.vue';
 
+useHead({
+  title: 'Encounter Builder - BYBE'
+});
+
 const party = partyStore();
 const filters = filtersStore();
 const creatures = creaturesStore();

src/pages/ErrorNotFound.vue

@@ -1,3 +1,11 @@
+<script lang="ts">
+import { useHead } from '@unhead/vue';
+
+useHead({
+  title: '404 Not Found - BYBE'
+});
+</script>
+
 <template>
   <div class="fullscreen bg-blue-8 text-white text-center q-pa-md flex flex-center">
     <div>

src/pages/IndexPage.vue

@@ -1,11 +1,16 @@
 <script setup>
+import { useHead } from '@unhead/vue';
 import {
   biCalculator,
   biShop,
   biPersonVcard,
   biArrowRightShort
 } from '@quasar/extras/bootstrap-icons';
 
+useHead({
+  title: 'BYBE - Pathfinder 2e GM Tools'
+});
+
 const cards = [
   {
     name: 'Encounter Builder',

src/pages/NpcPage.vue

@@ -1,3 +1,11 @@
+<script lang="ts">
+import { useHead } from '@unhead/vue';
+
+useHead({
+  title: 'NPC Generator - BYBE'
+});
+</script>
+
 <template>
   <q-page class="tw-flex row items-center justify-evenly">
     <div class="tw-text-center tw-py-10 tw-px-4 sm:tw-px-6 lg:tw-px-8">

src/pages/ShopPage.vue

@@ -1,3 +1,11 @@
+<script lang="ts">
+import { useHead } from '@unhead/vue';
+
+useHead({
+  title: 'Shop Generator - BYBE'
+});
+</script>
+
 <template>
   <q-page class="tw-flex row items-center justify-evenly">
     <div class="tw-text-center tw-py-10 tw-px-4 sm:tw-px-6 lg:tw-px-8">