Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

node lesson1-modules-file system #221

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
89 changes: 89 additions & 0 deletions 1-node-farm/starter/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
const fs = require("fs");
const http = require("http");
const url = require("url");
///////////////////////
////////// FILES
// const hello = "hello world";
// // const textIn = fs.readFileSync("./txt/input.txt", "utf-8"); // readFileSync("./path","") takes two arguments, first one is reading file we want,second is character encoding
// //BLOCKING SYNCHRONOUS CODES LINES 4-10
// console.log(textIn);
// const textOut = `About avocado ${textIn}.\n Created on ${Date.now()}`;
// fs.writeFileSync("./txt/output.txt", textOut); // writeFileSync("./path","text") takes two arguments, first one is the path to the file where the data will be written, second is the data that will be written to the file. if first data doesn't exist writeFileSync create a new file.
// const readTextOut = fs.readFileSync("./txt/output.txt", "utf-8");
// console.log(readTextOut);

// NON-BLOCKING ASYNCHRONOUS CODES
// fs.readFile("./txt/start.txt", "utf-8", (err, data1) => {
// console.log(data1); // the output will be read-this
// fs.readFile(`./txt/${data1}.txt`, "utf-8", (err, data2) => {
// console.log(data2); // the output will be the content of read-this.txt
// fs.readFile("./txt/append.txt", "utf-8", (err, data3) => {
// console.log(data3); // the output will be the content of append.txt
// fs.writeFile("./txt/final.txt", `${data2}\n${data3}`, "utf-8", (err) => {
// console.log("Your file has been written"); // content of final.txt will be data2(content of read-this.txt)+data3(content of append.txt)
// });
// });
// });
// });
// console.log("will read file...");

///////////////////////
////////// SERVER
const replaceTemplate = (temp, product) => {
let output = temp
.replace(/{%PRODUCTNAME%}/g, product.productName)
.replace(/{%IMAGE%}/g, product.image)
.replace(/{%FROM%}/g, product.from)
.replace(/{%NUTRIENTS%}/g, product.nutrients)
.replace(/{%QUANTITY%}/g, product.quantity)
.replace(/{%PRICE%}/g, product.price);
if (!product.organic)
output = output.replace(/{%NOT_ORGANIC%}/g, "not-organic");
output = output
.replace(/{%ID%}/g, product.id)
.replace(/{%DESCRIPTION%}/g, product.description);
return output;
};
const data = fs.readFileSync(`${__dirname}/dev-data/data.json`, "utf-8");
const dataObj = JSON.parse(data);
const tempCard = fs.readFileSync("./templates/template-card.html", "utf-8");
const tempProduct = fs.readFileSync(
"./templates/template-product.html",
"utf-8"
);
const tempOverview = fs.readFileSync(
"./templates/template-overview.html",
"utf-8"
);

const server = http.createServer((req, res) => {
const { query, pathname } = url.parse(req.url, true);

if (pathname === "/" || pathname === "/overview") {
res.writeHead(200, { "Content-type": "text/html" });
const cardsHtml = dataObj
.map((el) => replaceTemplate(tempCard, el))
.join("");
const output = tempOverview.replace("{%PRODUCT_CARDS%}", cardsHtml);
res.end(output);
} else if (pathname === "/product") {
res.writeHead(200, { "Content-type": "text/html" });
const product = dataObj[query.id];
const output = replaceTemplate(tempProduct, product);
res.end(output);
} else if (pathname === "/api") {
res.writeHead(200, { "Content-type": "application/json" }); //for JSON format
res.end(data);
} else {
res.writeHead(404, {
"Content-type": "text/html", //browser expecting some HTML
"my-own-header": "hello-world", //Created my own header
});
res.end("<h1>Page not found...</h1>");
}
//res.end("Hello from the server!"); // when a request is received, the server will respond with the message
}); // create an HTTP server

server.listen(8000, "127.0.0.1", () => {
console.log("Listening to requests on port 8000"); // callback function runs when listening start
}); //will start listening for incoming requests(starting up the server)
24 changes: 24 additions & 0 deletions 1-node-farm/starter/templates/template-card.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<figure class="card">
<div class="card__emoji">{%IMAGE%}</div>
<div class="card__title-box">
<h2 class="card__title">{%PRODUCTNAME%}</h2>
</div>

<div class="card__details">
<div class="card__detail-box {%NOT_ORGANIC%}">
<h6 class="card__detail card__detail--organic">Organic!</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail">{%QUANTITY%} per 📦</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail card__detail--price">{%PRICE%}€</h6>
</div>
</div>

<a class="card__link" href="/product?id={%ID%}">
<span>Detail <i class="emoji-right">👉</i></span>
</a>
</figure>
Original file line number Diff line number Diff line change
Expand Up @@ -192,123 +192,7 @@
<h1>🌽 Node Farm 🥦</h1>

<div class="cards-container">
<figure class="card">
<div class="card__emoji">🥑🥑</div>

<div class="card__title-box">
<h2 class="card__title">Fresh Avocado</h2>
</div>

<div class="card__details">
<div class="card__detail-box">
<h6 class="card__detail card__detail--organic">Organic!</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail">4 🥑 per 📦</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail card__detail--price">6.50€</h6>
</div>
</div>

<a class="card__link" href="#">
<span>Detail <i class="emoji-right">👉</i></span>
</a>
</figure>

<figure class="card">
<div class="card__emoji">🧀🧀</div>
<div class="card__title-box">
<h2 class="card__title">Goat and Sheep Cheese</h2>
</div>

