Напиши код html css js для сайта на котором люди могут делиться своими секретами анонимно и получать анонимные отклики от других пользователей

HTML код:

<!DOCTYPE html>
<html>
<head>
	<title>Анонимные секреты</title>
	<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
	<h1>Анонимные секреты</h1>
	<form>
		<label for="secret">Мой секрет:</label>
		<textarea id="secret" name="secret"></textarea>
		<button type="submit">Отправить</button>
	</form>
	<div id="secrets-container"></div>
	<script src="script.js"></script>
</body>
</html>

CSS код:

body {
	font-family: Arial, sans-serif;
	margin: 0;
	padding: 0;
}

h1 {
	text-align: center;
	padding: 20px;
	background-color: #F5F5F5;
}

form {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 20px;
}

label {
	font-weight: bold;
	margin-bottom: 10px;
}

textarea {
	width: 80%;
	height: 100px;
	margin-bottom: 20px;
	padding: 10px;
	border: none;
	border-radius: 5px;
	box-shadow: 0 0 5px #D3D3D3;
	resize: none;
}

button {
	background-color: #4CAF50;
	color: white;
	padding: 10px 20px;
	border: none;
	border-radius: 5px;
	cursor: pointer;
}

button:hover {
	background-color: #3E8E41;
}

#secrets-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 20px;
}

.secret {
	background-color: #F5F5F5;
	padding: 20px;
	margin-bottom: 20px;
	border-radius: 5px;
	box-shadow: 0 0 5px #D3D3D3;
}

.secret p {
	margin: 0;
}

.secret .date {
	font-size: 12px;
	color: #999;
	margin-top: 10px;
}

JS код:

const secretsContainer = document.getElementById("secrets-container");

function renderSecret(secret) {
  const secretElement = document.createElement("div");
  secretElement.classList.add("secret");
  const secretText = document.createElement("p");
  secretText.innerText = secret.text;
  secretElement.appendChild(secretText);
  const dateElement = document.createElement("span");
  dateElement.classList.add("date");
  dateElement.innerText = new Date(secret.date).toLocaleString();
  secretElement.appendChild(dateElement);
  return secretElement;
}

function renderSecrets(secrets) {
  secretsContainer.innerHTML = "";
  secrets.forEach(secret => {
    secretsContainer.appendChild(renderSecret(secret));
  });
}

function getSecrets() {
  fetch("/secrets")
    .then(response => response.json())
    .then(secrets => renderSecrets(secrets));
}

getSecrets();

document.querySelector("form").addEventListener("submit", event => {
  event.preventDefault();
  const secret = document.getElementById("secret").value;
  fetch("/secrets", {
    method: "POST",
    headers: {
      "Content-Type": "application/json"
    },
    body: JSON.stringify({ text: secret })
  })
    .then(response => response.json())
    .then(() => {
      document.getElementById("secret").value = "";
      getSecrets();
    });
});

Примечание: для работы скрипта необходимо создать серверную часть, которая будет обрабатывать запросы на получение и добавление секретов.

Напиши код html css js для сайта на котором люди могут делиться своими секретами анонимно и получать анонимные отклики от других пользователей