I made service website and i want to use the information from the cart to send a sms confirming that the form they filled put and the products and services they selected. I would also like to receive that same information.
I only have server that is listening at port: 5000
const express = require('express');
const accountSid = process.env.TWILIO_ACCOUNT_SID;
const authToken = process.env.TWILIO_AUTH_TOKEN;
const client = require('twilio')(accountSid, authToken);
require('dotenv').config();
const app = express();
const port = 5000;
app.get('/', (req, res) => {
sendTextMessages();
res.send(`
<div style='text-align: center; padding-top:40px'>
<h1>Hello World</h1>
<p>This is a sample page</p>
</div>
`);
});
app.listen(port, () => {
console.log(`Example app listening at http://localhost:${port}`);
});
function sendTextMessages() {}
/////////Cart.jsx////////
import React, { useState } from 'react';
import CartItems from '../components/CartItems/CartItems';
import CartForm from '../components/CartForm/CartForm';
const Cart = () => {
const [formData, setFormData] = useState({});
const [cartData, setCartData] = useState([]);
const handleSubmit = () => {
// Here, you can send the formData and cartData to your server or perform any other action you need.
// You can access formData and cartData to submit the data.
console.log('Form Data:', formData);
console.log('Cart Data:', cartData);
};
return (
<div>
<CartForm setFormData={setFormData} />
<CartItems setCartData={setCartData} />
<button style={{
backgroundColor: '#ff5a5a',
color: '#fff',
border: 'none',
padding: '20px 60px', // Increase padding for a larger button
borderRadius: '5px',
cursor: 'pointer',
display: 'block', // Center horizontally
margin: '0 auto', // Center horizontally
fontSize: '18px',
}} onClick={handleSubmit}>Get Free Estimate</button>
</div>
);
}
export default Cart;
CodePudding user response:
why you use Frontend and backend in the same file?
separate the frontend and backend and communicate with them using Axios
search about how you can build REST API and how to hit the end points from the frontend using Axios
- If you want to make the frontend and the backend in the same project you can use
ejs
for server-side rendering, search about MVC in node.js using Express.js and.ejs