Foro de elhacker.net

Funte: Como crear un formulario de comentarios para tu web (http://bit.ly/2srEJXN)

Pues nada lo primero es tener el Formulario en HTML.
Posterior mente el javascript para validar el formulario antes de enviarlo
El script en el Backend para volver a validar los datos.
El metodo de almacenamiento del comentario (Base de datos)
Un sistema para evitar que saturen de comentarios basura
Y al final pero mas importante EVITAR SER HACKEADO (xss, sql, file inclusion etc etc etc etc etc)

El codigo en HTML para el formulario utilizando Boostrap:

<h4>Deja un comentario</h4>
<p></small>Tu dirección de correo electrónico no será publicada. <b>Los campos obligatorios están marcados con *</b></small></p>
<div class="form-group">
	<label for="exampleInputUsername">Nombre *</label>
	<input type="text" class="form-control" id="exampleInputUsername" aria-describedby="usernameHelp">
	<small id="usernameHelp" class="form-text text-muted">Nombre para mostrar, este campo si va a ser mostrado</small>
</div>
<div class="form-group">
	<label for="exampleInputEmail">Correo Electronico *</label>
	<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
	<small id="emailHelp" class="form-text text-muted">Tu direccion de correo electronico no sera publicada</small>
</div>
<div class="form-group">
	<label for="exampleInputWEB">WEB *</label>
	<input type="text" class="form-control" id="exampleInputWEB" aria-describedby="webHelp">
	<small id="webHelp" class="form-text text-muted">Direccion WEB Segura valida ejemplo: https://www.example.com/</small>
</div>
<div class="form-group">
	<label for="exampleTextAreaComentario">Comentario *</label>
	<textarea class="form-control" id="exampleTextAreaComentario" rows="5" aria-describedby="comentarioHelp"></textarea>
	<small id="comentarioHelp" class="form-text text-muted">Todos los comentarios seran moderados antes de ser publicados</small>
</div>
<div class="form-group form-check">
	<input type="checkbox" class="form-check-input" id="exampleCheckboxSubscribe">
	<label class="form-check-label" for="exampleCheckboxSubscribe">Recibir notificaciones de Respuestas a tus comentarios</label>
</div>
<button type="button" class="btn btn-primary">Publicar Comentario</button>
<button type="button" class="btn btn-secondary">Vista Previa</button>
<div id="comentario_vista_previa">
</div>
 
 

Resultado:

(https://albertobsd.dev/uploads/1576208115_fomulario_comentario.png)