Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add backend functionality #5

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions client.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@

function handleButtonClick() {
alert('Button clicked!'); // Display an alert when the button is clicked
}

// Add an event listener to a button element
const buttonElement = document.getElementById('myButton');
if (buttonElement) {
buttonElement.addEventListener('click', handleButtonClick);
}

// Other client-side JavaScript code goes here
// ...

console.log('Client-side JavaScript code loaded.');

21 changes: 20 additions & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,12 @@
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

<title>CodeZee - Heaven For Coders</title>

<link rel="icon" type="image/x-icon" href="/Images/Logo.png">
</head>

<body>

<!-- Navbar Start -->

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
Expand Down Expand Up @@ -416,7 +417,25 @@ <h2 class="mb-0">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous"></script>
<form action="/submit-form" method="post">
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name" name="name" required>
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" class="form-control" id="email" name="email" required>
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea class="form-control" id="message" name="message" rows="4" required></textarea>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>

<button id="myButton">Click Me</button>

<script src="/client.js"></script>
</body>

</html>
53 changes: 53 additions & 0 deletions server.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
const express = require('express');
const bodyParser = require('body-parser');
const nodemailer = require('nodemailer');

const app = express();

// Middleware for parsing JSON and URL-encoded form data
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

// Serve static files (HTML, CSS, images, etc.)
app.use(express.static('public'));

// Define a route to handle form submissions
app.post('/submit-form', (req, res) => {
// Get form data from the request
const { name, email, message } = req.body;

// Create a nodemailer transporter to send email (you'll need to configure this)
const transporter = nodemailer.createTransport({
service: 'your-email-service-provider',
auth: {
user: '[email protected]',
pass: 'your-email-password',
},
});

// Email content
const mailOptions = {
from: '[email protected]',
to: '[email protected]',
subject: 'New Contact Form Submission',
text: `Name: ${name}\nEmail: ${email}\nMessage: ${message}`,
};

// Send the email
transporter.sendMail(mailOptions, (error, info) => {
if (error) {
console.error('Error sending email:', error);
res.status(500).send('Error sending email');
} else {
console.log('Email sent:', info.response);
res.status(200).send('Email sent successfully');
}
});
});

// Start the server
const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`Server is running on port ${port}`);
});
console.log('Client-side JavaScript file loaded.');