HTML\n\n<!DOCTYPE html>\n<html lang=\"pt-br\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Inserir Cliente<\/title>\n <link rel=\"stylesheet\" href=\"style.css\">\n<\/head>\n<body>\n <h1>Inserir Cliente<\/h1>\n <form action=\"\/inserirCliente\" method=\"post\">\n <label for=\"nome\">Nome:<\/label><br>\n <input type=\"text\" id=\"nome\" name=\"nome\" required><br>\n <label for=\"email\">Email:<\/label><br>\n <input type=\"email\" id=\"email\" name=\"email\" required><br>\n <label for=\"telefone\">Telefone:<\/label><br>\n <input type=\"text\" id=\"telefone\" name=\"telefone\"><br>\n <label for=\"endereco\">Endere\u00e7o:<\/label><br>\n <input type=\"text\" id=\"endereco\" name=\"endereco\"><br><br>\n <input type=\"submit\" value=\"Inserir Cliente\">\n <\/form>\n<\/body>\n<\/html>\n\nCSS\n\n{\nmargin: 0;\npadding: 0;\nbox-sizing: border-box;\n}\n\nbody {\nfont-family: Arial, sans-serif;\nbackground-color: #f5f5f5;\ncolor: #333;\npadding: 20px;\n}\n\nh1 {\ntext-align: center;\nmargin-bottom: 20px;\ncolor: #2c3e50;\n}\n\nform {\nbackground-color: #ffffff;\nborder-radius: 5px;\nbox-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\npadding: 20px;\nmax-width: 400px;\nmargin: 0 auto;\n}\n\nlabel {\ndisplay: block;\nmargin-bottom: 5px;\nfont-weight: bold;\n}\n\ninput[type=\"text\"],\ninput[type=\"email\"] {\nwidth: 100%;\npadding: 10px;\nmargin-bottom: 15px;\nborder: 1px solid #ccc;\nborder-radius: 4px;\nfont-size: 16px;\n}\n\ninput[type=\"submit\"] {\nbackground-color: #3498db;\ncolor: white;\nborder: none;\npadding: 10px 15px;\nborder-radius: 4px;\ncursor: pointer;\nfont-size: 16px;\ntransition: background-color 0.3s;\n}\n\ninput[type=\"submit\"]:hover {\nbackground-color: #2980b9;\n}\n\nAPP.JS\n\nconst express = require('express');\nconst mysql = require('mysql2');\nconst bodyParser = require('body-parser');\nconst path = require('path');\n\nconst app = express();\nconst port = 3000;\n\n\/\/CONFIGURAR CONEXAO COM O BANCO\nconst connection = mysql.createConnection( {\nhost: '127.0.0.1',\nuser: 'root',\npassword: '123456',\ndatabase: 'aula'\n\/\/port: '3306'\n\n});\n\n\/\/CONECTAR AO BANCO DE DADOS\nconnection.connect(err =>{\nif(err){\nconsole.error('Erro ao conectar ao banco!');\nreturn;\n}\nconsole.log('Conectado ao banco!');\n});\n\n\/\/CONFIGURAR O BODY-PARSER\napp.use( bodyParser.urlencoded( { extended: true }));\n\n\/\/CONFIGURAR O ARQUIVO ESTATICO\napp.use( express.static( path.join(__dirname)));\n\n\/\/ SERVIR O FORMULARIO\napp.get('\/', (req, res) =>{\nres.sendFile(path.join(__dirname, 'index.html'));\n});\n\n\/\/PROCESSAR OS DADOS DO FORMULARIO\n\napp.post('\/inserirCliente', (req, res)=>{\n\n const { nome, email, telefone, endereco } = req.body;\n const sql = 'CALL inserirCliente(?, ?, ?, ?)'; \n connection.query(sql, [nome, email, telefone, endereco], (err, results)=>{\n\n if(err){\n console.error('Erro ao inserir cliente:', err);\n res.send('Erro ao inserir cliente.');\n return;\n }\n res.send('Cliente inserido com sucesso!');\n\n });\n\n});\n\n\/\/INICIAR O SERVIDOR\napp.listen(port,()=>{\nconsole.log(Servidor rodando em http:\/\/localhost:${port});\n});<\/code><\/pre>\n\n\n\n![\"\"](\"https:\/\/desvendandoocodigo.com.br\/wp-content\/uploads\/2024\/01\/hotmart.png\")
<\/figure>\n\n\n\n<\/p>\n\n\n\n