// Frontend – UI Layer
function renderUI() {
const root = document.querySelector("#app");
root.innerHTML = `
<main class="page">
<h1>Welcome to CodeDive</h1>
<p>Diving into the ocean of code.</p>
</main>
`;
}
function attachEvents() {
document.addEventListener("click", (event) => {
console.log("[FE] click:", event.target);
});
}
renderUI();
attachEvents();
// Backend – API Layer
async function getUser(id) {
const user = await db.user.findById(id);
if (!user) {
throw new Error("User not found");
}
return user;
}
app.get("/api/users/:id", async (req, res) => {
try {
const user = await getUser(req.params.id);
res.json({ ok: true, user });
} catch (err) {
console.error("[BE] error:", err);
res.status(404).json({ ok: false, message: err.message });
}
});
-- Database – Core Storage
BEGIN;
CREATE TABLE users (
id BIGINT PRIMARY KEY,
email VARCHAR(191) UNIQUE NOT NULL,
name VARCHAR(100) NOT NULL,
active TINYINT(1) NOT NULL DEFAULT 1,
created_at TIMESTAMP NOT NULL,
updated_at TIMESTAMP NULL
);
CREATE INDEX idx_users_active_created
ON users (active, created_at DESC);
SELECT id, email, name
FROM users
WHERE active = 1
ORDER BY created_at DESC
LIMIT 50;
COMMIT;
# Infrastructure – Deep Layer
resource "aws_instance" "app" {
ami = "ami-1234567890"
instance_type = "t3.medium"
tags = {
Name = "codedive-app"
Env = "production"
}
}
resource "aws_security_group" "app_sg" {
name = "codedive-app-sg"
description = "Allow HTTP/HTTPS"
ingress {
from_port = 80
to_port = 80
protocol = "tcp"
cidr_blocks = ["0.0.0.0/0"]
}
ingress {
from_port = 443
to_port = 443
protocol = "tcp"
cidr_blocks = ["0.0.0.0/0"]
}
}
output "app_endpoint" {
value = aws_instance.app.public_ip
}