Compare commits
No commits in common. "f05533558a05368edcc1823cce4b4fd8af858777" and "f82ea5904878cbcac88915918c21bfa5fdc16314" have entirely different histories.
f05533558a
...
f82ea59048
@ -3,23 +3,19 @@
|
|||||||
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
||||||
|
|
||||||
@import url("https://fonts.googleapis.com/css2?family=Cutive+Mono&family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
|
@import url('https://fonts.googleapis.com/css2?family=Cutive+Mono&family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
|
||||||
|
|
||||||
body {
|
body{
|
||||||
background-color: rgb(232, 163, 217);
|
background-color: rgb(232, 163, 217);
|
||||||
color: rgb(146, 0, 24);
|
color: rgb(146, 0, 24)
|
||||||
}
|
}
|
||||||
|
|
||||||
h1,
|
h1, h2, h3, h4, h5 {
|
||||||
h2,
|
font-family: 'Cutive Mono', monospace;
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5 {
|
|
||||||
font-family: "Cutive Mono", monospace;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
font-family: "EB Garamond", serif;
|
font-family: 'EB Garamond', serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title-text {
|
.title-text {
|
||||||
@ -32,12 +28,12 @@ p {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.form-submit:hover {
|
.form-submit:hover {
|
||||||
background: rgb(62, 100, 2);
|
background:rgb(62, 100, 2);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.todo-input {
|
.todo-input {
|
||||||
background: rgb(16, 232, 236);
|
background: rgb(16, 232, 236)
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
|
|||||||
@ -3,23 +3,19 @@
|
|||||||
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
||||||
|
|
||||||
@import url("https://fonts.googleapis.com/css2?family=Cutive+Mono&family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
|
@import url('https://fonts.googleapis.com/css2?family=Cutive+Mono&family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');
|
||||||
|
|
||||||
body {
|
body{
|
||||||
background-color: rgb(238, 213, 232);
|
background-color: rgb(238, 213, 232);
|
||||||
color: rgb(92, 89, 92);
|
color: rgb(92, 89, 92)
|
||||||
}
|
}
|
||||||
|
|
||||||
h1,
|
h1, h2, h3, h4, h5 {
|
||||||
h2,
|
font-family: 'EB Garamond', serif;
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5 {
|
|
||||||
font-family: "EB Garamond", serif;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
font-family: "Curtive Mono", monospace;
|
font-family: 'Curtive Mono', monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
.title-text {
|
.title-text {
|
||||||
@ -31,51 +27,48 @@ img {
|
|||||||
width: 10%;
|
width: 10%;
|
||||||
height: auto;
|
height: auto;
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-submit {
|
.form-submit {
|
||||||
background-color: rgb(255, 124, 192);
|
background-color: rgb(255, 124, 192);
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-submit:hover {
|
.form-submit:hover {
|
||||||
background: rgb(252, 27, 121);
|
background:rgb(252, 27, 121);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
form input,
|
form input, form textarea {
|
||||||
form textarea {
|
font-family: 'Cutive Mono', monospace;
|
||||||
font-family: "Cutive Mono", monospace;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.todo-input {
|
.todo-input {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
label,
|
label, input, button {
|
||||||
input,
|
|
||||||
button {
|
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
border: none;
|
border: none;
|
||||||
outline: none;
|
outline: none;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
label {
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
label:nth-of-type(2) {
|
label:nth-of-type(2) {
|
||||||
margin-top: 12px;
|
margin-top: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
input::placeholder {
|
input::placeholder {
|
||||||
color: gray;
|
color: gray;
|
||||||
}
|
}
|
||||||
|
|
||||||
input {
|
input {
|
||||||
background: #ecf0f3;
|
background: #ecf0f3;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
@ -83,11 +76,11 @@ input {
|
|||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
border-radius: 50px;
|
border-radius: 50px;
|
||||||
box-shadow: inset 6px 6px 6px #cbced1, inset -6px -6px 6px white;
|
box-shadow: inset 6px 6px 6px #cbced1, inset -6px -6px 6px white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-submit {
|
button {
|
||||||
color: white;
|
color: white;
|
||||||
font-family: "Curtive Mono", monospace;
|
font-family: 'Curtive Mono', monospace;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
margin: 20px auto;
|
margin: 20px auto;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
@ -95,7 +88,7 @@ input {
|
|||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -108,73 +101,60 @@ input {
|
|||||||
|
|
||||||
.todo-container {
|
.todo-container {
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
font-family: "Curtive Mono", monospace;
|
font-family: 'Curtive Mono', monospace;
|
||||||
background-color: #fff5f7; /* Soft cream background for the list */
|
background-color: #fff5f7; /* Soft cream background for the list */
|
||||||
border: 4px solid #ffd0dc; /* Pink border */
|
border: 4px solid #ffd0dc; /* Pink border */
|
||||||
border-radius: 30px;
|
border-radius: 30px;
|
||||||
box-shadow: 6px 4px 10px rgba(0, 0, 0, 0.1); /* Soft shadow */
|
box-shadow: 6px 4px 10px rgba(0, 0, 0, 0.1); /* Soft shadow */
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 20px 20px 20px 20px; /* up left down right */
|
padding: 20px 20px 20px 20px;/* up left down right */
|
||||||
background-image: url("/images/polka.jpg"); /* Add your image path */
|
background-image: url('/images/polka.jpg'); /* Add your image path */
|
||||||
background-size: cover; /* Scale the image to cover the entire list item */
|
background-size: cover; /* Scale the image to cover the entire list item */
|
||||||
background-repeat: no-repeat; /* Prevent the image from repeating */
|
background-repeat: no-repeat; /* Prevent the image from repeating */
|
||||||
background-position: center; /* Center thse image within the list item */
|
background-position: center; /* Center thse image within the list item */
|
||||||
}
|
}
|
||||||
|
|
||||||
.inner-todo {
|
.inner-todo {
|
||||||
background-color: #fee6eb;
|
background-color: #fee6eb;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Heading */
|
/* Heading */
|
||||||
.todo-container h1 {
|
.todo-container h1 {
|
||||||
font-size: 25px;
|
font-size: 25px;
|
||||||
font-family: "EB Garamond", serif;
|
font-family: 'EB Garamond', serif;
|
||||||
color: #545353; /* Pink color for title */
|
color: #545353; /* Pink color for title */
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* List Styling */
|
/* List Styling */
|
||||||
ol {
|
ol {
|
||||||
|
list-style: none;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
ol li {
|
ol li {
|
||||||
color: #545353; /* Adjust text color for visibility */
|
color: #545353; /* Adjust text color for visibility */
|
||||||
margin: 10px;
|
margin: 10px;
|
||||||
background-color: #ffffff; /* Soft cream background for the list */
|
background-color: #ffffff; /* Soft cream background for the list */
|
||||||
padding: 20px; /* Increase padding for better layout */
|
padding: 20px; /* Increase padding for better layout */
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
font-family: "Curtive Mono", monospace; /* Consistent font */
|
font-family: 'Curtive Mono', monospace; /* Consistent font */
|
||||||
min-width: 250px;
|
min-width: 250px;
|
||||||
display: flex;
|
}
|
||||||
flex-direction: row;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol li i {
|
/* Decoration Image */
|
||||||
font-size: 20px;
|
.decor {
|
||||||
}
|
|
||||||
|
|
||||||
li button {
|
|
||||||
background-color: white;
|
|
||||||
color: rgb(61, 61, 61); /* Button text color */
|
|
||||||
cursor: pointer; /* Pointer cursor for interactivity */
|
|
||||||
width: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Decoration Image */
|
|
||||||
.decor {
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: -20px;
|
bottom: -20px;
|
||||||
right: 250px;
|
right: -20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.decor img {
|
.decor img {
|
||||||
width: 150px;
|
width: 150px;
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
@ -1,69 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<title>Tiffy's to-do list website</title>
|
|
||||||
|
|
||||||
<meta name="description" content="Tiffy's todo list website" />
|
|
||||||
<meta name="keywords" content="list, todo" />
|
|
||||||
<meta name="author" content="Tiffany" />
|
|
||||||
|
|
||||||
<link rel="icon" href="images/favicon.ico" />
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/main.css" />
|
|
||||||
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
|
|
||||||
integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
referrerpolicy="no-referrer"
|
|
||||||
/>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<section>
|
|
||||||
<div class="container">
|
|
||||||
<h1 class="title-text">Tiffy's to-do list website</h1>
|
|
||||||
|
|
||||||
<img src="images/image.jpg" alt="Image not found" />
|
|
||||||
|
|
||||||
<p><i>Add something cute to my to-do list!</i></p>
|
|
||||||
<form action="/form-action" method="post">
|
|
||||||
<label for="to-do"></label>
|
|
||||||
<input
|
|
||||||
name="todo"
|
|
||||||
type="text"
|
|
||||||
placeholder="Enter a to-do"
|
|
||||||
required
|
|
||||||
class="todo-input"
|
|
||||||
/>
|
|
||||||
<button type="submit" class="form-submit">Add</button>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
<!-- List -->
|
|
||||||
<!-- ordered list -->
|
|
||||||
|
|
||||||
<div class="todo-container">
|
|
||||||
<div class="inner-todo">
|
|
||||||
<h1>To do list</h1>
|
|
||||||
<ol>
|
|
||||||
<!-- <li>Learn from Ronald</li>
|
|
||||||
<li>Watch movies</li>
|
|
||||||
<li>Sleep</li> -->
|
|
||||||
</ol>
|
|
||||||
<div class="decor">
|
|
||||||
<img src="images/cryinggirl.gif" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- unordered list -->
|
|
||||||
<!-- <ul></ul> -->
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
<script src="js/todo.js"></script>
|
|
||||||
</html>
|
|
||||||
@ -1,51 +1,15 @@
|
|||||||
//fetch: send a url request, client side rendering
|
//fetch: send a url request, client side rendering
|
||||||
//update the list, by default: fetch uses "get"
|
//update the list, by default: fetch uses get
|
||||||
fetch("/get-todos", { method: "GET" }).then((response) => {
|
fetch('/get-todos', {method: 'GET'}). then((response) => {
|
||||||
response.json().then((data) => {
|
response.json(). then((data) => {
|
||||||
const ol = document.querySelector("ol");
|
const ol = document.querySelector('ol');
|
||||||
data.forEach((item) => {
|
data.forEach((item) => {
|
||||||
//Create li
|
//Create li
|
||||||
const li = document.createElement("li");
|
const li = document.createElement('li');
|
||||||
//add text to li
|
//add text to li
|
||||||
li.textContent = item;
|
li.textContent = item;
|
||||||
|
//add li underneath (child) ol
|
||||||
// Create button
|
|
||||||
const button = document.createElement("button");
|
|
||||||
button.type = "submit";
|
|
||||||
|
|
||||||
// Add icon to button
|
|
||||||
const icon = document.createElement("i");
|
|
||||||
icon.className = "fa-solid fa-delete-left";
|
|
||||||
|
|
||||||
// Append icon to button
|
|
||||||
button.appendChild(icon);
|
|
||||||
|
|
||||||
// Append button to li
|
|
||||||
li.appendChild(button);
|
|
||||||
|
|
||||||
// Add delete functionality
|
|
||||||
button.addEventListener("click", () => {
|
|
||||||
// Send DELETE request
|
|
||||||
fetch(`/delete-todo`, {
|
|
||||||
method: "DELETE",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({ todo: item }),
|
|
||||||
})
|
|
||||||
.then((response) => {
|
|
||||||
if (response.ok) {
|
|
||||||
// Remove the item from the DOM
|
|
||||||
li.remove();
|
|
||||||
} else {
|
|
||||||
console.error("Failed to delete to-do item");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((error) => console.error("Error:", error));
|
|
||||||
});
|
|
||||||
|
|
||||||
// Append li underneath (child) ol
|
|
||||||
ol.appendChild(li);
|
ol.appendChild(li);
|
||||||
});
|
})
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
62
nodeJS/Learning/05/src/index.html
Normal file
@ -0,0 +1,62 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Tiffy's to-do list website</title>
|
||||||
|
|
||||||
|
<meta name="description" content="Tiffy's todo list website" />
|
||||||
|
<meta name="keywords" content="list, todo" />
|
||||||
|
<meta name="author" content="Tiffany" />
|
||||||
|
|
||||||
|
<link rel="icon" href="images/favicon.ico" />
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="css/main.css"/>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<section>
|
||||||
|
<div class="container">
|
||||||
|
<h1 class="title-text">Tiffy's to-do list website</h1>
|
||||||
|
<p><i>Add something cute to my to-do list!</i></p>
|
||||||
|
|
||||||
|
<img src="images/image.jpg" alt="Image not found">
|
||||||
|
|
||||||
|
<form action="/form-action" method="post">
|
||||||
|
<label for="to-do"></label>
|
||||||
|
<input name="todo" type="text" placeholder="Enter a to-do" required class="todo-input"/>
|
||||||
|
|
||||||
|
<!-- button, if it's a submit button then it will end the form and submit it, other than that the button doesnt do anything -->
|
||||||
|
<button type="submit" class="form-submit">Add</button>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<!-- List -->
|
||||||
|
<!-- ordered list -->
|
||||||
|
|
||||||
|
<div class="todo-container">
|
||||||
|
<div class="inner-todo">
|
||||||
|
<h1>To do list</h1>
|
||||||
|
<ol>
|
||||||
|
<!-- <li>Learn from Ronald</li>
|
||||||
|
<li>Watch movies</li>
|
||||||
|
<li>Sleep</li> -->
|
||||||
|
</ol>
|
||||||
|
<div class="decor">
|
||||||
|
<img src="images/cryinggirl.gif"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- unordered list -->
|
||||||
|
<!-- <ul></ul> -->
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
<script src="js/todo.js"> </script>
|
||||||
|
|
||||||
|
</html>
|
||||||
@ -1,24 +1,23 @@
|
|||||||
//importing the dotenv package (secret file), configuring dotenv for our project
|
//importing the dotenv package (secret file), configuring dotenv for our project
|
||||||
//dotenv, secret file, people cant read
|
//dotenv, secret file, people cant read
|
||||||
import dotenv from "dotenv";
|
import dotenv from 'dotenv';
|
||||||
dotenv.config({ path: `${__dirname}/../.env` });
|
dotenv.config({ path: `${__dirname}/../.env` });
|
||||||
|
|
||||||
//Variable declaration
|
//Variable declaration
|
||||||
|
|
||||||
//we named express as a variable name, usually name same as imported package
|
//we named express as a variable name, usually name same as imported package
|
||||||
//express: designed to easily make a web server
|
//express: designed to easily make a web server
|
||||||
import express, { Application, Request, Response } from "express";
|
import express, { Request, Response } from 'express';
|
||||||
|
|
||||||
//bodyParser: sending form action to my server, wrap the user's data in "body" to my server, and my server is unwrapping it
|
//bodyParser: sending form action to my server, wrap the user's data in "body" to my server, and my server is unwrapping it
|
||||||
import bodyParser from "body-parser";
|
import bodyParser from 'body-parser';
|
||||||
import fs from "fs";
|
import fs from 'fs';
|
||||||
import path from "path";
|
|
||||||
|
|
||||||
const filePath: string = "todolist.txt";
|
const filePath = 'todolist.txt';
|
||||||
|
|
||||||
//initializing the express web server, everything in express, we want to put in app
|
//initializing the express web server, everything in express, we want to put in app
|
||||||
const app: Application = express();
|
const app = express();
|
||||||
const port: Number = parseInt(process.env.PORT as string) || 3000;
|
const port = process.env.PORT || 3000;
|
||||||
|
|
||||||
// Middleware
|
// Middleware
|
||||||
//unwrap the words
|
//unwrap the words
|
||||||
@ -32,89 +31,41 @@ app.use(bodyParser.json());
|
|||||||
//to make icon files, because icon files are always downloaded
|
//to make icon files, because icon files are always downloaded
|
||||||
app.use(express.static(`${__dirname}/../public`));
|
app.use(express.static(`${__dirname}/../public`));
|
||||||
|
|
||||||
app.get(`/`, (_req: Request, res: Response): void => {
|
app.get(`/`, (req, res) => {
|
||||||
res.sendFile(path.join(__dirname, "../public/html/index.html"));
|
res.sendFile(`${__dirname}/index.html`);
|
||||||
});
|
});
|
||||||
|
|
||||||
app.post("/form-action", (req: Request, res: Response): void => {
|
app.post('/form-action', (req, res) => {
|
||||||
const todo = req.body.todo;
|
const todo = req.body.todo;
|
||||||
|
console.log(todo);
|
||||||
|
|
||||||
// use fs to add the item to the file
|
// use fs to add the item to the file
|
||||||
|
|
||||||
fs.appendFile(filePath, "\n" + todo, (err) => {
|
fs.appendFile(filePath, todo + '\n', (err) => {
|
||||||
if (err) {
|
if (err) {
|
||||||
console.log(err);
|
console.log(err)
|
||||||
res.send("Hey there is an error.");
|
res.send("Hey there is an error.")
|
||||||
} else {
|
} else {
|
||||||
res.redirect("/");
|
res.redirect("/");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get("/get-todos", (_req: Request, res: Response): void => {
|
app.get('/get-todos', (req: Request, res: Response): void => {
|
||||||
//Using the fs module to read the file
|
//Using the fs module to read the file
|
||||||
fs.readFile(
|
fs.readFile(filePath, 'utf-8', (err:NodeJS.ErrnoException | null, data: string) => {
|
||||||
filePath,
|
|
||||||
"utf-8",
|
|
||||||
(err: NodeJS.ErrnoException | null, data: string) => {
|
|
||||||
if (err) {
|
if (err) {
|
||||||
console.log(err);
|
console.log(err)
|
||||||
res.send("An error occured.");
|
res.send("An error occured.")
|
||||||
} else {
|
} else {
|
||||||
//Return the file contents as a response of each list item data.split
|
//Return the file contents as a response of each list item data.split
|
||||||
//Send the response back to the client as a json object res.json
|
//Send the response back to the client as a json object res.json
|
||||||
res.json(data.split("\n").filter((data) => data.trim() !== ""));
|
res.json(data.split('\n'))
|
||||||
}
|
}
|
||||||
}
|
})
|
||||||
);
|
})
|
||||||
});
|
|
||||||
|
|
||||||
app.delete("/delete-todo", (req: Request, res: Response): void => {
|
|
||||||
const todoToDelete = (req.body.todo || "").trim(); // Ensure input is trimmed
|
|
||||||
|
|
||||||
if (!todoToDelete) {
|
|
||||||
res.status(400).json({ error: "No to-do item provided to delete" });
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Read the file to get the current list of todos
|
|
||||||
fs.readFile(filePath, "utf8", (err, data) => {
|
|
||||||
if (err) {
|
|
||||||
console.error("Error reading file:", err);
|
|
||||||
res.status(500).json({ error: "Internal Server Error" });
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Split the content into lines and trim whitespace from each line
|
|
||||||
const todos = data
|
|
||||||
.split("\n")
|
|
||||||
.map((line) => line.trim())
|
|
||||||
.filter((line) => line !== ""); // Remove empty lines
|
|
||||||
|
|
||||||
// Filter out the todo item to delete
|
|
||||||
const updatedTodos = todos.filter((todo) => todo !== todoToDelete);
|
|
||||||
|
|
||||||
if (todos.length === updatedTodos.length) {
|
|
||||||
res.status(404).json({ error: "Todo not found" });
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Join the updated list back into a string
|
|
||||||
const updatedContent = updatedTodos.join("\n");
|
|
||||||
|
|
||||||
// Write the updated content back to the file
|
|
||||||
fs.writeFile(filePath, updatedContent, "utf8", (writeErr) => {
|
|
||||||
if (writeErr) {
|
|
||||||
console.error("Error writing file:", writeErr);
|
|
||||||
res.status(500).json({ error: "Internal Server Error" });
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log(`Deleted todo: ${todoToDelete}`);
|
|
||||||
res.status(200).json({ message: "Todo deleted successfully" });
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// slash'/' is the home page, /about is the about page
|
// slash'/' is the home page, /about is the about page
|
||||||
//get, post, put, delete
|
//get, post, put, delete
|
||||||
|
|||||||
@ -1,3 +1,6 @@
|
|||||||
ABC
|
Learn coding
|
||||||
CDE
|
Cook dinner
|
||||||
FADDGD
|
Make a pretty website
|
||||||
|
Delete list items
|
||||||
|
Edit list items
|
||||||
|
Move items to database!!!
|
||||||
@ -30,9 +30,7 @@
|
|||||||
"moduleResolution": "node10" /* Specify how TypeScript looks up a file from a given module specifier. */,
|
"moduleResolution": "node10" /* Specify how TypeScript looks up a file from a given module specifier. */,
|
||||||
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */
|
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */
|
||||||
// "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */
|
// "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */
|
||||||
"rootDirs": [
|
"rootDirs": ["./"], /* Allow multiple folders to be treated as one when resolving modules. */
|
||||||
"./"
|
|
||||||
] /* Allow multiple folders to be treated as one when resolving modules. */,
|
|
||||||
// "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */
|
// "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */
|
||||||
// "types": [], /* Specify type package names to be included without being referenced in a source file. */
|
// "types": [], /* Specify type package names to be included without being referenced in a source file. */
|
||||||
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
|
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
|
||||||
@ -87,18 +85,18 @@
|
|||||||
/* Type Checking */
|
/* Type Checking */
|
||||||
"strict": true /* Enable all strict type-checking options. */,
|
"strict": true /* Enable all strict type-checking options. */,
|
||||||
"noImplicitAny": true /* Enable error reporting for expressions and declarations with an implied 'any' type. */,
|
"noImplicitAny": true /* Enable error reporting for expressions and declarations with an implied 'any' type. */,
|
||||||
"strictNullChecks": true /* When type checking, take into account 'null' and 'undefined'. */,
|
// "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */
|
||||||
"strictFunctionTypes": true /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */,
|
// "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
|
||||||
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
|
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
|
||||||
// "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */
|
// "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */
|
||||||
// "strictBuiltinIteratorReturn": true, /* Built-in iterators are instantiated with a 'TReturn' type of 'undefined' instead of 'any'. */
|
// "strictBuiltinIteratorReturn": true, /* Built-in iterators are instantiated with a 'TReturn' type of 'undefined' instead of 'any'. */
|
||||||
"noImplicitThis": true /* Enable error reporting when 'this' is given the type 'any'. */,
|
// "noImplicitThis": true, /* Enable error reporting when 'this' is given the type 'any'. */
|
||||||
// "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */
|
// "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */
|
||||||
"alwaysStrict": true /* Ensure 'use strict' is always emitted. */,
|
"alwaysStrict": true /* Ensure 'use strict' is always emitted. */,
|
||||||
// "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */
|
// "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */
|
||||||
"noUnusedParameters": true /* Raise an error when a function parameter isn't read. */,
|
// "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */
|
||||||
// "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */
|
// "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */
|
||||||
"noImplicitReturns": true /* Enable error reporting for codepaths that do not explicitly return in a function. */,
|
// "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */
|
||||||
// "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */
|
// "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */
|
||||||
// "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */
|
// "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */
|
||||||
// "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */
|
// "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */
|
||||||
|
|||||||
@ -1 +0,0 @@
|
|||||||
node_modules
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
# Use Base Image: What we are using to make Docker File, eg ubuntu container/ image, node etc
|
|
||||||
FROM node:lts-alpine
|
|
||||||
|
|
||||||
# Make Dir (make sure directory exists)
|
|
||||||
RUN mkdir -p /usr/src/app
|
|
||||||
|
|
||||||
# Set the working directory: using the correct folder
|
|
||||||
WORKDIR /usr/src/app
|
|
||||||
|
|
||||||
# Copy files into folder (no need to reinstall every single time)
|
|
||||||
COPY package.json .
|
|
||||||
|
|
||||||
# Install the dependencies
|
|
||||||
RUN yarn install
|
|
||||||
|
|
||||||
# Copy the rest of the files
|
|
||||||
COPY . .
|
|
||||||
|
|
||||||
# Expose the port
|
|
||||||
EXPOSE 3000
|
|
||||||
|
|
||||||
# Execute Command
|
|
||||||
CMD ["yarn", "dev"]
|
|
||||||
@ -1,44 +0,0 @@
|
|||||||
services:
|
|
||||||
web:
|
|
||||||
build: .
|
|
||||||
ports:
|
|
||||||
- "3000:3000"
|
|
||||||
# files are put in here
|
|
||||||
volumes:
|
|
||||||
- .:/usr/src/app
|
|
||||||
- ./node_modules:/usr/src/app/node_modules
|
|
||||||
command: ["yarn", "dev"]
|
|
||||||
|
|
||||||
# Database: how we want to create the database
|
|
||||||
db:
|
|
||||||
# Image of postgres in 13th version
|
|
||||||
image: postgres:13
|
|
||||||
environment: #secret
|
|
||||||
POSTGRES_USER: ${DB_USER}
|
|
||||||
POSTGRES_PASSWORD: ${DB_PASSWORD}
|
|
||||||
POSTGRES_DB: ${DB_NAME}
|
|
||||||
ports: #internally the port is 5432, but we want to use 5432 locally
|
|
||||||
- "5432:5432"
|
|
||||||
# create a file to store stuff, store inside "data" folder
|
|
||||||
volumes:
|
|
||||||
- data:/var/lib/postgresql/data
|
|
||||||
|
|
||||||
# PGAdmin: visualize postgres database
|
|
||||||
pgadmin:
|
|
||||||
image: dpage/pgadmin4
|
|
||||||
environment:
|
|
||||||
PGADMIN_DEFAULT_EMAIL: ${PGADMIN_DEFAULT_EMAIL}
|
|
||||||
PGADMIN_DEFAULT_PASSWORD: ${PGADMIN_DEFAULT_PASSWORD}
|
|
||||||
ports:
|
|
||||||
# our local port is 3001, but the container port is 80
|
|
||||||
- "3001:80"
|
|
||||||
# creating a folder called pgadmin to store the pgadmin files
|
|
||||||
volumes:
|
|
||||||
- pgadmin:/root/.pgadmin
|
|
||||||
depends_on:
|
|
||||||
- db
|
|
||||||
|
|
||||||
# tell docker to create something called data (refer to above) and store all the postgres data in it
|
|
||||||
volumes:
|
|
||||||
data:
|
|
||||||
pgadmin:
|
|
||||||
@ -1,26 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "06",
|
|
||||||
"version": "1.0.0",
|
|
||||||
"main": "index.js",
|
|
||||||
"license": "MIT",
|
|
||||||
"scripts": {
|
|
||||||
"dev": "concurrently \"nodemon --exec ts-node src/index.ts --quiet\" \"yarn sass --watch src/styles:public/css\"",
|
|
||||||
"build": "tsc && sass src/styles:public/css",
|
|
||||||
"start": "node dist/index.js"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"dotenv": "^16.4.7",
|
|
||||||
"ejs": "^3.1.10",
|
|
||||||
"express": "^4.21.2",
|
|
||||||
"pg": "^8.13.1"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@types/express": "^5.0.0",
|
|
||||||
"@types/pg": "^8.11.10",
|
|
||||||
"concurrently": "^9.1.1",
|
|
||||||
"nodemon": "^3.1.9",
|
|
||||||
"sass": "^1.83.0",
|
|
||||||
"ts-node": "^10.9.2",
|
|
||||||
"typescript": "^5.7.2"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
1677
nodeJS/Learning/06/pnpm-lock.yaml
generated
@ -1,220 +0,0 @@
|
|||||||
/* Style each tag in an html */
|
|
||||||
/* describe to chatgpt what you want, good at css, or css reference */
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
|
||||||
@import url("https://fonts.googleapis.com/css2?family=Cutive+Mono&family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
line-height: 1.5;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
}
|
|
||||||
|
|
||||||
img,
|
|
||||||
picture,
|
|
||||||
video,
|
|
||||||
canvas,
|
|
||||||
svg {
|
|
||||||
display: block;
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
button,
|
|
||||||
textarea,
|
|
||||||
select {
|
|
||||||
font: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
p,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
#root,
|
|
||||||
#__next {
|
|
||||||
isolation: isolate;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
background-color: rgb(238, 213, 232);
|
|
||||||
color: rgb(92, 89, 92);
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5 {
|
|
||||||
font-family: "EB Garamond", serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-family: "Cutive Mono", monospace;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title-text {
|
|
||||||
font-size: 30px;
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 10%;
|
|
||||||
height: auto;
|
|
||||||
margin-top: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-submit {
|
|
||||||
background-color: rgb(255, 124, 192);
|
|
||||||
}
|
|
||||||
.form-submit:hover {
|
|
||||||
background: rgb(252, 27, 121);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
form input,
|
|
||||||
form textarea {
|
|
||||||
font-family: "Cutive Mono", monospace;
|
|
||||||
}
|
|
||||||
|
|
||||||
.todo-input {
|
|
||||||
text-align: left;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
label,
|
|
||||||
input,
|
|
||||||
button {
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
padding: 0;
|
|
||||||
border: none;
|
|
||||||
outline: none;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
label::placeholder,
|
|
||||||
input::placeholder,
|
|
||||||
button::placeholder {
|
|
||||||
color: rgb(92, 89, 92);
|
|
||||||
}
|
|
||||||
|
|
||||||
label {
|
|
||||||
margin-bottom: 4px;
|
|
||||||
}
|
|
||||||
label:nth-of-type(2) {
|
|
||||||
margin-top: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
background: rgb(255, 255, 255);
|
|
||||||
padding: 10px;
|
|
||||||
padding-left: 20px;
|
|
||||||
height: 50px;
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 50px;
|
|
||||||
box-shadow: inset 6px 6px 6px #cbced1, inset -6px -6px 6px rgb(255, 255, 255);
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-submit {
|
|
||||||
color: rgb(255, 255, 255);
|
|
||||||
font-family: "Cutive Mono", monospace;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 20px auto;
|
|
||||||
height: 40px;
|
|
||||||
width: 100px;
|
|
||||||
border-radius: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: flex-end;
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.todo-container {
|
|
||||||
max-width: 300px;
|
|
||||||
font-family: "Cutive Mono", monospace;
|
|
||||||
background-color: rgb(238, 213, 232);
|
|
||||||
border: 4px solid hsl(345, 100%, 91%);
|
|
||||||
border-radius: 30px;
|
|
||||||
box-shadow: 6px 4px 10px rgb(0, 0, 0);
|
|
||||||
position: relative;
|
|
||||||
padding: 20px;
|
|
||||||
background-image: url("/images/polka.jpg");
|
|
||||||
background-size: cover;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: center;
|
|
||||||
}
|
|
||||||
.todo-container .inner-todo {
|
|
||||||
background-color: rgb(238, 213, 232);
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 20px;
|
|
||||||
}
|
|
||||||
.todo-container h1 {
|
|
||||||
font-size: 25px;
|
|
||||||
font-family: "EB Garamond", serif;
|
|
||||||
color: #545353;
|
|
||||||
margin-top: 10px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
ol li {
|
|
||||||
color: #545353;
|
|
||||||
margin: 10px;
|
|
||||||
background-color: rgb(255, 255, 255);
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 20px;
|
|
||||||
text-align: left;
|
|
||||||
font-family: "Cutive Mono", monospace;
|
|
||||||
min-width: 200px;
|
|
||||||
max-width: 300px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
ol li i {
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
ol li button {
|
|
||||||
background-color: rgb(255, 255, 255);
|
|
||||||
color: rgb(61, 61, 61);
|
|
||||||
cursor: pointer;
|
|
||||||
width: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.decor {
|
|
||||||
position: absolute;
|
|
||||||
top: 20px;
|
|
||||||
left: -50px;
|
|
||||||
}
|
|
||||||
.decor img {
|
|
||||||
width: 100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*# sourceMappingURL=index.css.map */
|
|
||||||
@ -1 +0,0 @@
|
|||||||
{"version":3,"sourceRoot":"","sources":["../../../src/styles/pages/index.scss","../../../src/styles/_reset.scss","../../../src/styles/_variable.scss"],"names":[],"mappings":"AAIA;AACA;AAEA;AAEQ;ACRR;AAAA;AAAA;EAGC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;EACA;;;AAGD;AAAA;AAAA;AAAA;AAAA;EAKC;EACA;;;AAGD;AAAA;AAAA;AAAA;EAIC;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOC;;;AAGD;AAAA;EAEC;;;ADtCD;EACC,kBEVS;EFWT,OEVW;;;AFaZ;AAAA;AAAA;AAAA;AAAA;EAKC,aEZa;;;AFed;EACC,aEfW;;;AFkBZ;EACC;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC,kBEhCW;;AFkCX;EACC,YEpCW;EFqCX;;;AAKD;AAAA;EAEC,aEzCU;;;AF6CZ;EACC;EACA;;;AAGD;AAAA;AAAA;EAGC;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACC,OEpEU;;;AFwEZ;EACC;;AAEA;EACC;;;AAIF;EACC,YE/EO;EFgFP;EACA;EACA;EACA;EACA;EACA,YACC;;;AAIF;EACC,OE3FO;EF4FP,aEvFW;EFwFX;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA,aE5GW;EF6GX,kBErHS;EFsHT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC,kBEjIQ;EFkIR;EACA;;AAGD;EACC;EACA,aEjIY;EFkIZ,OErIY;EFsIZ;EACA;;;AAIF;EACC;EACA;;AAEA;EACC,OEhJY;EFiJZ;EACA,kBEnJM;EFoJN;EACA;EACA;EACA,aElJU;EFmJV;EACA;EACA;EACA;;AAEA;EACC;;AAGD;EACC,kBElKK;EFmKL;EACA;EACA;;;AAKH;EACC;EACA;EACA;;AAEA;EACC","file":"index.css"}
|
|
||||||
|
Before Width: | Height: | Size: 108 KiB |
|
Before Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 45 KiB |
|
Before Width: | Height: | Size: 26 KiB |
@ -1,24 +0,0 @@
|
|||||||
// Function to delete a todo item
|
|
||||||
function deleteTodo(todo) {
|
|
||||||
fetch("/todo", {
|
|
||||||
method: "DELETE",
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({ todo }),
|
|
||||||
})
|
|
||||||
.then((response) => {
|
|
||||||
if (response.ok) {
|
|
||||||
// Remove the list item and button from the DOM
|
|
||||||
const listItem = [...document.querySelectorAll("li")].find((li) =>
|
|
||||||
li.textContent.trim().startsWith(todo)
|
|
||||||
);
|
|
||||||
if (listItem) {
|
|
||||||
listItem.remove();
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
console.error("Failed to delete the todo item.");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((error) => console.error("Error deleting todo:", error));
|
|
||||||
}
|
|
||||||
@ -1,14 +0,0 @@
|
|||||||
import { Pool } from "pg";
|
|
||||||
|
|
||||||
console.log(process.env.DB_HOST);
|
|
||||||
|
|
||||||
const pg = new Pool({
|
|
||||||
host: process.env.DB_HOST,
|
|
||||||
user: process.env.DB_USER,
|
|
||||||
password: process.env.DB_PASSWORD,
|
|
||||||
database: process.env.DB_NAME,
|
|
||||||
port: parseInt(process.env.DB_PORT as string),
|
|
||||||
});
|
|
||||||
|
|
||||||
// export pg to outside to use
|
|
||||||
export default pg;
|
|
||||||
@ -1,111 +0,0 @@
|
|||||||
import dotenv from "dotenv";
|
|
||||||
dotenv.config({ path: ".env" });
|
|
||||||
|
|
||||||
import express, { Application, Request, Response } from "express";
|
|
||||||
import pg from "./database/pg";
|
|
||||||
import { PoolClient } from "pg";
|
|
||||||
|
|
||||||
const app: Application = express();
|
|
||||||
const port: number = parseInt(process.env.PORT as string) || 3000;
|
|
||||||
|
|
||||||
//Middleware
|
|
||||||
app.use(express.json());
|
|
||||||
app.use(express.urlencoded({ extended: true }));
|
|
||||||
|
|
||||||
//Setting up for EJS
|
|
||||||
app.set("views", `./src/views`);
|
|
||||||
app.set("view engine", "ejs");
|
|
||||||
|
|
||||||
//Static route
|
|
||||||
app.use(express.static(`${__dirname}/../public`));
|
|
||||||
|
|
||||||
//check and send index ejs
|
|
||||||
//Query postgres database to get all todos (async await)
|
|
||||||
app.get("/", (_req: Request, res: Response): void => {
|
|
||||||
pg.query("SELECT * FROM todos", (err: Error, result: any) => {
|
|
||||||
if (err) {
|
|
||||||
console.log("Error querying todos", err);
|
|
||||||
res.status(500).send("Internal Server Error");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Extract all rows from the database
|
|
||||||
const todos = result.rows.map((row: { todo: string }) => row.todo);
|
|
||||||
|
|
||||||
res.render("index", {
|
|
||||||
todos, // Pass todos to the template
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
app.post("/form-action", (req: Request, res: Response): void => {
|
|
||||||
const todo: string = req.body.todo;
|
|
||||||
|
|
||||||
//query postgres to insert todo, $1 is a placeholder for the value of todo
|
|
||||||
pg.query("INSERT INTO todos (todo) VALUES ($1)", [todo], (err: Error) => {
|
|
||||||
if (err) {
|
|
||||||
console.log("Error inserting todo", err);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log(`Inserted ${todo} successfully`);
|
|
||||||
});
|
|
||||||
|
|
||||||
res.redirect("/");
|
|
||||||
});
|
|
||||||
|
|
||||||
app.delete("/todo", (req: Request, res: Response): void => {
|
|
||||||
const { todo } = req.body;
|
|
||||||
|
|
||||||
pg.query("DELETE FROM todos WHERE todo = $1", [todo], (err: Error) => {
|
|
||||||
if (err) {
|
|
||||||
console.log("Error deleting todo", err);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
res.status(200).send({ message: "Todo deleted successfully" });
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
app.listen(port, (): void => {
|
|
||||||
console.log(`Server is running on port ${port}`);
|
|
||||||
});
|
|
||||||
|
|
||||||
//Connect to postgres, postgres initialization
|
|
||||||
pg.connect(
|
|
||||||
(err: Error | undefined, client: PoolClient | undefined, done): void => {
|
|
||||||
if (err) {
|
|
||||||
console.log("Error connecting to pg", err);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (!client) {
|
|
||||||
console.log("No client found");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Attempt to Query (asking the database, to check it is connected), it might take us a while and we wont be able to run the rest of the program
|
|
||||||
// Async this
|
|
||||||
client.query("SELECT NOW()", async (err: Error, _result: any) => {
|
|
||||||
if (err) {
|
|
||||||
console.log("Error querying pg", err);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
//Create the table if no error (await)
|
|
||||||
//Query statement, instruction "CREATE TABLE IF NOT EXISTS todos", there is a whole table, https://www.w3schools.com/sql/default.asp
|
|
||||||
//VACHAR is a string, 255 is the max length of the string
|
|
||||||
await client.query(
|
|
||||||
`CREATE TABLE IF NOT EXISTS todos (
|
|
||||||
todo VARCHAR(255) NOT NULL
|
|
||||||
)`,
|
|
||||||
(err: Error) => {
|
|
||||||
console.log("Error creating table", err);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
console.log("Connected to postgres successfully");
|
|
||||||
done();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
);
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
// Cancel all css original settings
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
line-height: 1.5;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
}
|
|
||||||
|
|
||||||
img,
|
|
||||||
picture,
|
|
||||||
video,
|
|
||||||
canvas,
|
|
||||||
svg {
|
|
||||||
display: block;
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
button,
|
|
||||||
textarea,
|
|
||||||
select {
|
|
||||||
font: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
p,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
#root,
|
|
||||||
#__next {
|
|
||||||
isolation: isolate;
|
|
||||||
}
|
|
||||||
@ -1,11 +0,0 @@
|
|||||||
// setting all variables I want to use
|
|
||||||
|
|
||||||
$primary: rgb(238, 213, 232);
|
|
||||||
$secondary: rgb(92, 89, 92);
|
|
||||||
$black: rgb(0, 0, 0);
|
|
||||||
$white: rgb(255, 255, 255);
|
|
||||||
$formprimary: #545353;
|
|
||||||
$hovercolor: rgb(252, 27, 121);
|
|
||||||
$formcolor: rgb(255, 124, 192);
|
|
||||||
$font-header: "EB Garamond", serif;
|
|
||||||
$font-body: "Cutive Mono", monospace;
|
|
||||||
@ -1,184 +0,0 @@
|
|||||||
@use "../reset";
|
|
||||||
@use "../variable";
|
|
||||||
@use "../components/navbar";
|
|
||||||
|
|
||||||
/* Style each tag in an html */
|
|
||||||
/* describe to chatgpt what you want, good at css, or css reference */
|
|
||||||
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
|
||||||
|
|
||||||
@import url("https://fonts.googleapis.com/css2?family=Cutive+Mono&family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
|
|
||||||
|
|
||||||
body {
|
|
||||||
background-color: variable.$primary;
|
|
||||||
color: variable.$secondary;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5 {
|
|
||||||
font-family: variable.$font-header;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title-text {
|
|
||||||
font-size: 30px;
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 10%;
|
|
||||||
height: auto;
|
|
||||||
margin-top: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-submit {
|
|
||||||
background-color: variable.$formcolor;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background: variable.$hovercolor;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
form {
|
|
||||||
input,
|
|
||||||
textarea {
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.todo-input {
|
|
||||||
text-align: left;
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
label,
|
|
||||||
input,
|
|
||||||
button {
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
padding: 0;
|
|
||||||
border: none;
|
|
||||||
outline: none;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
&::placeholder {
|
|
||||||
color: variable.$secondary;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
label {
|
|
||||||
margin-bottom: 4px;
|
|
||||||
|
|
||||||
&:nth-of-type(2) {
|
|
||||||
margin-top: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
background: variable.$white;
|
|
||||||
padding: 10px;
|
|
||||||
padding-left: 20px;
|
|
||||||
height: 50px;
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 50px;
|
|
||||||
box-shadow:
|
|
||||||
inset 6px 6px 6px #cbced1,
|
|
||||||
inset -6px -6px 6px variable.$white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-submit {
|
|
||||||
color: variable.$white;
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 20px auto;
|
|
||||||
height: 40px;
|
|
||||||
width: 100px;
|
|
||||||
border-radius: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: flex-end;
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.todo-container {
|
|
||||||
max-width: 300px;
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
background-color: variable.$primary;
|
|
||||||
border: 4px solid hsl(345, 100%, 91%);
|
|
||||||
border-radius: 30px;
|
|
||||||
box-shadow: 6px 4px 10px variable.$black;
|
|
||||||
position: relative;
|
|
||||||
padding: 20px;
|
|
||||||
background-image: url("/images/polka.jpg");
|
|
||||||
background-size: cover;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: center;
|
|
||||||
|
|
||||||
.inner-todo {
|
|
||||||
background-color: variable.$primary;
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 25px;
|
|
||||||
font-family: variable.$font-header;
|
|
||||||
color: variable.$formprimary;
|
|
||||||
margin-top: 10px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ol {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
|
|
||||||
li {
|
|
||||||
color: variable.$formprimary;
|
|
||||||
margin: 10px;
|
|
||||||
background-color: variable.$white;
|
|
||||||
padding: 20px;
|
|
||||||
border-radius: 20px;
|
|
||||||
text-align: left;
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
min-width: 250px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
i {
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
background-color: variable.$white;
|
|
||||||
color: rgb(61, 61, 61);
|
|
||||||
cursor: pointer;
|
|
||||||
width: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.decor {
|
|
||||||
position: absolute;
|
|
||||||
top: 50px;
|
|
||||||
left: -50px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 100px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,75 +0,0 @@
|
|||||||
<!-- html:5 -->
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<title>Tiffy's to-do list website</title>
|
|
||||||
|
|
||||||
<meta name="description" content="Tiffy's todo list website" />
|
|
||||||
<meta name="keywords" content="list, todo" />
|
|
||||||
<meta name="author" content="Tiffany" />
|
|
||||||
|
|
||||||
<link rel="icon" href="images/favicon.ico" />
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/pages/index.css" />
|
|
||||||
|
|
||||||
<link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
|
|
||||||
integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
|
|
||||||
crossorigin="anonymous"
|
|
||||||
referrerpolicy="no-referrer"
|
|
||||||
/>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<section>
|
|
||||||
<div class="container">
|
|
||||||
<h1 class="title-text">Tiffy's to-do list website</h1>
|
|
||||||
|
|
||||||
<img src="images/image.jpg" alt="Image not found" />
|
|
||||||
|
|
||||||
<p><i>Add something cute to my to-do list!</i></p>
|
|
||||||
<form action="/form-action" method="post">
|
|
||||||
<label for="to-do"></label>
|
|
||||||
<input
|
|
||||||
name="todo"
|
|
||||||
type="text"
|
|
||||||
placeholder="Enter a to-do"
|
|
||||||
required
|
|
||||||
class="todo-input"
|
|
||||||
/>
|
|
||||||
<button type="submit" class="form-submit">Add</button>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
<!-- List -->
|
|
||||||
<!-- ordered list -->
|
|
||||||
|
|
||||||
<div class="todo-container">
|
|
||||||
<div class="inner-todo">
|
|
||||||
<h1>To do list</h1>
|
|
||||||
<ol>
|
|
||||||
<!-- rendering the todos -->
|
|
||||||
<% todos.forEach(todo => { %>
|
|
||||||
<li>
|
|
||||||
<%= todo %>
|
|
||||||
<button onclick="deleteTodo('<%= todo %>')" class="delete-button">
|
|
||||||
<i class="fa-solid fa-delete-left"></i>
|
|
||||||
</li>
|
|
||||||
<% }); %>
|
|
||||||
</ol>
|
|
||||||
<div class="decor">
|
|
||||||
<img src="images/cryinggirl.gif" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- unordered list -->
|
|
||||||
<!-- <ul></ul> -->
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
<script src="js/index.js"></script>
|
|
||||||
</html>
|
|
||||||
@ -1,114 +0,0 @@
|
|||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
/* Visit https://aka.ms/tsconfig to read more about this file */
|
|
||||||
|
|
||||||
/* Projects */
|
|
||||||
// "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
|
|
||||||
// "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */
|
|
||||||
// "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */
|
|
||||||
// "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */
|
|
||||||
// "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */
|
|
||||||
// "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */
|
|
||||||
|
|
||||||
/* Language and Environment */
|
|
||||||
"target": "es2016" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
|
|
||||||
// "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */
|
|
||||||
// "jsx": "preserve", /* Specify what JSX code is generated. */
|
|
||||||
// "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */
|
|
||||||
// "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */
|
|
||||||
// "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
|
|
||||||
// "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
|
|
||||||
// "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
|
|
||||||
// "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
|
|
||||||
// "noLib": true, /* Disable including any library files, including the default lib.d.ts. */
|
|
||||||
// "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */
|
|
||||||
// "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */
|
|
||||||
|
|
||||||
/* Modules */
|
|
||||||
"module": "commonjs" /* Specify what module code is generated. */,
|
|
||||||
// "rootDir": "./src" /* Specify the root folder within your source files. */,
|
|
||||||
"moduleResolution": "node10" /* Specify how TypeScript looks up a file from a given module specifier. */,
|
|
||||||
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */
|
|
||||||
// "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */
|
|
||||||
"rootDirs": [
|
|
||||||
"./src",
|
|
||||||
"./public"
|
|
||||||
] /* Allow multiple folders to be treated as one when resolving modules. */,
|
|
||||||
// "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */
|
|
||||||
// "types": [], /* Specify type package names to be included without being referenced in a source file. */
|
|
||||||
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
|
|
||||||
// "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */
|
|
||||||
// "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */
|
|
||||||
// "rewriteRelativeImportExtensions": true, /* Rewrite '.ts', '.tsx', '.mts', and '.cts' file extensions in relative import paths to their JavaScript equivalent in output files. */
|
|
||||||
// "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */
|
|
||||||
// "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */
|
|
||||||
// "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
|
|
||||||
// "noUncheckedSideEffectImports": true, /* Check side effect imports. */
|
|
||||||
// "resolveJsonModule": true, /* Enable importing .json files. */
|
|
||||||
// "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */
|
|
||||||
// "noResolve": true, /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
|
|
||||||
|
|
||||||
/* JavaScript Support */
|
|
||||||
"allowJs": true /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */,
|
|
||||||
// "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */
|
|
||||||
// "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
|
|
||||||
|
|
||||||
/* Emit */
|
|
||||||
// "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
|
|
||||||
// "declarationMap": true, /* Create sourcemaps for d.ts files. */
|
|
||||||
// "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */
|
|
||||||
// "sourceMap": true, /* Create source map files for emitted JavaScript files. */
|
|
||||||
// "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */
|
|
||||||
// "noEmit": true, /* Disable emitting files from a compilation. */
|
|
||||||
// "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
|
|
||||||
"outDir": "./dist" /* Specify an output folder for all emitted files. */,
|
|
||||||
"removeComments": true /* Disable emitting comments. */,
|
|
||||||
// "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
|
|
||||||
// "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
|
|
||||||
// "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */
|
|
||||||
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
|
|
||||||
// "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */
|
|
||||||
// "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
|
|
||||||
// "newLine": "crlf", /* Set the newline character for emitting files. */
|
|
||||||
// "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
|
|
||||||
// "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */
|
|
||||||
// "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */
|
|
||||||
// "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */
|
|
||||||
// "declarationDir": "./", /* Specify the output directory for generated declaration files. */
|
|
||||||
|
|
||||||
/* Interop Constraints */
|
|
||||||
// "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */
|
|
||||||
// "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
|
|
||||||
// "isolatedDeclarations": true, /* Require sufficient annotation on exports so other tools can trivially generate declaration files. */
|
|
||||||
// "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */
|
|
||||||
"esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
|
|
||||||
// "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
|
|
||||||
"forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
|
|
||||||
|
|
||||||
/* Type Checking */
|
|
||||||
"strict": true /* Enable all strict type-checking options. */,
|
|
||||||
"noImplicitAny": true /* Enable error reporting for expressions and declarations with an implied 'any' type. */,
|
|
||||||
"strictNullChecks": true /* When type checking, take into account 'null' and 'undefined'. */,
|
|
||||||
"strictFunctionTypes": true /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */,
|
|
||||||
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
|
|
||||||
// "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */
|
|
||||||
"strictBuiltinIteratorReturn": true /* Built-in iterators are instantiated with a 'TReturn' type of 'undefined' instead of 'any'. */,
|
|
||||||
"noImplicitThis": true /* Enable error reporting when 'this' is given the type 'any'. */,
|
|
||||||
"useUnknownInCatchVariables": true /* Default catch clause variables as 'unknown' instead of 'any'. */,
|
|
||||||
"alwaysStrict": true /* Ensure 'use strict' is always emitted. */,
|
|
||||||
"noUnusedLocals": true /* Enable error reporting when local variables aren't read. */,
|
|
||||||
"noUnusedParameters": true /* Raise an error when a function parameter isn't read. */,
|
|
||||||
// "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */
|
|
||||||
"noImplicitReturns": true /* Enable error reporting for codepaths that do not explicitly return in a function. */,
|
|
||||||
// "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */
|
|
||||||
// "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */
|
|
||||||
// "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */
|
|
||||||
// "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */
|
|
||||||
"allowUnusedLabels": true /* Disable error reporting for unused labels. */,
|
|
||||||
"allowUnreachableCode": false /* Disable error reporting for unreachable code. */,
|
|
||||||
|
|
||||||
/* Completeness */
|
|
||||||
// "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */
|
|
||||||
"skipLibCheck": true /* Skip type checking all .d.ts files. */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
0
nodeJS/Learning/07/.gitignore
vendored
@ -1 +0,0 @@
|
|||||||
node_modules
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
# Use Base Image: What we are using to make Docker File, eg ubuntu container/ image, node etc
|
|
||||||
FROM node:lts-alpine
|
|
||||||
|
|
||||||
# Make Dir (make sure directory exists)
|
|
||||||
RUN mkdir -p /usr/src/app
|
|
||||||
|
|
||||||
# Set the working directory: using the correct folder
|
|
||||||
WORKDIR /usr/src/app
|
|
||||||
|
|
||||||
# Copy files into folder (no need to reinstall every single time)
|
|
||||||
COPY package.json .
|
|
||||||
|
|
||||||
# Install the dependencies
|
|
||||||
RUN yarn install
|
|
||||||
|
|
||||||
# Copy the rest of the files
|
|
||||||
COPY . .
|
|
||||||
|
|
||||||
# Expose the port
|
|
||||||
EXPOSE 3000
|
|
||||||
|
|
||||||
# Execute Command
|
|
||||||
CMD ["yarn", "dev"]
|
|
||||||
@ -1,25 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "app",
|
|
||||||
"version": "1.0.0",
|
|
||||||
"main": "index.js",
|
|
||||||
"license": "MIT",
|
|
||||||
"scripts": {
|
|
||||||
"dev": "concurrently \"nodemon --exec ts-node src/index.ts --quiet\" \"yarn sass --watch src/styles:public/css\"",
|
|
||||||
"build": "tsc && sass src/styles:public/css",
|
|
||||||
"start": "node dist/index.js"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@types/express": "^5.0.0",
|
|
||||||
"concurrently": "^9.1.2",
|
|
||||||
"nodemon": "^3.1.9",
|
|
||||||
"sass": "^1.83.0",
|
|
||||||
"ts-node": "^10.9.2",
|
|
||||||
"typescript": "^5.7.2"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"dotenv": "^16.4.7",
|
|
||||||
"ejs": "^3.1.10",
|
|
||||||
"express": "^4.21.2",
|
|
||||||
"marked": "^15.0.5"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
1509
nodeJS/Learning/07/app/pnpm-lock.yaml
generated
@ -1 +0,0 @@
|
|||||||
{"version":3,"sourceRoot":"","sources":["../../../src/styles/_variable.scss","../../../src/styles/_reset.scss","../../../src/styles/pages/blogpage.scss"],"names":[],"mappings":"AAAQ;ACCR;AAAA;AAAA;EAGC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;EACA;;;AAGD;AAAA;AAAA;AAAA;AAAA;EAKC;EACA;;;AAGD;AAAA;AAAA;AAAA;EAIC;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOC;;;AAGD;AAAA;EAEC;;;AC7CD;AACA;AAEA;AAEA;EACC;IACC;IACA;;EAED;IACC;IACA;;;AAIF;AAAA;EAEC;EACA;EACA;EACA;EAKA;EACA;;AAEA;AAAA;EACC;EACA;;AAEA;AAAA;EACC;EACA;EACA;EACA;EACA;AAmDA;;AAjDA;AAAA;EACC;EACA,OF1CI;EE2CJ,aFxCU;EEyCV;EACA;EACA;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA,aFlDQ,4BEkD0B;EAClC;EACA;EACA,OF3DG,SE2DoB;EACvB;EACA;EACA,kBF5DI,SE4D+B;EACnC;EACA;EACA;;AAEA;AAAA;EACC,kBFpEE,SEoEgC;EAClC,OFnEG,SEmEqB;;AAGzB;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBF/EE,SE+EgC;EAClC,OF9EG,SE8EqB;EACxB;EACA;;AAGD;AAAA;EACC,kBFpFG,SEoFgC;EACnC,OFvFE,SEuFqB;;AAKzB;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;EACA;EACA,aFpGO;EEqGP;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC,kBFjHC;EEkHD,OFnHC;;AEqHD;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBFzHE;EE0HF;;AAEA;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBFpIE;EEqIF,OFvIC;;AEyID;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBF5IG;EE6IH;;AAEA;AAAA;EACC;EACA;;AAML;AAAA;EACC;EACA;EACA;EACA;;AAEA;AAAA;EACC;;AAGD;AAAA;EACC,kBFrKG;EEsKH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;EACA,OFrLE;EEsLF;EACA,aFlLS;EEmLT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;EACC;EACA,OF7ME;EE8MF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aFhNO;;AEmNR;AAAA;EACC;EACA","file":"blogpage.css"}
|
|
||||||
@ -1 +0,0 @@
|
|||||||
{"version":3,"sourceRoot":"","sources":["../../../src/styles/_variable.scss","../../../src/styles/_reset.scss","../../../src/styles/pages/index%20copy.scss"],"names":[],"mappings":"AAAQ;ACCR;AAAA;AAAA;EAGC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;EACA;;;AAGD;AAAA;AAAA;AAAA;AAAA;EAKC;EACA;;;AAGD;AAAA;AAAA;AAAA;EAIC;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOC;;;AAGD;AAAA;EAEC;;;AC7CD;AACA;AAEA;AAEA;EACC;IACC;IACA;;EAED;IACC;IACA;;;AAIF;AAAA;EAEC;EACA;EACA;EACA;EAKA;EACA;;AAEA;AAAA;EACC;EACA;;AAEA;AAAA;EACC;EACA;EACA;EACA;EACA;AAmDA;;AAjDA;AAAA;EACC;EACA,OF1CI;EE2CJ,aFxCU;EEyCV;EACA;EACA;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA,aFlDQ,4BEkD0B;EAClC;EACA;EACA,OF3DG,SE2DoB;EACvB;EACA;EACA,kBF5DI,SE4D+B;EACnC;EACA;EACA;;AAEA;AAAA;EACC,kBFpEE,SEoEgC;EAClC,OFnEG,SEmEqB;;AAGzB;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBF/EE,SE+EgC;EAClC,OF9EG,SE8EqB;EACxB;EACA;;AAGD;AAAA;EACC,kBFpFG,SEoFgC;EACnC,OFvFE,SEuFqB;;AAKzB;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;EACA;EACA,aFpGO;EEqGP;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC,kBFjHC;EEkHD,OFnHC;;AEqHD;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBFzHE;EE0HF;;AAEA;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBFpIE;EEqIF,OFvIC;;AEyID;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBF5IG;EE6IH;;AAEA;AAAA;EACC;EACA;;AAML;AAAA;EACC;EACA;EACA;EACA;;AAEA;AAAA;EACC;;AAGD;AAAA;EACC,kBFrKG;EEsKH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;EACA,OFrLE;EEsLF;EACA,aFlLS;EEmLT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;EACC;EACA,OF7ME;EE8MF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aFhNO;;AEmNR;AAAA;EACC;EACA","file":"index%20copy.css"}
|
|
||||||
@ -1,271 +0,0 @@
|
|||||||
@import url("https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&family=Space+Grotesk:wght@300..700&display=swap");
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
line-height: 1.5;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
}
|
|
||||||
|
|
||||||
img,
|
|
||||||
picture,
|
|
||||||
video,
|
|
||||||
canvas,
|
|
||||||
svg {
|
|
||||||
display: block;
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
button,
|
|
||||||
textarea,
|
|
||||||
select {
|
|
||||||
font: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
p,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
#root,
|
|
||||||
#__next {
|
|
||||||
isolation: isolate;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Style each tag in an html */
|
|
||||||
/* describe to chatgpt what you want, good at css, or css reference */
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
|
||||||
@keyframes buttonEntry {
|
|
||||||
0% {
|
|
||||||
opacity: 0; /* Start invisible */
|
|
||||||
transform: translateY(30px); /* Start below the viewport */
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 1; /* Fully visible */
|
|
||||||
transform: translateY(0); /* End at its normal position */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
body,
|
|
||||||
html {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: linear-gradient(to top right, #3b3561, rgb(191.3, 187.1, 217.9));
|
|
||||||
height: 100vh;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
body .container,
|
|
||||||
html .container {
|
|
||||||
display: flex;
|
|
||||||
height: 100vh;
|
|
||||||
}
|
|
||||||
body .container .div1,
|
|
||||||
html .container .div1 {
|
|
||||||
width: 50%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
flex-direction: column;
|
|
||||||
/* General button styling */
|
|
||||||
}
|
|
||||||
body .container .div1 h1,
|
|
||||||
html .container .div1 h1 {
|
|
||||||
font-size: 60px;
|
|
||||||
color: #f7ebec;
|
|
||||||
font-family: "Lexend", serif;
|
|
||||||
font-weight: 300;
|
|
||||||
margin-top: 10vh;
|
|
||||||
padding: 0px 0px 0px 4vh;
|
|
||||||
}
|
|
||||||
body .container .div1 .read-more-btn,
|
|
||||||
html .container .div1 .read-more-btn {
|
|
||||||
display: inline-flex; /* Flex container for text and icon */
|
|
||||||
align-items: center; /* Center text and icon vertically */
|
|
||||||
justify-content: center; /* Center content horizontally */
|
|
||||||
padding: 10px 20px; /* Button padding */
|
|
||||||
font-family: "Space Grotesk", monospace; /* Font style */
|
|
||||||
font-size: 16px; /* Font size */
|
|
||||||
font-weight: bold; /* Bold text */
|
|
||||||
color: #3b3561; /* Text color */
|
|
||||||
border: 2px solid #3b3561; /* Button border */
|
|
||||||
border-radius: 30px; /* Rounded edges for the button */
|
|
||||||
background-color: #f7ebec; /* Transparent background */
|
|
||||||
cursor: pointer; /* Pointer cursor on hover */
|
|
||||||
transition: all 0.3s ease; /* Smooth transition on hover */
|
|
||||||
margin-top: 2vh; /* Space between text and next element */
|
|
||||||
}
|
|
||||||
body .container .div1 .read-more-btn:hover,
|
|
||||||
html .container .div1 .read-more-btn:hover {
|
|
||||||
background-color: #3b3561; /* Change background color on hover */
|
|
||||||
color: #f7ebec; /* Change text color on hover */
|
|
||||||
}
|
|
||||||
body .container .div1 .read-more-btn .icon,
|
|
||||||
html .container .div1 .read-more-btn .icon {
|
|
||||||
display: flex; /* Flex for the icon */
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
margin-left: 10px; /* Space between text and icon */
|
|
||||||
width: 20px; /* Icon circle width */
|
|
||||||
height: 20px; /* Icon circle height */
|
|
||||||
background-color: #3b3561; /* Circle background color */
|
|
||||||
color: #f7ebec; /* Arrow color */
|
|
||||||
border-radius: 50%; /* Make the icon circular */
|
|
||||||
transition: all 0.3s ease; /* Smooth transition on hover */
|
|
||||||
}
|
|
||||||
body .container .div1 .read-more-btn:hover .icon,
|
|
||||||
html .container .div1 .read-more-btn:hover .icon {
|
|
||||||
background-color: #f7ebec; /* Change circle background on hover */
|
|
||||||
color: #3b3561; /* Change arrow color on hover */
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons,
|
|
||||||
html .container .div1 .buttons {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: left;
|
|
||||||
justify-content: center;
|
|
||||||
gap: 10px;
|
|
||||||
padding: 20px;
|
|
||||||
padding-right: 85px;
|
|
||||||
margin-top: 2.5vh;
|
|
||||||
margin-bottom: 5vh;
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button,
|
|
||||||
html .container .div1 .buttons button {
|
|
||||||
padding: 3.5px 23px;
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: "Space Grotesk", monospace;
|
|
||||||
border: none;
|
|
||||||
border-radius: 5px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background-color 0.3s ease, transform 0.2s ease;
|
|
||||||
margin: 0px 0px 0px 70px;
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.psyc-button,
|
|
||||||
html .container .div1 .buttons button.psyc-button {
|
|
||||||
background-color: #ddbdd5;
|
|
||||||
color: #3b3561;
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.psyc-button:hover,
|
|
||||||
html .container .div1 .buttons button.psyc-button:hover {
|
|
||||||
background-color: rgb(203.66, 155.34, 191.58);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.imp-button,
|
|
||||||
html .container .div1 .buttons button.imp-button {
|
|
||||||
background-color: #4b8f8c;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.imp-button:hover,
|
|
||||||
html .container .div1 .buttons button.imp-button:hover {
|
|
||||||
background-color: rgb(57.4541284404, 109.5458715596, 107.247706422);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.spirit-button,
|
|
||||||
html .container .div1 .buttons button.spirit-button {
|
|
||||||
background-color: #f7ebec;
|
|
||||||
color: #3b3561;
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.spirit-button:hover,
|
|
||||||
html .container .div1 .buttons button.spirit-button:hover {
|
|
||||||
background-color: rgb(222.24, 220.08, 235.92);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.code-button,
|
|
||||||
html .container .div1 .buttons button.code-button {
|
|
||||||
background-color: #dd614a;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
body .container .div1 .buttons button.code-button:hover,
|
|
||||||
html .container .div1 .buttons button.code-button:hover {
|
|
||||||
background-color: rgb(205.4139534884, 64.688372093, 38.5860465116);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
body .container .div2,
|
|
||||||
html .container .div2 {
|
|
||||||
width: 50%;
|
|
||||||
padding-left: 30px;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
body .container .div2 a,
|
|
||||||
html .container .div2 a {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
body .container .div2 .entrya,
|
|
||||||
html .container .div2 .entrya {
|
|
||||||
background-color: #ddbdd5;
|
|
||||||
border-radius: 10px;
|
|
||||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
||||||
padding: 20px;
|
|
||||||
border: none;
|
|
||||||
text-align: center;
|
|
||||||
cursor: pointer;
|
|
||||||
height: 300px;
|
|
||||||
width: 300px;
|
|
||||||
margin: 32px 0px 0px 35px;
|
|
||||||
transition: transform 0.3s ease;
|
|
||||||
animation: buttonEntry 1s ease-in-out;
|
|
||||||
}
|
|
||||||
body .container .div2 .entrya h2,
|
|
||||||
html .container .div2 .entrya h2 {
|
|
||||||
font-size: 20px;
|
|
||||||
color: #3b3561;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
font-family: "Lexend", serif;
|
|
||||||
font-weight: 500;
|
|
||||||
overflow: hidden; /* Hide overflowing text */
|
|
||||||
text-overflow: ellipsis; /* Add "..." at the end of truncated text */
|
|
||||||
max-width: 250px; /* Restrict container width */
|
|
||||||
display: -webkit-box; /* Enables multi-line truncation */
|
|
||||||
-webkit-line-clamp: 1; /* Limit to 2 lines */
|
|
||||||
-webkit-box-orient: vertical; /* Vertical text orientation */
|
|
||||||
white-space: normal; /* Allow wrapping within the box */
|
|
||||||
}
|
|
||||||
body .container .div2 .entrya img,
|
|
||||||
html .container .div2 .entrya img {
|
|
||||||
height: 130px;
|
|
||||||
width: 200px; /* Set desired width */
|
|
||||||
overflow: hidden;
|
|
||||||
border-radius: 10px; /* Optional: Rounded corners */
|
|
||||||
display: block; /* Ensures it's treated as a block element */
|
|
||||||
margin: 0 auto; /* Centers the image horizontally */
|
|
||||||
}
|
|
||||||
body .container .div2 .entrya p,
|
|
||||||
html .container .div2 .entrya p {
|
|
||||||
padding: 20px 10px 0 10px;
|
|
||||||
color: #3b3561;
|
|
||||||
font-size: 0.9rem;
|
|
||||||
overflow: hidden; /* Hide overflowing text */
|
|
||||||
text-overflow: ellipsis; /* Add "..." at the end of truncated text */
|
|
||||||
max-width: 300px; /* Restrict container width */
|
|
||||||
display: -webkit-box; /* Enables multi-line truncation */
|
|
||||||
-webkit-line-clamp: 3; /* Limit to 2 lines */
|
|
||||||
-webkit-box-orient: vertical; /* Vertical text orientation */
|
|
||||||
white-space: normal; /* Allow wrapping within the box */
|
|
||||||
font-family: "Space Grotesk", monospace;
|
|
||||||
}
|
|
||||||
body .container .div2 .entrya:hover,
|
|
||||||
html .container .div2 .entrya:hover {
|
|
||||||
transform: translate(60px, 0px);
|
|
||||||
transform: translateY(-5px);
|
|
||||||
}
|
|
||||||
|
|
||||||
/*# sourceMappingURL=index.css.map */
|
|
||||||
@ -1 +0,0 @@
|
|||||||
{"version":3,"sourceRoot":"","sources":["../../../src/styles/_variable.scss","../../../src/styles/_reset.scss","../../../src/styles/pages/index.scss"],"names":[],"mappings":"AAAQ;ACCR;AAAA;AAAA;EAGC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;EACA;;;AAGD;AAAA;AAAA;AAAA;AAAA;EAKC;EACA;;;AAGD;AAAA;AAAA;AAAA;EAIC;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOC;;;AAGD;AAAA;EAEC;;;AC7CD;AACA;AAEA;AAEA;EACC;IACC;IACA;;EAED;IACC;IACA;;;AAIF;AAAA;EAEC;EACA;EACA;EACA;EAKA;EACA;;AAEA;AAAA;EACC;EACA;;AAEA;AAAA;EACC;EACA;EACA;EACA;EACA;AAmDA;;AAjDA;AAAA;EACC;EACA,OF1CI;EE2CJ,aFxCU;EEyCV;EACA;EACA;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA,aFlDQ,4BEkD0B;EAClC;EACA;EACA,OF3DG,SE2DoB;EACvB;EACA;EACA,kBF5DI,SE4D+B;EACnC;EACA;EACA;;AAEA;AAAA;EACC,kBFpEE,SEoEgC;EAClC,OFnEG,SEmEqB;;AAGzB;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBF/EE,SE+EgC;EAClC,OF9EG,SE8EqB;EACxB;EACA;;AAGD;AAAA;EACC,kBFpFG,SEoFgC;EACnC,OFvFE,SEuFqB;;AAKzB;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;EACA;EACA,aFpGO;EEqGP;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC,kBFjHC;EEkHD,OFnHC;;AEqHD;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBFzHE;EE0HF;;AAEA;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBFpIE;EEqIF,OFvIC;;AEyID;AAAA;EACC;EACA;;AAIF;AAAA;EACC,kBF5IG;EE6IH;;AAEA;AAAA;EACC;EACA;;AAML;AAAA;EACC;EACA;EACA;EACA;;AAEA;AAAA;EACC;;AAGD;AAAA;EACC,kBFrKG;EEsKH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACC;EACA,OFrLE;EEsLF;EACA,aFlLS;EEmLT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;EACC;EACA;EACA;EACA;EACA;EACA;;AAGD;AAAA;EACC;EACA,OF7ME;EE8MF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,aFhNO;;AEmNR;AAAA;EACC;EACA","file":"index.css"}
|
|
||||||
@ -1,79 +0,0 @@
|
|||||||
@import url("https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&family=Space+Grotesk:wght@300..700&display=swap");
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
line-height: 1.5;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
}
|
|
||||||
|
|
||||||
img,
|
|
||||||
picture,
|
|
||||||
video,
|
|
||||||
canvas,
|
|
||||||
svg {
|
|
||||||
display: block;
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
button,
|
|
||||||
textarea,
|
|
||||||
select {
|
|
||||||
font: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
p,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
#root,
|
|
||||||
#__next {
|
|
||||||
isolation: isolate;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Style each tag in an html */
|
|
||||||
/* describe to chatgpt what you want, good at css, or css reference */
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
|
||||||
body {
|
|
||||||
background: linear-gradient(to top right, #3b3561, rgb(191.3, 187.1, 217.9));
|
|
||||||
height: 100vh;
|
|
||||||
}
|
|
||||||
body .content {
|
|
||||||
margin: 10vh;
|
|
||||||
padding: 5vh;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
body .content .h1 {
|
|
||||||
font-family: "Lexend", serif;
|
|
||||||
}
|
|
||||||
body .content .img {
|
|
||||||
height: auto;
|
|
||||||
width: 35vh;
|
|
||||||
}
|
|
||||||
body .content .post-description {
|
|
||||||
font-family: "Space Grotesk", monospace;
|
|
||||||
}
|
|
||||||
body .content .post-content {
|
|
||||||
font-family: "Space Grotesk", monospace;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*# sourceMappingURL=post.css.map */
|
|
||||||
@ -1 +0,0 @@
|
|||||||
{"version":3,"sourceRoot":"","sources":["../../../src/styles/_variable.scss","../../../src/styles/_reset.scss","../../../src/styles/pages/post.scss"],"names":[],"mappings":"AAAQ;ACCR;AAAA;AAAA;EAGC;;;AAGD;EACC;;;AAGD;AAAA;EAEC;;;AAGD;EACC;EACA;;;AAGD;AAAA;AAAA;AAAA;AAAA;EAKC;EACA;;;AAGD;AAAA;AAAA;AAAA;EAIC;;;AAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOC;;;AAGD;AAAA;EAEC;;;AC7CD;AACA;AAEA;AAEA;EACC;EAKA;;AAEA;EACC;EACA;EACA;;AAEA;EACC,aFhBW;;AEmBZ;EACC;EACA;;AAGD;EACC,aFxBS;;AE2BV;EACC,aF5BS","file":"post.css"}
|
|
||||||
|
Before Width: | Height: | Size: 264 KiB |
|
Before Width: | Height: | Size: 1.1 MiB |
@ -1,58 +0,0 @@
|
|||||||
import dotenv from "dotenv";
|
|
||||||
dotenv.config({ path: ".env" });
|
|
||||||
|
|
||||||
import express, { Application, Request, Response } from "express";
|
|
||||||
import { marked } from "marked";
|
|
||||||
|
|
||||||
const app: Application = express();
|
|
||||||
const port: number = parseInt(process.env.PORT as string) || 3000;
|
|
||||||
|
|
||||||
//Middleware
|
|
||||||
app.use(express.json());
|
|
||||||
app.use(express.urlencoded({ extended: true }));
|
|
||||||
|
|
||||||
//Setting up for EJS
|
|
||||||
app.set("views", `./src/views`);
|
|
||||||
app.set("view engine", "ejs");
|
|
||||||
|
|
||||||
//Get strapi data
|
|
||||||
app.get("/", async (_req: Request, res: Response) => {
|
|
||||||
const postsData = await fetch(
|
|
||||||
"http://cms:1337/api/blog-posts?populate=cover_image",
|
|
||||||
{
|
|
||||||
method: "GET",
|
|
||||||
headers: {
|
|
||||||
Authorization: `Bearer ${process.env.STRAPI_BEARER_TOKEN}`,
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
},
|
|
||||||
}
|
|
||||||
).then((res) => {
|
|
||||||
return res.json();
|
|
||||||
});
|
|
||||||
|
|
||||||
res.render("index", { posts: postsData });
|
|
||||||
});
|
|
||||||
|
|
||||||
app.get("/post/:slug", async (req: Request, res: Response) => {
|
|
||||||
//anything after the colon is a variable. if you go to any website that is
|
|
||||||
const postsData = await fetch(
|
|
||||||
`http://cms:1337/api/blog-posts?filters[slug]=${req.params.slug}&populate=cover_image`,
|
|
||||||
{
|
|
||||||
method: "GET",
|
|
||||||
headers: {
|
|
||||||
Authorization: `Bearer ${process.env.STRAPI_BEARER_TOKEN}`,
|
|
||||||
},
|
|
||||||
}
|
|
||||||
).then((response) => response.json());
|
|
||||||
|
|
||||||
const markedcontent = marked(postsData.data[0].content);
|
|
||||||
|
|
||||||
res.render("post", { post: postsData.data[0], markedcontent });
|
|
||||||
});
|
|
||||||
|
|
||||||
//Static route
|
|
||||||
app.use(express.static(`${__dirname}/../public`));
|
|
||||||
|
|
||||||
app.listen(port, (): void => {
|
|
||||||
console.log(`Server is running on port ${port}`);
|
|
||||||
});
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
// Cancel all css original settings
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
line-height: 1.5;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
}
|
|
||||||
|
|
||||||
img,
|
|
||||||
picture,
|
|
||||||
video,
|
|
||||||
canvas,
|
|
||||||
svg {
|
|
||||||
display: block;
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
button,
|
|
||||||
textarea,
|
|
||||||
select {
|
|
||||||
font: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
p,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
}
|
|
||||||
|
|
||||||
#root,
|
|
||||||
#__next {
|
|
||||||
isolation: isolate;
|
|
||||||
}
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
@import url("https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&family=Space+Grotesk:wght@300..700&display=swap");
|
|
||||||
|
|
||||||
$blue: #3b3561;
|
|
||||||
$pink: #ddbdd5;
|
|
||||||
$white: #f7ebec;
|
|
||||||
$green: #4b8f8c;
|
|
||||||
$orange: #dd614a;
|
|
||||||
$font-header: "Lexend", serif;
|
|
||||||
$font-body: "Space Grotesk", monospace;
|
|
||||||
@ -1,243 +0,0 @@
|
|||||||
@use "../reset";
|
|
||||||
@use "../variable";
|
|
||||||
@use "../components/navbar";
|
|
||||||
|
|
||||||
/* Style each tag in an html */
|
|
||||||
/* describe to chatgpt what you want, good at css, or css reference */
|
|
||||||
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
|
||||||
|
|
||||||
@keyframes buttonEntry {
|
|
||||||
0% {
|
|
||||||
opacity: 0; /* Start invisible */
|
|
||||||
transform: translateY(30px); /* Start below the viewport */
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 1; /* Fully visible */
|
|
||||||
transform: translateY(0); /* End at its normal position */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
body,
|
|
||||||
html {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: linear-gradient(
|
|
||||||
to top right,
|
|
||||||
variable.$blue,
|
|
||||||
lighten(variable.$blue, 50%)
|
|
||||||
);
|
|
||||||
height: 100vh;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
height: 100vh;
|
|
||||||
|
|
||||||
.div1 {
|
|
||||||
width: 50%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 60px;
|
|
||||||
color: variable.$white;
|
|
||||||
font-family: variable.$font-header;
|
|
||||||
font-weight: 300;
|
|
||||||
margin-top: 10vh;
|
|
||||||
padding: 0px 0px 0px 4vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.read-more-btn {
|
|
||||||
display: inline-flex; /* Flex container for text and icon */
|
|
||||||
align-items: center; /* Center text and icon vertically */
|
|
||||||
justify-content: center; /* Center content horizontally */
|
|
||||||
padding: 10px 20px; /* Button padding */
|
|
||||||
font-family: variable.$font-body; /* Font style */
|
|
||||||
font-size: 16px; /* Font size */
|
|
||||||
font-weight: bold; /* Bold text */
|
|
||||||
color: variable.$blue; /* Text color */
|
|
||||||
border: 2px solid variable.$blue; /* Button border */
|
|
||||||
border-radius: 30px; /* Rounded edges for the button */
|
|
||||||
background-color: variable.$white; /* Transparent background */
|
|
||||||
cursor: pointer; /* Pointer cursor on hover */
|
|
||||||
transition: all 0.3s ease; /* Smooth transition on hover */
|
|
||||||
margin-top: 2vh; /* Space between text and next element */
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: variable.$blue; /* Change background color on hover */
|
|
||||||
color: variable.$white; /* Change text color on hover */
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
|
||||||
display: flex; /* Flex for the icon */
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
margin-left: 10px; /* Space between text and icon */
|
|
||||||
width: 20px; /* Icon circle width */
|
|
||||||
height: 20px; /* Icon circle height */
|
|
||||||
background-color: variable.$blue; /* Circle background color */
|
|
||||||
color: variable.$white; /* Arrow color */
|
|
||||||
border-radius: 50%; /* Make the icon circular */
|
|
||||||
transition: all 0.3s ease; /* Smooth transition on hover */
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover .icon {
|
|
||||||
background-color: variable.$white; /* Change circle background on hover */
|
|
||||||
color: variable.$blue; /* Change arrow color on hover */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* General button styling */
|
|
||||||
.buttons {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: left;
|
|
||||||
justify-content: center;
|
|
||||||
gap: 10px;
|
|
||||||
padding: 20px;
|
|
||||||
padding-right: 85px;
|
|
||||||
margin-top: 2.5vh;
|
|
||||||
margin-bottom: 5vh;
|
|
||||||
|
|
||||||
button {
|
|
||||||
padding: 3.5px 23px;
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
border: none;
|
|
||||||
border-radius: 5px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background-color 0.3s ease, transform 0.2s ease;
|
|
||||||
margin: 0px 0px 0px 70px;
|
|
||||||
|
|
||||||
&.psyc-button {
|
|
||||||
background-color: variable.$pink;
|
|
||||||
color: variable.$blue;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: darken(variable.$pink, 10%);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.imp-button {
|
|
||||||
background-color: variable.$green;
|
|
||||||
color: white;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: darken(variable.$green, 10%);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.spirit-button {
|
|
||||||
background-color: variable.$white;
|
|
||||||
color: variable.$blue;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: lighten(variable.$blue, 60%);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.code-button {
|
|
||||||
background-color: variable.$orange;
|
|
||||||
color: white;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: darken(variable.$orange, 10%);
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.div2 {
|
|
||||||
width: 50%;
|
|
||||||
padding-left: 30px;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
a {
|
|
||||||
text-decoration: none; // Removes the underline
|
|
||||||
}
|
|
||||||
|
|
||||||
.entrya {
|
|
||||||
background-color: variable.$pink;
|
|
||||||
border-radius: 10px;
|
|
||||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
||||||
padding: 20px;
|
|
||||||
border: none;
|
|
||||||
text-align: center;
|
|
||||||
cursor: pointer;
|
|
||||||
height: 300px;
|
|
||||||
width: 300px;
|
|
||||||
margin: 32px 0px 0px 35px;
|
|
||||||
transition: transform 0.3s ease;
|
|
||||||
animation: buttonEntry 1s ease-in-out;
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
font-size: 20px;
|
|
||||||
color: variable.$blue;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
font-family: variable.$font-header;
|
|
||||||
font-weight: 500;
|
|
||||||
overflow: hidden; /* Hide overflowing text */
|
|
||||||
text-overflow: ellipsis; /* Add "..." at the end of truncated text */
|
|
||||||
max-width: 250px; /* Restrict container width */
|
|
||||||
display: -webkit-box; /* Enables multi-line truncation */
|
|
||||||
-webkit-line-clamp: 1; /* Limit to 2 lines */
|
|
||||||
-webkit-box-orient: vertical; /* Vertical text orientation */
|
|
||||||
white-space: normal; /* Allow wrapping within the box */
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
height: 130px;
|
|
||||||
width: 200px; /* Set desired width */
|
|
||||||
overflow: hidden;
|
|
||||||
border-radius: 10px; /* Optional: Rounded corners */
|
|
||||||
display: block; /* Ensures it's treated as a block element */
|
|
||||||
margin: 0 auto; /* Centers the image horizontally */
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
padding: 20px 10px 0 10px;
|
|
||||||
color: variable.$blue;
|
|
||||||
font-size: 0.9rem;
|
|
||||||
overflow: hidden; /* Hide overflowing text */
|
|
||||||
text-overflow: ellipsis; /* Add "..." at the end of truncated text */
|
|
||||||
max-width: 300px; /* Restrict container width */
|
|
||||||
display: -webkit-box; /* Enables multi-line truncation */
|
|
||||||
-webkit-line-clamp: 3; /* Limit to 2 lines */
|
|
||||||
-webkit-box-orient: vertical; /* Vertical text orientation */
|
|
||||||
white-space: normal; /* Allow wrapping within the box */
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
transform: translate(60px, 0px);
|
|
||||||
transform: translateY(-5px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// .entryb {
|
|
||||||
// grid-area: 1 / 3 / 2 / 4;
|
|
||||||
// background-color: variable.$green;
|
|
||||||
// color: black;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// .entryc {
|
|
||||||
// border-radius: 10px;
|
|
||||||
// background-color: variable.$orange;
|
|
||||||
// color: black; }
|
|
||||||
|
|
||||||
// .entryd {
|
|
||||||
// background-color: variable.$white;
|
|
||||||
// color: black;
|
|
||||||
// border-radius: 10px;
|
|
||||||
// }
|
|
||||||
@ -1,41 +0,0 @@
|
|||||||
@use "../reset";
|
|
||||||
@use "../variable";
|
|
||||||
@use "../components/navbar";
|
|
||||||
|
|
||||||
/* Style each tag in an html */
|
|
||||||
/* describe to chatgpt what you want, good at css, or css reference */
|
|
||||||
|
|
||||||
/* font: sans-serif for headers, serif for paragraphs, mono for whatever */
|
|
||||||
|
|
||||||
body {
|
|
||||||
background: linear-gradient(
|
|
||||||
to top right,
|
|
||||||
variable.$blue,
|
|
||||||
lighten(variable.$blue, 50%)
|
|
||||||
);
|
|
||||||
height: 100vh;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
margin: 10vh;
|
|
||||||
padding: 5vh;
|
|
||||||
align-items: center;
|
|
||||||
color: variable.$blue;
|
|
||||||
|
|
||||||
.h1 {
|
|
||||||
font-family: variable.$font-header;
|
|
||||||
}
|
|
||||||
|
|
||||||
.img {
|
|
||||||
height: auto;
|
|
||||||
width: 35vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.post-description {
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
}
|
|
||||||
|
|
||||||
.post-content {
|
|
||||||
font-family: variable.$font-body;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,59 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<title>My Blog Page</title>
|
|
||||||
|
|
||||||
<link rel="icon" href="images/favicon.ico" />
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/pages/index.css" />
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<!-- https://cssgrid-generator.netlify.app/ -->
|
|
||||||
<body>
|
|
||||||
<div class="container">
|
|
||||||
<div class="div1">
|
|
||||||
<h1>This is my blog page.</h1>
|
|
||||||
<button class="read-more-btn">read more.<span class="icon">→</span></button>
|
|
||||||
<div class="buttons">
|
|
||||||
<button class="psyc-button">Psychology</button>
|
|
||||||
<button class="imp-button">Implementation Science</button>
|
|
||||||
<button class="spirit-button">Spirituality</button>
|
|
||||||
<button class="code-button">Coding</button>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="div2">
|
|
||||||
<% posts.data.forEach((post) => { %>
|
|
||||||
<a href="/post/<%= post.slug %>">
|
|
||||||
<div class="entrya">
|
|
||||||
<h2><%= post.title %></h2>
|
|
||||||
<img src="http://localhost:1337<%=post.cover_image.url%>" alt="<%= post.title %>" />
|
|
||||||
<p><%= post.description %></p>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<% }); %>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--
|
|
||||||
<button class="entryb">
|
|
||||||
<h2></h2>
|
|
||||||
<img />
|
|
||||||
<p></p>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<button class="entryc">
|
|
||||||
<h2></h2>
|
|
||||||
<img />
|
|
||||||
<p></p>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<button class="entryd">
|
|
||||||
<h2></h2>
|
|
||||||
<img />
|
|
||||||
<p></p>
|
|
||||||
</button> -->
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<title>My Blog Post</title>
|
|
||||||
|
|
||||||
<link rel="icon" href="images/favicon.ico" />
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/pages/post.css" />
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="content">
|
|
||||||
<h1><%=post.title%></h1>
|
|
||||||
<div class="post-description"><%=post.description%></div>
|
|
||||||
<img src="http://localhost:1337<%=post.cover_image.url%>" />
|
|
||||||
<div class="post-content"><%-markedcontent%></div>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -1,114 +0,0 @@
|
|||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
/* Visit https://aka.ms/tsconfig to read more about this file */
|
|
||||||
|
|
||||||
/* Projects */
|
|
||||||
// "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
|
|
||||||
// "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */
|
|
||||||
// "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */
|
|
||||||
// "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */
|
|
||||||
// "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */
|
|
||||||
// "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */
|
|
||||||
|
|
||||||
/* Language and Environment */
|
|
||||||
"target": "es2016" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
|
|
||||||
// "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */
|
|
||||||
// "jsx": "preserve", /* Specify what JSX code is generated. */
|
|
||||||
// "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */
|
|
||||||
// "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */
|
|
||||||
// "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
|
|
||||||
// "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
|
|
||||||
// "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
|
|
||||||
// "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
|
|
||||||
// "noLib": true, /* Disable including any library files, including the default lib.d.ts. */
|
|
||||||
// "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */
|
|
||||||
// "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */
|
|
||||||
|
|
||||||
/* Modules */
|
|
||||||
"module": "commonjs" /* Specify what module code is generated. */,
|
|
||||||
// "rootDir": "./src" /* Specify the root folder within your source files. */,
|
|
||||||
"moduleResolution": "node10" /* Specify how TypeScript looks up a file from a given module specifier. */,
|
|
||||||
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */
|
|
||||||
// "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */
|
|
||||||
"rootDirs": [
|
|
||||||
"./src",
|
|
||||||
"./public"
|
|
||||||
] /* Allow multiple folders to be treated as one when resolving modules. */,
|
|
||||||
// "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */
|
|
||||||
// "types": [], /* Specify type package names to be included without being referenced in a source file. */
|
|
||||||
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
|
|
||||||
// "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */
|
|
||||||
// "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */
|
|
||||||
// "rewriteRelativeImportExtensions": true, /* Rewrite '.ts', '.tsx', '.mts', and '.cts' file extensions in relative import paths to their JavaScript equivalent in output files. */
|
|
||||||
// "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */
|
|
||||||
// "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */
|
|
||||||
// "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
|
|
||||||
// "noUncheckedSideEffectImports": true, /* Check side effect imports. */
|
|
||||||
// "resolveJsonModule": true, /* Enable importing .json files. */
|
|
||||||
// "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */
|
|
||||||
// "noResolve": true, /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
|
|
||||||
|
|
||||||
/* JavaScript Support */
|
|
||||||
"allowJs": true /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */,
|
|
||||||
// "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */
|
|
||||||
// "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
|
|
||||||
|
|
||||||
/* Emit */
|
|
||||||
// "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
|
|
||||||
// "declarationMap": true, /* Create sourcemaps for d.ts files. */
|
|
||||||
// "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */
|
|
||||||
// "sourceMap": true, /* Create source map files for emitted JavaScript files. */
|
|
||||||
// "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */
|
|
||||||
// "noEmit": true, /* Disable emitting files from a compilation. */
|
|
||||||
// "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
|
|
||||||
"outDir": "./dist" /* Specify an output folder for all emitted files. */,
|
|
||||||
"removeComments": true /* Disable emitting comments. */,
|
|
||||||
// "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
|
|
||||||
// "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
|
|
||||||
// "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */
|
|
||||||
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
|
|
||||||
// "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */
|
|
||||||
// "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
|
|
||||||
// "newLine": "crlf", /* Set the newline character for emitting files. */
|
|
||||||
// "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
|
|
||||||
// "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */
|
|
||||||
// "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */
|
|
||||||
// "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */
|
|
||||||
// "declarationDir": "./", /* Specify the output directory for generated declaration files. */
|
|
||||||
|
|
||||||
/* Interop Constraints */
|
|
||||||
// "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */
|
|
||||||
// "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
|
|
||||||
// "isolatedDeclarations": true, /* Require sufficient annotation on exports so other tools can trivially generate declaration files. */
|
|
||||||
// "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */
|
|
||||||
"esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
|
|
||||||
// "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
|
|
||||||
"forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
|
|
||||||
|
|
||||||
/* Type Checking */
|
|
||||||
"strict": true /* Enable all strict type-checking options. */,
|
|
||||||
"noImplicitAny": true /* Enable error reporting for expressions and declarations with an implied 'any' type. */,
|
|
||||||
"strictNullChecks": true /* When type checking, take into account 'null' and 'undefined'. */,
|
|
||||||
"strictFunctionTypes": true /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */,
|
|
||||||
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
|
|
||||||
// "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */
|
|
||||||
"strictBuiltinIteratorReturn": true /* Built-in iterators are instantiated with a 'TReturn' type of 'undefined' instead of 'any'. */,
|
|
||||||
"noImplicitThis": true /* Enable error reporting when 'this' is given the type 'any'. */,
|
|
||||||
"useUnknownInCatchVariables": true /* Default catch clause variables as 'unknown' instead of 'any'. */,
|
|
||||||
"alwaysStrict": true /* Ensure 'use strict' is always emitted. */,
|
|
||||||
"noUnusedLocals": true /* Enable error reporting when local variables aren't read. */,
|
|
||||||
"noUnusedParameters": true /* Raise an error when a function parameter isn't read. */,
|
|
||||||
// "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */
|
|
||||||
"noImplicitReturns": true /* Enable error reporting for codepaths that do not explicitly return in a function. */,
|
|
||||||
// "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */
|
|
||||||
// "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */
|
|
||||||
// "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */
|
|
||||||
// "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */
|
|
||||||
"allowUnusedLabels": true /* Disable error reporting for unused labels. */,
|
|
||||||
"allowUnreachableCode": false /* Disable error reporting for unreachable code. */,
|
|
||||||
|
|
||||||
/* Completeness */
|
|
||||||
// "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */
|
|
||||||
"skipLibCheck": true /* Skip type checking all .d.ts files. */
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1 +0,0 @@
|
|||||||
node_modules
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
HOST=0.0.0.0
|
|
||||||
PORT=1337
|
|
||||||
APP_KEYS="toBeModified1,toBeModified2"
|
|
||||||
API_TOKEN_SALT=tobemodified
|
|
||||||
ADMIN_JWT_SECRET=tobemodified
|
|
||||||
TRANSFER_TOKEN_SALT=tobemodified
|
|
||||||
JWT_SECRET=tobemodified
|
|
||||||
@ -1,38 +0,0 @@
|
|||||||
# Use Debian-based Node image for better compatibility with native modules
|
|
||||||
FROM node:18
|
|
||||||
|
|
||||||
# Install necessary dependencies for sharp and other native modules
|
|
||||||
RUN apt-get update && apt-get install -y \
|
|
||||||
build-essential \
|
|
||||||
libvips-dev \
|
|
||||||
git \
|
|
||||||
python3 \
|
|
||||||
&& apt-get clean \
|
|
||||||
&& rm -rf /var/lib/apt/lists/*
|
|
||||||
|
|
||||||
# Set environment variables
|
|
||||||
ENV NODE_ENV=development
|
|
||||||
|
|
||||||
# Set working directory for dependency installation
|
|
||||||
WORKDIR /opt/app
|
|
||||||
|
|
||||||
# Copy package.json and yarn.lock files to the container
|
|
||||||
COPY package.json yarn.lock ./
|
|
||||||
|
|
||||||
# Install dependencies
|
|
||||||
RUN yarn install --frozen-lockfile
|
|
||||||
|
|
||||||
# Copy the rest of the application code
|
|
||||||
COPY . .
|
|
||||||
|
|
||||||
# Change ownership to the node user
|
|
||||||
RUN chown -R node:node /opt/app
|
|
||||||
|
|
||||||
# Use non-root user
|
|
||||||
USER node
|
|
||||||
|
|
||||||
# Expose the application port
|
|
||||||
EXPOSE 1337
|
|
||||||
|
|
||||||
# Command to run the Strapi application
|
|
||||||
CMD ["yarn", "develop"]
|
|
||||||
@ -1,61 +0,0 @@
|
|||||||
# 🚀 Getting started with Strapi
|
|
||||||
|
|
||||||
Strapi comes with a full featured [Command Line Interface](https://docs.strapi.io/dev-docs/cli) (CLI) which lets you scaffold and manage your project in seconds.
|
|
||||||
|
|
||||||
### `develop`
|
|
||||||
|
|
||||||
Start your Strapi application with autoReload enabled. [Learn more](https://docs.strapi.io/dev-docs/cli#strapi-develop)
|
|
||||||
|
|
||||||
```
|
|
||||||
npm run develop
|
|
||||||
# or
|
|
||||||
yarn develop
|
|
||||||
```
|
|
||||||
|
|
||||||
### `start`
|
|
||||||
|
|
||||||
Start your Strapi application with autoReload disabled. [Learn more](https://docs.strapi.io/dev-docs/cli#strapi-start)
|
|
||||||
|
|
||||||
```
|
|
||||||
npm run start
|
|
||||||
# or
|
|
||||||
yarn start
|
|
||||||
```
|
|
||||||
|
|
||||||
### `build`
|
|
||||||
|
|
||||||
Build your admin panel. [Learn more](https://docs.strapi.io/dev-docs/cli#strapi-build)
|
|
||||||
|
|
||||||
```
|
|
||||||
npm run build
|
|
||||||
# or
|
|
||||||
yarn build
|
|
||||||
```
|
|
||||||
|
|
||||||
## ⚙️ Deployment
|
|
||||||
|
|
||||||
Strapi gives you many possible deployment options for your project including [Strapi Cloud](https://cloud.strapi.io). Browse the [deployment section of the documentation](https://docs.strapi.io/dev-docs/deployment) to find the best solution for your use case.
|
|
||||||
|
|
||||||
```
|
|
||||||
yarn strapi deploy
|
|
||||||
```
|
|
||||||
|
|
||||||
## 📚 Learn more
|
|
||||||
|
|
||||||
- [Resource center](https://strapi.io/resource-center) - Strapi resource center.
|
|
||||||
- [Strapi documentation](https://docs.strapi.io) - Official Strapi documentation.
|
|
||||||
- [Strapi tutorials](https://strapi.io/tutorials) - List of tutorials made by the core team and the community.
|
|
||||||
- [Strapi blog](https://strapi.io/blog) - Official Strapi blog containing articles made by the Strapi team and the community.
|
|
||||||
- [Changelog](https://strapi.io/changelog) - Find out about the Strapi product updates, new features and general improvements.
|
|
||||||
|
|
||||||
Feel free to check out the [Strapi GitHub repository](https://github.com/strapi/strapi). Your feedback and contributions are welcome!
|
|
||||||
|
|
||||||
## ✨ Community
|
|
||||||
|
|
||||||
- [Discord](https://discord.strapi.io) - Come chat with the Strapi community including the core team.
|
|
||||||
- [Forum](https://forum.strapi.io/) - Place to discuss, ask questions and find answers, show your Strapi project and get feedback or just talk with other Community members.
|
|
||||||
- [Awesome Strapi](https://github.com/strapi/awesome-strapi) - A curated list of awesome things related to Strapi.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
<sub>🤫 Psst! [Strapi is hiring](https://strapi.io/careers).</sub>
|
|
||||||
@ -1,17 +0,0 @@
|
|||||||
export default ({ env }) => ({
|
|
||||||
auth: {
|
|
||||||
secret: env('ADMIN_JWT_SECRET'),
|
|
||||||
},
|
|
||||||
apiToken: {
|
|
||||||
salt: env('API_TOKEN_SALT'),
|
|
||||||
},
|
|
||||||
transfer: {
|
|
||||||
token: {
|
|
||||||
salt: env('TRANSFER_TOKEN_SALT'),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
flags: {
|
|
||||||
nps: env.bool('FLAG_NPS', true),
|
|
||||||
promoteEE: env.bool('FLAG_PROMOTE_EE', true),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
export default {
|
|
||||||
rest: {
|
|
||||||
defaultLimit: 25,
|
|
||||||
maxLimit: 100,
|
|
||||||
withCount: true,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
@ -1,60 +0,0 @@
|
|||||||
import path from 'path';
|
|
||||||
|
|
||||||
export default ({ env }) => {
|
|
||||||
const client = env('DATABASE_CLIENT', 'sqlite');
|
|
||||||
|
|
||||||
const connections = {
|
|
||||||
mysql: {
|
|
||||||
connection: {
|
|
||||||
host: env('DATABASE_HOST', 'localhost'),
|
|
||||||
port: env.int('DATABASE_PORT', 3306),
|
|
||||||
database: env('DATABASE_NAME', 'strapi'),
|
|
||||||
user: env('DATABASE_USERNAME', 'strapi'),
|
|
||||||
password: env('DATABASE_PASSWORD', 'strapi'),
|
|
||||||
ssl: env.bool('DATABASE_SSL', false) && {
|
|
||||||
key: env('DATABASE_SSL_KEY', undefined),
|
|
||||||
cert: env('DATABASE_SSL_CERT', undefined),
|
|
||||||
ca: env('DATABASE_SSL_CA', undefined),
|
|
||||||
capath: env('DATABASE_SSL_CAPATH', undefined),
|
|
||||||
cipher: env('DATABASE_SSL_CIPHER', undefined),
|
|
||||||
rejectUnauthorized: env.bool('DATABASE_SSL_REJECT_UNAUTHORIZED', true),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
pool: { min: env.int('DATABASE_POOL_MIN', 2), max: env.int('DATABASE_POOL_MAX', 10) },
|
|
||||||
},
|
|
||||||
postgres: {
|
|
||||||
connection: {
|
|
||||||
connectionString: env('DATABASE_URL'),
|
|
||||||
host: env('DATABASE_HOST', 'localhost'),
|
|
||||||
port: env.int('DATABASE_PORT', 5432),
|
|
||||||
database: env('DATABASE_NAME', 'strapi'),
|
|
||||||
user: env('DATABASE_USERNAME', 'strapi'),
|
|
||||||
password: env('DATABASE_PASSWORD', 'strapi'),
|
|
||||||
ssl: env.bool('DATABASE_SSL', false) && {
|
|
||||||
key: env('DATABASE_SSL_KEY', undefined),
|
|
||||||
cert: env('DATABASE_SSL_CERT', undefined),
|
|
||||||
ca: env('DATABASE_SSL_CA', undefined),
|
|
||||||
capath: env('DATABASE_SSL_CAPATH', undefined),
|
|
||||||
cipher: env('DATABASE_SSL_CIPHER', undefined),
|
|
||||||
rejectUnauthorized: env.bool('DATABASE_SSL_REJECT_UNAUTHORIZED', true),
|
|
||||||
},
|
|
||||||
schema: env('DATABASE_SCHEMA', 'public'),
|
|
||||||
},
|
|
||||||
pool: { min: env.int('DATABASE_POOL_MIN', 2), max: env.int('DATABASE_POOL_MAX', 10) },
|
|
||||||
},
|
|
||||||
sqlite: {
|
|
||||||
connection: {
|
|
||||||
filename: path.join(__dirname, '..', '..', env('DATABASE_FILENAME', '.tmp/data.db')),
|
|
||||||
},
|
|
||||||
useNullAsDefault: true,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
return {
|
|
||||||
connection: {
|
|
||||||
client,
|
|
||||||
...connections[client],
|
|
||||||
acquireConnectionTimeout: env.int('DATABASE_CONNECTION_TIMEOUT', 60000),
|
|
||||||
},
|
|
||||||
};
|
|
||||||
};
|
|
||||||
@ -1,12 +0,0 @@
|
|||||||
export default [
|
|
||||||
'strapi::logger',
|
|
||||||
'strapi::errors',
|
|
||||||
'strapi::security',
|
|
||||||
'strapi::cors',
|
|
||||||
'strapi::poweredBy',
|
|
||||||
'strapi::query',
|
|
||||||
'strapi::body',
|
|
||||||
'strapi::session',
|
|
||||||
'strapi::favicon',
|
|
||||||
'strapi::public',
|
|
||||||
];
|
|
||||||
@ -1 +0,0 @@
|
|||||||
export default () => ({});
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
export default ({ env }) => ({
|
|
||||||
host: env('HOST', '0.0.0.0'),
|
|
||||||
port: env.int('PORT', 1337),
|
|
||||||
app: {
|
|
||||||
keys: env.array('APP_KEYS'),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
@ -1,36 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "blog",
|
|
||||||
"version": "0.1.0",
|
|
||||||
"private": true,
|
|
||||||
"description": "A Strapi application",
|
|
||||||
"scripts": {
|
|
||||||
"build": "strapi build",
|
|
||||||
"deploy": "strapi deploy",
|
|
||||||
"develop": "strapi develop",
|
|
||||||
"start": "strapi start",
|
|
||||||
"strapi": "strapi"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"@strapi/plugin-cloud": "5.6.0",
|
|
||||||
"@strapi/plugin-users-permissions": "5.6.0",
|
|
||||||
"@strapi/strapi": "5.6.0",
|
|
||||||
"pg": "8.8.0",
|
|
||||||
"react": "^18.0.0",
|
|
||||||
"react-dom": "^18.0.0",
|
|
||||||
"react-router-dom": "^6.0.0",
|
|
||||||
"styled-components": "^6.0.0"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@types/node": "^20",
|
|
||||||
"@types/react": "^18",
|
|
||||||
"@types/react-dom": "^18",
|
|
||||||
"typescript": "^5"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=18.0.0 <=22.x.x",
|
|
||||||
"npm": ">=6.0.0"
|
|
||||||
},
|
|
||||||
"strapi": {
|
|
||||||
"uuid": "8b109ca4-55e3-4342-b0da-0ad7eb69ffd6"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,3 +0,0 @@
|
|||||||
# To prevent search engines from seeing the site altogether, uncomment the next two lines:
|
|
||||||
# User-Agent: *
|
|
||||||
# Disallow: /
|
|
||||||
|
Before Width: | Height: | Size: 408 KiB |
|
Before Width: | Height: | Size: 38 KiB |
|
Before Width: | Height: | Size: 584 KiB |
|
Before Width: | Height: | Size: 124 KiB |
|
Before Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 79 KiB |
|
Before Width: | Height: | Size: 88 KiB |
|
Before Width: | Height: | Size: 91 KiB |
|
Before Width: | Height: | Size: 1.3 MiB |
|
Before Width: | Height: | Size: 912 KiB |
|
Before Width: | Height: | Size: 71 KiB |
|
Before Width: | Height: | Size: 50 KiB |
|
Before Width: | Height: | Size: 53 KiB |
|
Before Width: | Height: | Size: 57 KiB |
|
Before Width: | Height: | Size: 823 KiB |
|
Before Width: | Height: | Size: 520 KiB |
|
Before Width: | Height: | Size: 831 KiB |
|
Before Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 31 KiB |
|
Before Width: | Height: | Size: 378 KiB |
|
Before Width: | Height: | Size: 249 KiB |
|
Before Width: | Height: | Size: 393 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 9.1 KiB |
|
Before Width: | Height: | Size: 7.0 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 94 KiB |
|
Before Width: | Height: | Size: 70 KiB |
|
Before Width: | Height: | Size: 2.0 MiB |
@ -1,37 +0,0 @@
|
|||||||
import type { StrapiApp } from '@strapi/strapi/admin';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
config: {
|
|
||||||
locales: [
|
|
||||||
// 'ar',
|
|
||||||
// 'fr',
|
|
||||||
// 'cs',
|
|
||||||
// 'de',
|
|
||||||
// 'dk',
|
|
||||||
// 'es',
|
|
||||||
// 'he',
|
|
||||||
// 'id',
|
|
||||||
// 'it',
|
|
||||||
// 'ja',
|
|
||||||
// 'ko',
|
|
||||||
// 'ms',
|
|
||||||
// 'nl',
|
|
||||||
// 'no',
|
|
||||||
// 'pl',
|
|
||||||
// 'pt-BR',
|
|
||||||
// 'pt',
|
|
||||||
// 'ru',
|
|
||||||
// 'sk',
|
|
||||||
// 'sv',
|
|
||||||
// 'th',
|
|
||||||
// 'tr',
|
|
||||||
// 'uk',
|
|
||||||
// 'vi',
|
|
||||||
// 'zh-Hans',
|
|
||||||
// 'zh',
|
|
||||||
],
|
|
||||||
},
|
|
||||||
bootstrap(app: StrapiApp) {
|
|
||||||
console.log(app);
|
|
||||||
},
|
|
||||||
};
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
"target": "ESNext",
|
|
||||||
"module": "ESNext",
|
|
||||||
"moduleResolution": "Bundler",
|
|
||||||
"useDefineForClassFields": true,
|
|
||||||
"lib": ["DOM", "DOM.Iterable", "ESNext"],
|
|
||||||
"allowJs": false,
|
|
||||||
"skipLibCheck": true,
|
|
||||||
"esModuleInterop": true,
|
|
||||||
"allowSyntheticDefaultImports": true,
|
|
||||||
"strict": true,
|
|
||||||
"forceConsistentCasingInFileNames": true,
|
|
||||||
"resolveJsonModule": true,
|
|
||||||
"noEmit": true,
|
|
||||||
"jsx": "react-jsx"
|
|
||||||
},
|
|
||||||
"include": ["../plugins/**/admin/src/**/*", "./"],
|
|
||||||
"exclude": ["node_modules/", "build/", "dist/", "**/*.test.ts"]
|
|
||||||
}
|
|
||||||
@ -1,12 +0,0 @@
|
|||||||
import { mergeConfig, type UserConfig } from 'vite';
|
|
||||||
|
|
||||||
export default (config: UserConfig) => {
|
|
||||||
// Important: always return the modified config
|
|
||||||
return mergeConfig(config, {
|
|
||||||
resolve: {
|
|
||||||
alias: {
|
|
||||||
'@': '/src',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
};
|
|
||||||