Skip to content

Commit a4dbb61

Browse files
Update demo (#107)
* Update demo * Update demo
1 parent f70cf8b commit a4dbb61

File tree

6 files changed

+410
-40
lines changed

6 files changed

+410
-40
lines changed

public/index.html

Lines changed: 55 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,66 @@
33
<head>
44
<meta charset="utf-8" />
55
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<link rel="icon" type="image/x-icon" href="%PUBLIC_URL%/favicon.ico" />
67
<meta name="viewport" content="width=device-width, initial-scale=1" />
78
<meta name="theme-color" content="#000000" />
9+
10+
<!-- Primary Meta Tags -->
11+
<title>Cron Expression Generator | React Cron Builder Tool - Unix & Quartz Format</title>
12+
<meta name="title" content="Cron Expression Generator | React Cron Builder Tool - Unix & Quartz Format" />
13+
<meta name="description" content="Online cron expression generator and builder. Create cron schedules easily with visual UI. Supports both Unix (5 fields) and Quartz (7 fields) formats. Perfect for scheduling tasks, jobs, and automated processes." />
14+
<meta name="keywords" content="cron generator, cron expression builder, cron schedule maker, unix cron, quartz cron, cron syntax generator, schedule builder, task scheduler, cron job generator, free cron tool, online cron builder, cron expression helper, react cron generator" />
15+
<meta name="author" content="Sojin Antony" />
16+
<meta name="robots" content="index, follow" />
17+
<meta name="language" content="English" />
18+
<meta name="revisit-after" content="7 days" />
19+
20+
<!-- Open Graph / Facebook -->
21+
<meta property="og:type" content="website" />
22+
<meta property="og:url" content="https://sojinantony01.github.io/react-cron-generator/" />
23+
<meta property="og:title" content="Cron Expression Generator | React Cron Builder Tool" />
24+
<meta property="og:description" content="Create cron expressions easily with our visual cron generator. Supports Unix and Quartz formats. Perfect for developers and system administrators." />
25+
<meta property="og:image" content="https://sojinantony01.github.io/react-cron-generator/images/Screenshot%20from%202019-06-08%2000-31-31.png" />
26+
<meta property="og:site_name" content="React Cron Generator" />
27+
28+
<!-- Twitter -->
29+
<meta property="twitter:card" content="summary_large_image" />
30+
<meta property="twitter:url" content="https://sojinantony01.github.io/react-cron-generator/" />
31+
<meta property="twitter:title" content="Cron Expression Generator | React Cron Builder Tool" />
32+
<meta property="twitter:description" content="Create cron expressions easily with our visual cron generator. Supports Unix and Quartz formats." />
33+
<meta property="twitter:image" content="https://sojinantony01.github.io/react-cron-generator/images/Screenshot%20from%202019-06-08%2000-31-31.png" />
34+
35+
<!-- Canonical URL -->
36+
<link rel="canonical" href="https://sojinantony01.github.io/react-cron-generator/" />
37+
38+
<!-- Manifest -->
839
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
9-
<title>Cron Generator live</title>
40+
41+
<!-- Structured Data / JSON-LD -->
42+
<script type="application/ld+json">
43+
{
44+
"@context": "https://schema.org",
45+
"@type": "WebApplication",
46+
"name": "React Cron Generator",
47+
"description": "Online cron expression generator and builder with support for Unix and Quartz formats",
48+
"url": "https://sojinantony01.github.io/react-cron-generator/",
49+
"applicationCategory": "DeveloperApplication",
50+
"operatingSystem": "Any",
51+
"offers": {
52+
"@type": "Offer",
53+
"price": "0",
54+
"priceCurrency": "USD"
55+
},
56+
"author": {
57+
"@type": "Person",
58+
"name": "Sojin Antony"
59+
},
60+
"screenshot": "https://sojinantony01.github.io/react-cron-generator/images/Screenshot%20from%202019-06-08%2000-31-31.png"
61+
}
62+
</script>
1063
</head>
1164
<body>
12-
<noscript>You need to enable JavaScript to run this app.</noscript>
65+
<noscript>You need to enable JavaScript to run this app. This is a free cron expression generator tool that helps you create cron schedules for task automation.</noscript>
1366
<div id="root"></div>
1467
</body>
1568
</html>

public/manifest.json

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
11
{
2-
"short_name": "React App",
3-
"name": "Create React App Sample",
4-
"icons": [
5-
{
6-
"src": "favicon.ico",
7-
"sizes": "64x64 32x32 24x24 16x16",
8-
"type": "image/x-icon"
9-
}
10-
],
11-
"start_url": ".",
12-
"display": "standalone",
13-
"theme_color": "#000000",
14-
"background_color": "#ffffff"
2+
"short_name": "Cron Generator",
3+
"name": "React Cron Expression Generator - Online Tool",
4+
"description": "Online cron expression generator and builder. Create cron schedules easily with visual UI for Unix and Quartz formats.",
5+
"icons": [
6+
{
7+
"src": "favicon.ico",
8+
"sizes": "64x64 32x32 24x24 16x16",
9+
"type": "image/x-icon"
10+
}
11+
],
12+
"start_url": ".",
13+
"display": "standalone",
14+
"theme_color": "#000000",
15+
"background_color": "#ffffff",
16+
"categories": ["productivity", "utilities", "developer tools"],
17+
"orientation": "any"
1518
}

public/robots.txt

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# robots.txt for React Cron Generator
2+
# https://sojinantony01.github.io/react-cron-generator/
3+
4+
User-agent: *
5+
Allow: /
6+
7+
# Sitemaps
8+
Sitemap: https://sojinantony01.github.io/react-cron-generator/sitemap.xml
9+
10+
# Crawl-delay (optional, helps prevent server overload)
11+
Crawl-delay: 1
12+
13+
# Allow all search engines to index
14+
User-agent: Googlebot
15+
Allow: /
16+
17+
User-agent: Bingbot
18+
Allow: /
19+
20+
User-agent: Slurp
21+
Allow: /
22+
23+
User-agent: DuckDuckBot
24+
Allow: /
25+
26+
User-agent: Baiduspider
27+
Allow: /
28+
29+
User-agent: YandexBot
30+
Allow: /

public/sitemap.xml

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
3+
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
4+
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
5+
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
6+
7+
<!-- Main page -->
8+
<url>
9+
<loc>https://sojinantony01.github.io/react-cron-generator/</loc>
10+
<lastmod>2026-01-29</lastmod>
11+
<changefreq>weekly</changefreq>
12+
<priority>1.0</priority>
13+
</url>
14+
15+
<!-- Index page (if different from main) -->
16+
<url>
17+
<loc>https://sojinantony01.github.io/react-cron-generator/index.html</loc>
18+
<lastmod>2026-01-29</lastmod>
19+
<changefreq>weekly</changefreq>
20+
<priority>1.0</priority>
21+
</url>
22+
23+
</urlset>
24+
25+
<!-- Made with Bob -->

src/App.css

Lines changed: 188 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,188 @@
1+
/* App.css - Styles for React Cron Generator Demo */
2+
3+
.app-container {
4+
max-width: 1200px;
5+
margin: 0 auto;
6+
padding: 20px;
7+
}
8+
9+
/* Header Styles - Compact */
10+
.app-header {
11+
margin-bottom: 20px;
12+
text-align: center;
13+
}
14+
15+
.app-header h1 {
16+
font-size: 2em;
17+
margin-bottom: 8px;
18+
color: #333;
19+
}
20+
21+
.app-header .subtitle {
22+
font-size: 1em;
23+
color: #666;
24+
margin-bottom: 0;
25+
}
26+
27+
/* Format Selection - Compact and Centered */
28+
.format-selection {
29+
margin: 0 auto 20px;
30+
padding: 12px 15px;
31+
background-color: #e8f4f8;
32+
border-radius: 8px;
33+
max-width: 1000px;
34+
}
35+
36+
.format-selection label {
37+
display: flex;
38+
align-items: center;
39+
justify-content: center;
40+
cursor: pointer;
41+
font-size: 1em;
42+
}
43+
44+
.format-selection input[type="checkbox"] {
45+
margin-right: 10px;
46+
width: 18px;
47+
height: 18px;
48+
cursor: pointer;
49+
}
50+
51+
.format-selection span {
52+
font-weight: 500;
53+
}
54+
55+
.format-info {
56+
margin-top: 8px;
57+
font-size: 0.85em;
58+
color: #555;
59+
text-align: center;
60+
}
61+
62+
/* Cron Generator Section - Centered and Prominent */
63+
.cron-section {
64+
margin: 0 auto 30px;
65+
display: flex;
66+
flex-direction: column;
67+
align-items: center;
68+
}
69+
70+
.cron-section h2 {
71+
font-size: 1.3em;
72+
margin-bottom: 12px;
73+
color: #333;
74+
text-align: center;
75+
width: 100%;
76+
}
77+
78+
.cron-container {
79+
border: 2px solid #0066cc;
80+
border-radius: 8px;
81+
padding: 20px;
82+
background-color: #fff;
83+
box-shadow: 0 2px 8px rgba(0, 102, 204, 0.1);
84+
width: 100%;
85+
max-width: 1000px;
86+
display: flex;
87+
justify-content: center;
88+
}
89+
90+
.cron-container > * {
91+
width: 100%;
92+
}
93+
94+
/* Info Sections */
95+
.info-section {
96+
margin: 0 auto 25px;
97+
padding: 20px;
98+
background-color: #f9f9f9;
99+
border-radius: 8px;
100+
max-width: 1000px;
101+
}
102+
103+
.info-section h2 {
104+
font-size: 1.3em;
105+
margin-bottom: 12px;
106+
color: #333;
107+
text-align: center;
108+
}
109+
110+
.info-section p {
111+
line-height: 1.6;
112+
color: #555;
113+
margin: 0;
114+
text-align: left;
115+
}
116+
117+
.info-section ul {
118+
line-height: 1.7;
119+
color: #555;
120+
padding-left: 20px;
121+
margin: 0;
122+
text-align: left;
123+
}
124+
125+
.info-section li {
126+
margin-bottom: 8px;
127+
}
128+
129+
.info-section li:last-child {
130+
margin-bottom: 0;
131+
}
132+
133+
/* Footer Styles - Centered */
134+
.app-footer {
135+
margin-top: 30px;
136+
padding: 15px 0;
137+
border-top: 1px solid #ddd;
138+
text-align: center;
139+
color: #666;
140+
font-size: 0.9em;
141+
}
142+
143+
.app-footer p {
144+
margin: 0;
145+
}
146+
147+
.app-footer a {
148+
color: #0066cc;
149+
text-decoration: none;
150+
margin: 0 8px;
151+
}
152+
153+
.app-footer a:hover {
154+
text-decoration: underline;
155+
}
156+
157+
/* Responsive Design */
158+
@media (max-width: 768px) {
159+
.app-container {
160+
padding: 15px;
161+
}
162+
163+
.app-header h1 {
164+
font-size: 1.5em;
165+
}
166+
167+
.app-header .subtitle {
168+
font-size: 0.9em;
169+
}
170+
171+
.cron-section h2 {
172+
font-size: 1.1em;
173+
}
174+
175+
.cron-container {
176+
padding: 15px;
177+
}
178+
179+
.info-section {
180+
padding: 15px;
181+
}
182+
183+
.info-section h2 {
184+
font-size: 1.1em;
185+
}
186+
}
187+
188+
/* Made with Bob */

0 commit comments

Comments
 (0)