Email Reminder Script in Nodejs, React & tailwindCss (with code)
1. Cron Job: Automatically run the script daily
Email Reminder Script in Nodejs (with code)
Photo by Rahul Mishra on Unsplash
-
Cron Job: Automatically run the script daily
-
Frontend Dashboard: View, add, and manage tasks
First : Cron Job Setup
We’ll use **node-cron** to run the email reminder every day at 9 AM.
📄 Update reminder.js:
const fs = require('fs');
const nodemailer = require('nodemailer');
const cron = require('node-cron');
// Load tasks
function loadTasks() {
return JSON.parse(fs.readFileSync('tasks.json'));
}
// Email config
const transporter = nodemailer.createTransport({
service: 'gmail',
auth: {
user: 'your.email@gmail.com',
pass: 'your_app_password_here'
}
});
function sendReminderEmail(task) {
const mailOptions = {
from: 'your.email@gmail.com',
to: task.email,
subject: `Task Reminder: ${task.title}`,
text: `Hi! Just a reminder that your task "${task.title}" is due today.`
};
transporter.sendMail(mailOptions, (err, info) => {
if (err) console.error('Email error:', err);
else console.log(`Reminder sent to ${task.email}`);
});
}
function checkDueTasks() {
const today = new Date().toISOString().slice(0, 10);
const tasks = loadTasks();
tasks.forEach(task => {
if (task.dueDate === today) sendReminderEmail(task);
});
}
// Cron: runs every day at 9 AM
cron.schedule('0 9 * * *', () => {
console.log('⏰ Running daily task check...');
checkDueTasks();
});
// Also run manually when the file is executed
checkDueTasks();npm install node-cron nodemailerSecond : Frontend Dashboard (Express + Tailwind UI)
You’ll use Express for backend and HTML + Tailwind CSS for the frontend.
📁 Folder Structure
project/
├── public/
│ └── style.css ← Tailwind CSS (optional)
├── tasks.json
├── reminder.js ← Cron + Email
├── server.js ← Express API and frontend
└── views/
└── index.html📄 server.js
const express = require('express');
const fs = require('fs');
const path = require('path');
const app = express();
app.use(express.json());
app.use(express.static('public'));
app.set('view engine', 'ejs');
app.set('views', path.join(__dirname, 'views'));
// Load tasks
function loadTasks() {
return JSON.parse(fs.readFileSync('tasks.json'));
}
// Save tasks
function saveTasks(tasks) {
fs.writeFileSync('tasks.json', JSON.stringify(tasks, null, 2));
}
// Homepage: render tasks
app.get('/', (req, res) => {
const tasks = loadTasks();
res.render('index', { tasks });
});
// API: Add new task
app.post('/add-task', (req, res) => {
const tasks = loadTasks();
const newTask = req.body;
tasks.push(newTask);
saveTasks(tasks);
res.json({ message: 'Task added' });
});
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => console.log(`🌐 Server running at http://localhost:${PORT}`));📄 views/index.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Task Dashboard</title>
<script>
async function addTask() {
const title = document.getElementById('title').value;
const dueDate = document.getElementById('dueDate').value;
const email = document.getElementById('email').value;await fetch('/add-task', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ title, dueDate, email })
});
location.reload();
}
</script>
</head>
<body style="font-family: sans-serif;">
<h1>📋 Task Dashboard</h1>
<ul>
<% tasks.forEach(task => { %>
<li>
<strong><%= task.title %></strong> - Due: <%= task.dueDate %> - 📧 <%= task.email %>
</li>
<% }) %>
</ul>
<h2>Add New Task</h2>
<input type="text" id="title" placeholder="Title" />
<input type="date" id="dueDate" />
<input type="email" id="email" placeholder="Email" />
<button onclick="addTask()">Add Task</button>
</body>
</html>
🚀 Run Everything:
- Start backend:
node server.js
- Open
http://localhost:3000to view dashboard. reminder.jswill auto-run daily or can be run manually:
node reminder.js
메타데이터
- post_id
- d004b1e486eb
- slug
- email-reminder-script-in-nodejs-react-tailwindcss-with-code-d004b1e486eb
- url
- https://medium.com/@patelharsh7458/email-reminder-script-in-nodejs-react-tailwindcss-with-code-d004b1e486eb
- canonical_url
- https://medium.com/@patelharsh7458/email-reminder-script-in-nodejs-react-tailwindcss-with-code-d004b1e486eb
- author_url
- https://medium.com/@patelharsh7458
- status
- ok
- fetched_at
- 2026-08-11 11:41:10
