https://github.com/gerardfp/webforum

lxc launch ubuntu:20.04 myweb

lxc exec myweb bash

Instal·la els paquets necessaris

apt update
apt install apache2 php mysql-server php-mysql

mysql -e "
DROP DATABASE IF EXISTS webforum_database;
DROP USER IF EXISTS 'webforum_user'@'localhost';

CREATE DATABASE webforum_database;
CREATE USER 'webforum_user'@'localhost' IDENTIFIED BY 'webforum_password'; 
GRANT ALL PRIVILEGES ON webforum_database.* TO 'webforum_user'@'localhost'; 
FLUSH PRIVILEGES;
CREATE TABLE webforum_database.posts(id INT AUTO_INCREMENT, post TEXT, replyto INT, PRIMARY KEY (id));
"

mysql -e "
INSERT INTO webforum_database.posts VALUES (1, '1 First Post', NULL);
INSERT INTO webforum_database.posts VALUES (2, '2 Second Post', NULL);
INSERT INTO webforum_database.posts VALUES (3, '2 1 First Reply to Second Post', 2);
INSERT INTO webforum_database.posts VALUES (4, '2 1 1 First Reply to First Reply to Second Post', 3);
INSERT INTO webforum_database.posts VALUES (5, '2 1 2 Second Reply to First Reply to Second Post', 4);
INSERT INTO webforum_database.posts VALUES (6, '2 2 Second Reply to Second Post', 2);
INSERT INTO webforum_database.posts VALUES (7, '1 1 First Reply to First Post', 1);
INSERT INTO webforum_database.posts VALUES (8, '1 2 Second Reply to First Post', 1);
INSERT INTO webforum_database.posts VALUES (9, '1 3 Third Reply to First Post', 1);
INSERT INTO webforum_database.posts VALUES (10, '1 2 1 First Reply to Second Reply to First Post', 8);
INSERT INTO webforum_database.posts VALUES (11, '1 3 1 First Reply to Third Reply to First Post', 9);
INSERT INTO webforum_database.posts VALUES (12, '1 3 1 1 First Reply to First Reply to Third Reply to First Post', 11);
INSERT INTO webforum_database.posts VALUES (13, '1 3 1 2 Second Reply to First Reply to Third Reply to First Post', 11);
"
mysql -e "SELECT * FROM webforum_database.posts;"

index.php

<link rel="stylesheet" href="style.css">
<h1>MY BLOG!</h1>
<a href='new_post.php'>Crear nuevo post</a>

<?php
$mysqli = new mysqli("localhost", "my_user", "my_password", "my_database");

$res = $mysqli->query("SELECT * FROM posts");

while ($row = $res->fetch_assoc()) {
    echo "<h2>" . $row['title'] . "</h2>\n";
    echo "<p>" . $row['content'] . "</p>\n";
}
?>

new_post.php

<link rel="stylesheet" href="style.css">

<form id="form" action="insert_post.php" method="get">
            <label for="title">Titulo:</label>
            <input id="title" type="text" name="title" size="46" required/>
            <label for="content">Contenido:</label>
            <textarea id="content" type="text" name="content" rows="8" cols="64" required></textarea>
            <input id="submit" type="submit" value="Crear post" disabled/>
</form>

<script>
document.getElementById('form').addEventListener("keyup", () => {
            document.getElementById("submit").disabled = !form.checkValidity();
});
</script>

insert_post.php

<link rel="stylesheet" href="style.css">

<?php
$mysqli = new mysqli("localhost", "my_user", "my_password", "my_database");

$stmt = $mysqli->prepare("INSERT INTO posts VALUES (?,?)");

$stmt->bind_param("ss", $titulo, $contenido);

$titulo = $_GET['title'];
$contenido = $_GET['content'];

$stmt->execute();

$stmt->close();

echo "<h3>Entrada añadida!</h3>";
echo "<a href='/'>Volver</a>";
?>

style.css

h1 {
    background-color: #135e96;
    color: white;
    padding: 16px;
}

a {
    background-color: #c9356e;
    color: white;
    padding: 16px;
    border-radius: 8px;
    text-decoration: none;
    cursor: pointer;
}

a:hover {
    background-color: #a9154e;
}

h2 {
    color: #135e96;
    padding-top: 64px;
    border-bottom: 1px solid #135e96;
}

p {
    background-color: #e1e1e9;
    padding:32px;
    border-radius: 4px;
}

h3 {
    background-color: #f1f1f1;
    border: 1px solid #919191;
    border-left: 4px solid #46b450;
    padding: 16px;
}

input, textarea {
    display: block;
    padding: 16px;
}

input[type=submit] {
    background-color: #46b450;
    color: white;
    padding: 16px;
    margin: 8px 0;
    border: none;
    border-radius: 8px;
    cursor: pointer;
}

input[type=submit]:hover {
    background-color: #269430;
}

input[type=submit]:disabled {
    background-color: gray;
}

label {
    margin-top: 32px;
}