smig/odin-codespace
1
0
Fork 0
mirror of https://gitea.smigz.com/smiggiddy/odin-codeprojects.git synced 2025-06-28 12:55:36 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

basic msg board

Browse source
This commit is contained in:
Smigz 2024-12-25 22:45:54 -05:00
parent b66089f97e
commit 15a77883f4
9 changed files with 1148 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

21
nodejs-mini-message-board/src/app.js Normal file
View file

@ -0,0 +1,21 @@
const express = require("express");
const app = express();
const path = require("node:path");
const port = 3000;
const { indexRouter } = require("./routes/indexRouter");
//const { msgRouter } = require("./routes/msgRouter");
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "ejs");
const assetsPath = path.join(__dirname, "public");
app.use(express.static(assetsPath));
app.use("/", indexRouter);
//app.use("/new", msgRouter);
app.listen(port, () => {
console.log(`Webserver running on ${port}.`);
});

31
nodejs-mini-message-board/src/public/styles.css Normal file
View file

@ -0,0 +1,31 @@
:root {
padding: 0;
margin: 0;
}
.nav {
display: flex;
justify-content: center;
align-items: center;
list-style-type: none;
}
.nav-item {
margin: 0 1rem;
}
.nav-link {
text-decoration: none;
}
.container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.card {
display: flex;
flex-direction: column;
}

41
nodejs-mini-message-board/src/routes/indexRouter.js Normal file
View file

@ -0,0 +1,41 @@
const { Router } = require("express");
const indexRouter = Router();
links = [
{ href: "/", text: "Home" },
{ href: "/new", text: "New" },
];
const messages = [
{
text: "Hi there!",
user: "Amando",
added: new Date(),
},
{
text: "Hello World!",
user: "Charles",
added: new Date(),
},
{
text: "This is a smig's app",
user: "Smig's",
added: new Date(),
},
];
indexRouter.get("/", (req, res) => {
res.render("index", { links: links, msgs: messages });
});
indexRouter.get("/new", (req, res) => {
res.render("msgs");
});
indexRouter.post("/new", (req, res) => {
console.log(req);
res.redirect("/");
});
module.exports = { indexRouter };

9
nodejs-mini-message-board/src/routes/msgRouter.js Normal file
View file

@ -0,0 +1,9 @@
const { Router } = require("express");
const msgRouter = Router();
msgRouter.get("/", (req, res) => {
res.render("msgs");
});
module.exports = { msgRouter };

23
nodejs-mini-message-board/src/views/index.ejs Normal file
View file

@ -0,0 +1,23 @@
<html>
<head>
<title>Message the people</title>
<link rel="stylesheet" href="/styles.css">
</head>
<body>
<!-- this should be some stuff that loads --!>
<%- include('navbar', {links: links}) %>
<div class="container">
<% msgs.forEach((msg) => { %>
<div class="card">
<h3><%= msg.user %></h3>
<span><%= msg.added %></span>
<p><%= msg.text %></p>
</div>
<% }); %>
</div>
</body>
</html>

17
nodejs-mini-message-board/src/views/msgs.ejs Normal file
View file

@ -0,0 +1,17 @@
<form method="POST" action="/new">
<div class="form-item">
<label for="uername">Username</label>
<input type="text" id="username" name="username">
</div>
<div class="form-item">
<label for="message">Message</label>
<input type="text" id="message" name="message">
</div>
<div class="form-item">
<button type="submit">Submit</button>
</div>
</form>
<!-- vim: sts=2 sw=2 et ts=2 # -->

10
nodejs-mini-message-board/src/views/navbar.ejs Normal file
View file

@ -0,0 +1,10 @@
<nav class="nav">
<% for (let i=0; i < links.length; i++) { %>
<li class="nav-item">
<a href="<%= links[i].href %>" class="nav-link">
<span> <%= links[i].text %> </span>
</a>
</li>
<% } %>
</nav>