Tech-Blogs

Table of Contents

• Overview
• Features
• Preview
• Technologies
• Usage
• Navigation

Overview

"Tech-Blogs" is a web application that provides a platform for reading and exploring technical blogs. It offers a collection of blogs organized by categories and tags. Users can easily navigate between blogs and discover related content. It is made to concretely understand the concept of routing, dynamic url based rendering, useSearchParams(), useLocation() hooks.

Features

• Blog Listing:

  • Displays a list of blogs, each with a heading, category, a short paragraph, and tags.

• Category Filtering:

  • Click on a category to view blogs from the same category.

• Tag Filtering:

  • Click on a tag to view blogs that share the same tag.

• Pagination:

  • Navigate between blog pages using the "Previous" and "Next" buttons in the navigation bar.

Preview

View Live Demo

Technologies

• React
• React Router DOM
• Tailwind CSS

Usage

1. Blog Listing:

   • Browse through the list of blogs, each displaying a heading, category, short paragraph, and tags.

2. Category Filtering:

   • Click on a category link to view blogs from the same category.

3. Tag Filtering:

   • Click on a tag link to view blogs that share the same tag.

4. Pagination:

   • Use the "Previous" and "Next" buttons in the navigation bar to navigate between blog pages.

Navigation

• Category Page:

  • Click on a category link to view other blogs from the same category.
  • Use the "Back" button to return to the previous page.

• Tag Page:

  • Click on a tag link to view other blogs with the same tag.
  • Use the "Back" button to return to the previous page.

• Blog Page:

  • Click on a blog heading to view the full blog post.