Я в основном хочу использовать ExpressJS / NodeJS, чтобы использовать JSON в качестве файла для создания веб-сайтов. Это будет использовать JSON, HTML и CSS. Я хочу узнать, как автоматизировать JSON файлы до HTML через ExpressJS
Мой HTML Код
body {
font-family: 'Open Sans', sans-serif;
font-size: 14px;
}
footer {
/* place on the bottom */
/* position: sticky; */
bottom: 0;
left: 0;
width: 100%;
background: #ec8549;
display: grid;
place-items: center;
padding: 50px;
}
footer .footerItems {
font-size: 20px;
bottom: 0;
}
.section {
padding: 0.5%;
border: 2.5px solid #00ff6a;
display: flex;
margin-bottom: 5%;
margin: 3%;
}
.bulletPointMore {
list-style-position: inside;
}
.connectingText {
vertical-align: top;
display: inline-block;
padding-right: 2.5%;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="section">
<h2 class="titles">Investments Decisions</h2>
<ul>
<li>Investment: Putting money into something in order to make a profit. Can be undertaken by government, business and individuals.</li>
<li>Superannuation: An employer putting money into a superannuation fund so an employee has money in retirement.</li>
</ul>
</div>
<div class="section">
<h2 class="titles">What to consider when making investment decisions</h2>
<ul>
<li>Risk is the degree of uncertainty about expected returns (and the possibility of loss).</li>
<li>Risk is the chance an investment won’t give you the outcomes you want.</li>
<li>Some individuals can tolerate more risk than others (usually based on their income and wealth).</li>
<li>Rate of return is the overall earning (after taxes) that you might expect from investments. (income, interest, dividends, capital gains/losses)</li>
<li>Liquidity - how easily an investment can be turned into cash.</li>
<div class="bulletPointMore">
<li> More liquid (more easily converted into cash) eg.</li>
<li> Less liquid (less easily converted into cash) eg.</li>
</div>
<li>Diversification - reducing risk by spreading money among various types of investments. Having a portfolio of investments eg, shares and property.</li>
</ul>
</div>
<div class="section">
<div class="connectingText">
<h2 class="titles">Who can invest?</h2>
<ul>
<li>Individuals</li>
<li>Businesses/Institutions</li>
<li>Governetment</li>
</ul>
</div>
<div class="connectingText">
<h2 class="titles">Why do they invest?</h2>
<ul>
<li>In order to achieve a financial goal…</li>
<li>To increase efficiency and profitability</li>
<li>Invest to ensure that a country increases its equality of life, economic prosperity or is competitive.</li>
</ul>
</div>
</div>
<div class="section">
<h2 class="titles">Assessment Task</h2>
<ul>
<li>First decision to make before answering questions is to determine how you will divide the $500,000 into the three investment options of:</li>
<li>Bank term deposit</li>
<div class="bulletPointMore">
<li>Shares</li>
<li>Property</li>
</div>
<li>Begin researching properties first as it will be the most expensive option. Eg. if buying a $600,000 property. You will need to spend $300,000 out of the $500,000. Then get a bank loan for the other $300,000.</li>
</ul>
</div>
<footer>
<div class="footerItems">
<p>52 ©</p>
</div>
</footer>
</body>
</html>
Что я имею в виду в JSON файле. Это автоматизирует процесс для меня, если я захочу добавить больше заметок.
[
{
"id": 0,
"Title": "Title",
"BulletPoint1": "Text",
"BulletPoint2": "Text"
},
{
"id": 1,
"Title": "Title",
"BulletPoint1": "Text",
"BulletPoint2": {
"BulletPoint1": "Text",
"BulletPoint2": "Text"
}
}
]