<div class="card__details">
<div class="card__detail-box">
<h6 class="card__detail">250g per 📦</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail card__detail--price">5.00€</h6>
</div>
</div>

<a class="card__link" href="#">
<span>Detail <i class="emoji-right">👉</i></span>
</a>
</figure>

<figure class="card">
<div class="card__emoji">🥦🥦</div>
<div class="card__title-box">
<h2 class="card__title">Apollo Broccoli</h2>
</div>

<div class="card__details">
<div class="card__detail-box">
<h6 class="card__detail card__detail--organic">Organic!</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail">3 🥦 per 📦</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail card__detail--price">5.50€</h6>
</div>
</div>

<a class="card__link" href="#">
<span>Detail <i class="emoji-right">👉</i></span>
</a>
</figure>

<figure class="card">
<div class="card__emoji">🥕🥕</div>
<div class="card__title-box">
<h2 class="card__title">Baby Carrots</h2>
</div>

<div class="card__details">
<div class="card__detail-box">
<h6 class="card__detail card__detail--organic">Organic!</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail">20 🥕 per 📦</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail card__detail--price">3.00€</h6>
</div>
</div>

<a class="card__link" href="#">
<span>Detail <i class="emoji-right">👉</i></span>
</a>
</figure>

<figure class="card">
<div class="card__emoji">🌽🌽</div>
<div class="card__title-box">
<h2 class="card__title">Sweet Corncobs</h2>
</div>

<div class="card__details">
<div class="card__detail-box">
<h6 class="card__detail">2 🌽 per 📦</h6>
</div>

<div class="card__detail-box">
<h6 class="card__detail card__detail--price">2.00€</h6>
</div>
</div>

<a class="card__link" href="#">
<span>Detail <i class="emoji-right">👉</i></span>
</a>
</figure>
{%PRODUCT_CARDS%}
</div>
</div>
</body>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
href="https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/240/apple/155/ear-of-maize_1f33d.png"
/>

<title>Fresh Avocados 🥑 /// NODE FARM</title>
<title>{%PRODUCTNAME%} {%IMAGE%} /// NODE FARM</title>

<style>
*,
Expand Down Expand Up @@ -270,44 +270,36 @@
<h1>🌽 Node Farm 🥦</h1>

<figure class="product">
<div class="product__organic"><h5>Organic</h5></div>
<a href="#" class="product__back">
<div class="product__organic {%NOT_ORGANIC%}"><h5>Organic</h5></div>
<a href="/overview" class="product__back">
<span class="emoji-left">👈</span>Back
</a>
<div class="product__hero">
<span class="product__emoji product__emoji--1">🥑</span>
<span class="product__emoji product__emoji--2">🥑</span>
<span class="product__emoji product__emoji--3">🥑</span>
<span class="product__emoji product__emoji--4">🥑</span>
<span class="product__emoji product__emoji--5">🥑</span>
<span class="product__emoji product__emoji--6">🥑</span>
<span class="product__emoji product__emoji--7">🥑</span>
<span class="product__emoji product__emoji--8">🥑</span>
<span class="product__emoji product__emoji--9">🥑</span>
<span class="product__emoji product__emoji--1">{%IMAGE%}</span>
<span class="product__emoji product__emoji--2">{%IMAGE%}</span>
<span class="product__emoji product__emoji--3">{%IMAGE%}</span>
<span class="product__emoji product__emoji--4">{%IMAGE%}</span>
<span class="product__emoji product__emoji--5">{%IMAGE%}</span>
<span class="product__emoji product__emoji--6">{%IMAGE%}</span>
<span class="product__emoji product__emoji--7">{%IMAGE%}</span>
<span class="product__emoji product__emoji--8">{%IMAGE%}</span>
<span class="product__emoji product__emoji--9">{%IMAGE%}</span>
</div>
<h2 class="product__name">Fresh Avocados</h2>
<h2 class="product__name">{%PRODUCTNAME%}</h2>
<div class="product__details">
<p><span class="emoji-left">🌍</span> From Portugal</p>
<p><span class="emoji-left">❤️</span> Vitamin B, Vitamin K</p>
<p><span class="emoji-left">📦</span> 4 🥑</p>
<p><span class="emoji-left">🏷</span> 6.50€</p>
<p><span class="emoji-left">🌍</span>From {%FROM%}</p>
<p><span class="emoji-left">❤️</span>{%NUTRIENTS%}</p>
<p><span class="emoji-left">📦</span>{%QUANTITY%}</p>
<p><span class="emoji-left">🏷</span>{%PRICE%}€</p>
</div>

<a href="#" class="product__link">
<span class="emoji-left">🛒</span>
<span>Add to shopping card (6.50€)</span>
<span>Add to shopping card ({%PRICE%}€)</span>
</a>

<p class="product__description">
A ripe avocado yields to gentle pressure when held in the palm of the
hand and squeezed. The fruit is not sweet, but distinctly and subtly
flavored, with smooth texture. The avocado is popular in vegetarian
cuisine as a substitute for meats in sandwiches and salads because of
its high fat content. Generally, avocado is served raw, though some
cultivars, including the common 'Hass', can be cooked for a short time
without becoming bitter. It is used as the base for the Mexican dip
known as guacamole, as well as a spread on corn tortillas or toast,
served with spices.
{%DESCRIPTION%}
</p>
</figure>

Expand Down
2 changes: 2 additions & 0 deletions 1-node-farm/starter/txt/output.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
About avocado undefined.
Created on 1709477832155