Skip to content

osherasfa/blog-journey

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Blog Site

This is a simple blog site that import posts from a local data object. The site incorporates a dark and light mode feature, a hero section displaying random posts upon each page load, an "About Me" page, and individual post pages with random posts displayed at the bottom. The site is built using JavaScript (JS), HTML, and CSS.

Table of Contents

Demo

Check out the live demo of the project here.

Features

  1. Single Page Application (SPA): The site utilizes JavaScript render methods to create a seamless user experience where you can navigate between links and posts without the need to reload the entire site.

  2. Dark/Light Mode: The site offers both dark and light mode options, providing a personalized viewing experience based on your preference.

  3. Hero Section: Upon each page load, the hero section displays random posts from your blog, creating a dynamic and engaging front page.

  4. About Me Page: The blog includes an "About Me" page where I share information about myself, my interests, and my blog's purpose.

  5. Post Pages: Individual post pages showcase blog content, and at the bottom of each post page, random posts are displayed to encourage further exploration.

Technologies Used

The following technologies were used to develop this blog site:

  • JavaScript (JS): A programming language used to enhance the interactivity and functionality of the website.

  • HTML: The standard markup language for creating web pages and structuring the content.

  • CSS: A style sheet language used to control the visual appearance of the website.

Installation

To install and run the blog site locally, please follow these steps:

  1. Clone the repository: git clone https://github.com/your-repo.git

  2. Navigate to the project directory: cd your-repo

  3. run the index.html file on your own local server.

Usage

Once the blog site is running, you can perform the following actions:

  • Toggle Dark/Light Mode: Switch between dark and light mode based on your preference.

  • Explore Random Posts: On the home page, the hero section displays random posts each time the page is loaded. Additionally, at the bottom of each post page, you can find random posts to discover more content.

  • Navigate Pages: Use the navigation menu to access the "About Me" page, "Home" page and individual post pages.

License

This project is licensed under the MIT License. You are free to use, modify, and distribute this project as per the terms of the license.


Thank you for using this blog site! If you have any questions or need further assistance, please don't hesitate to reach out. Happy blogging!