Blog? What is it?
A blog (a truncation of "weblog") is a discussion or informational website published on the World Wide Web consisting of discrete, often informal diary-style text entries (posts). Posts are typically displayed in reverse chronological order, so that the most recent post appears first, at the top of the web page. Until 2009, blogs were usually the work of a single individual, occasionally of a small group, and often covered a single subject or topic. In the 2010s, "multi-author blogs" (MABs) emerged, featuring the writing of multiple authors and sometimes professionally edited. MABs from newspapers, other media outlets, universities, think tanks, advocacy groups, and similar institutions account for an increasing quantity of blog traffic. The rise of Twitter and other "microblogging" systems helps integrate MABs and single-author blogs into the news media. Blog can also be used as a verb, meaning to maintain or add content to a blog.
Ah, something like Blogger and Wordpress?
Yup, Blogger and Wordpress is two of many services in internet that can give you free static blog hosting.
Why you don't use them?
On the average, free static blog hosting only serve static html file, their service is also difficult to customize.
So, what techology you use for make your blog?
Node.js, Express, and Some file based database engine. Why? Because it's simple and easy for beginner.
Start coding.
Of course, before we start, we need to install some module for our project.
At first, lets install express:
npm i express
Now, install ejs for the view-engine:
npm i ejs
Next, lets install the database engine:
npm i simple-json-db
After install all module that we need, Let's start our project!
Make a file with name blog.js, and add this content:
// Declare express
const express = require('express');
// Declare database and requitment
const JSONdb = require('simple-json-db');
const db = new JSONdb('database.json');
// Declare port
const app = express();
const port = 4040;
// Set view engine
app.set('view engine', 'ejs');
// Set main page
app.get('/', (req, res) => {
app.locals.title = db.get('title');
app.locals.postUrl = db.get('posturl');
res.render('index');
})
// Set blog page
app.get('/post/:posturl', (req, res) => {
postUrl = req.params.posturl;
dbIndex = db.get('posturl').indexOf(postUrl);
if (dbIndex != -1) {
app.locals.title = db.get('title')[dbIndex];
app.locals.content = db.get('content')[dbIndex];
res.render('post');
} else {
res.send('Page not found :(')
}
});
// Run app
app.listen(port, () => {
console.log('App is live');
});
After that, let's make the content for our page. Make a directory named views, and create the file named index.ejs and fill with this code:
<html>
<head>
<title>Index Page</title>
</head>
<body>
<h1>Welcome to my blog!</h1>
<p>Content: </p>
<% if (title.length != 0) { %>
<% for (x = 0; x <= title.length - 1; x++) {%>
<a href = "/post/<%= postUrl[x] %>"><%= title[x] %></a>
<% } %>
<% } else { %>
<p>Nothing here</p>
<% } %>
</body>
</html>
After that, let's build the blog-post page, with the file named blog.ejs. Fill with this code:
<html>
<head>
<title><%= title %></title>
</head>
<body>
<a href = "/">Back to home</a>
<h1><%= title %></h1>
<p><%= content %></p>
</body>
</html>
Last, we need a file named database.json for our database. Fill the database.json with this content:
{
"title": ["Hello world"],
"posturl": ["test"],
"content": ["My first blog post"]
}
Final directory structure:
Run this blog using this command:
node blog.js
Wait until it's log
App is live
Then, open your browser and type: http://localhost:4040
Here is the preview:
Yay, We have built our simple blog!
Top comments (0)