Skip to content

Commit aebfb35

Browse files
committed
feat: update SEO metadata and replace favicon with new assets
1 parent 7694274 commit aebfb35

7 files changed

Lines changed: 68 additions & 59 deletions

File tree

README.md

Lines changed: 0 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +0,0 @@
1-
# React + TypeScript + Vite
2-
3-
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
4-
5-
Currently, two official plugins are available:
6-
7-
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) for Fast Refresh
8-
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
9-
10-
## Expanding the ESLint configuration
11-
12-
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
13-
14-
```js
15-
export default tseslint.config({
16-
extends: [
17-
// Remove ...tseslint.configs.recommended and replace with this
18-
...tseslint.configs.recommendedTypeChecked,
19-
// Alternatively, use this for stricter rules
20-
...tseslint.configs.strictTypeChecked,
21-
// Optionally, add this for stylistic rules
22-
...tseslint.configs.stylisticTypeChecked,
23-
],
24-
languageOptions: {
25-
// other options...
26-
parserOptions: {
27-
project: ['./tsconfig.node.json', './tsconfig.app.json'],
28-
tsconfigRootDir: import.meta.dirname,
29-
},
30-
},
31-
})
32-
```
33-
34-
You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
35-
36-
```js
37-
// eslint.config.js
38-
import reactX from 'eslint-plugin-react-x'
39-
import reactDom from 'eslint-plugin-react-dom'
40-
41-
export default tseslint.config({
42-
plugins: {
43-
// Add the react-x and react-dom plugins
44-
'react-x': reactX,
45-
'react-dom': reactDom,
46-
},
47-
rules: {
48-
// other rules...
49-
// Enable its recommended typescript rules
50-
...reactX.configs['recommended-typescript'].rules,
51-
...reactDom.configs.recommended.rules,
52-
},
53-
})
54-
```

index.html

Lines changed: 67 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,74 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8" />
5-
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
5+
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<title>SQLGram - PostgreSQL Schema Visualizer</title>
7+
8+
<!-- SEO Meta Tags -->
9+
<title>sqlgram - PostgreSQL Schema Visualizer | Database Design Tool</title>
10+
<meta name="description" content="Visualize your PostgreSQL database schemas with sqlgram. Interactive database diagram generator that transforms SQL CREATE TABLE statements into beautiful, professional diagrams with relationship mapping." />
11+
<meta name="keywords" content="PostgreSQL, database schema, SQL visualizer, database diagram, ERD generator, database design, SQL to diagram, PostgreSQL tools, database modeling, schema visualization" />
12+
<meta name="author" content="sqlgram" />
13+
<meta name="robots" content="index, follow" />
14+
<meta name="language" content="en" />
15+
<meta name="revisit-after" content="7 days" />
16+
17+
<!-- Open Graph / Facebook -->
18+
<meta property="og:type" content="website" />
19+
<meta property="og:url" content="https://paripsky.github.io/sqlgram/" />
20+
<meta property="og:title" content="sqlgram - PostgreSQL Schema Visualizer" />
21+
<meta property="og:description" content="Transform your SQL CREATE TABLE statements into beautiful, interactive database diagrams. Perfect for developers, database administrators, and data architects." />
22+
<meta property="og:image" content="https://paripsky.github.io/sqlgram/og-image.png" />
23+
<meta property="og:image:width" content="1200" />
24+
<meta property="og:image:height" content="630" />
25+
<meta property="og:image:alt" content="sqlgram PostgreSQL Schema Visualizer Interface" />
26+
<meta property="og:site_name" content="sqlgram" />
27+
<meta property="og:locale" content="en_US" />
28+
29+
<!-- Twitter -->
30+
<meta property="twitter:card" content="summary_large_image" />
31+
<meta property="twitter:url" content="https://paripsky.github.io/sqlgram/" />
32+
<meta property="twitter:title" content="sqlgram - PostgreSQL Schema Visualizer" />
33+
<meta property="twitter:description" content="Transform your SQL CREATE TABLE statements into beautiful, interactive database diagrams. Perfect for developers, database administrators, and data architects." />
34+
<meta property="twitter:image" content="https://paripsky.github.io/sqlgram/twitter-image.png" />
35+
<meta property="twitter:image:alt" content="sqlgram PostgreSQL Schema Visualizer Interface" />
36+
<meta property="twitter:creator" content="@sqlgram" />
37+
<meta property="twitter:site" content="@sqlgram" />
38+
39+
<!-- Additional Meta Tags -->
40+
<meta name="theme-color" content="#ffffff" />
41+
<meta name="msapplication-TileColor" content="#ffffff" />
42+
<meta name="application-name" content="sqlgram" />
43+
<meta name="apple-mobile-web-app-title" content="sqlgram" />
44+
<meta name="apple-mobile-web-app-capable" content="yes" />
45+
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
46+
<meta name="format-detection" content="telephone=no" />
47+
48+
<!-- Canonical URL -->
49+
<link rel="canonical" href="https://paripsky.github.io/sqlgram/" />
50+
51+
<!-- Structured Data for SEO -->
52+
<script type="application/ld+json">
53+
{
54+
"@context": "https://schema.org",
55+
"@type": "SoftwareApplication",
56+
"name": "sqlgram",
57+
"description": "PostgreSQL Schema Visualizer that transforms SQL CREATE TABLE statements into interactive database diagrams",
58+
"url": "https://paripsky.github.io/sqlgram",
59+
"applicationCategory": "DeveloperApplication",
60+
"operatingSystem": "Web Browser",
61+
"offers": {
62+
"@type": "Offer",
63+
"price": "0",
64+
"priceCurrency": "USD"
65+
},
66+
"creator": {
67+
"@type": "Organization",
68+
"name": "sqlgram"
69+
},
70+
"keywords": "PostgreSQL, database schema, SQL visualizer, database diagram, ERD generator"
71+
}
72+
</script>
873
</head>
974
<body>
1075
<div id="root"></div>

public/favicon.ico

5.12 KB
Binary file not shown.

public/og-image.png

1.87 MB
Loading

public/vite.svg

Lines changed: 0 additions & 1 deletion
This file was deleted.

src/App.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ function App() {
130130
<header className="border-b bg-card px-4 sm:px-6 py-3 sm:py-4">
131131
<div className="flex items-center justify-between">
132132
<div>
133-
<h1 className="text-xl sm:text-2xl font-bold">SQLGram</h1>
133+
<h1 className="text-xl sm:text-2xl font-bold">sqlgram</h1>
134134
<p className="text-xs sm:text-sm text-muted-foreground">
135135
PostgreSQL Schema Visualizer
136136
</p>

src/assets/react.svg

Lines changed: 0 additions & 1 deletion
This file was deleted.

0 commit comments

Comments
 (0)