Sunday , 17 December 2017
Home / Programming / JavaScript / Node.js / Displaying Blog Posts – Node.js Tutorial for Beginners
Display Blog Posts
Display Blog Posts

Displaying Blog Posts – Node.js Tutorial for Beginners

In this tutorial, we’ll be displaying blog posts to our visitors. To do this, we first create a variable that will store our blog posts. Then, we’ll display these blog posts  to our visitors.

In a practical application you would use a database to store and retrieve our blog posts. In a future tutorial, we’ll take a look at some database options, but for now we’ll be storing all our data in memory.

Update your script to this.

We’re doing nothing special here. We create a variable called posts that will store our data in JSON format. We insert 2 dummy posts that will serve as a starting point. We’ll make it so we can add more posts to our blog in the next tutorial. First things first, we have to now display this data.

Displaying Blog Posts

Update the function for handling requests with the following code below.

Once again, we’re not doing anything special here. After our welcome message, we’re adding a link to the page where users will be able to create blog posts. After that, we start displaying our blog posts by looping through the posts variable and then using the write() method to display it’s contents.

Routing

You’re probably familiar with routing if you’ve done some Ruby on Rails. If not, then you can think of routing as a way to specify URLs and how your application should react accordingly. Routes can be simple or very dynamic. Let’s update our function to the code below to see how routing works.

The request object provides us with a property named url. The url property tells us what page the visitor is trying to access.In our code above, we log the URL to our console so we can see what URL the visitor is trying to access. Ignoring the rest of the code, try running the application and look at your command prompt. You can see all the URLs you’re trying to access.

Now that we have this info, we can use it to determine what page to display to our users. By default, we would like to display the blog posts. In normal web applications, you would display a 404 message to your visitors if the page doesn’t exist. Since this is just a simple web app, we won’t worry about that stuff until later on in this series.

We check to see if the requested URL is the create page Otherwise, we display our blog posts. That’s it!

Mini Exercise

Try creating a route for a page called /latest that will display the latest blog post inserted. This would be the last index in the array. Then, add a link in our main page to the latest page.  Take a look at the spoiler code below to compare your code.

Mini Example Solution

Mini Example Solution

Conclusion

We learned how to create routes to display different pages according to the URL. Traditionally, you would just upload an html or PHP file and then that would be the URL for page. However, in Node.js, you can have cleaner URLs by using routes. In the next tutorial, we’ll create the page for creating blog posts. We’ll learn how to deal with POST requests and insert a new blog post into our web application.

Click here to learn more the request object!

About Jasko Koyn

Check Also

Asynchronous

Asynchronous – Node.js Tutorial for Beginners

Before we continue onto our blog web site. I would like to talk about asynchronous …

Leave a Reply

Your email address will not be published. Required fields are marked *

ULTIMATE WORDPRESS DEVELOPMENT COURSE
Want to learn how to create your own custom WordPress plugins and themes? Check out my course!
Get 93% off my course. You'll also learn how to integrate WooCommerce and BuddyPress into your projects. This is a limited time offer
Yes, I would like to get 93% off your course!
No Thanks!
close-link