Micro Blogger Web Application

This repository contains the source code for a Micro Blogger web application. The application allows users to create, edit, and view blog posts. It features a responsive and modern design, making it easy to manage and read blog content.

Table of Contents

• Overview
• Prerequisites
• Usage
• Key Features

Overview

This web application is built using HTML, SCSS, and JavaScript. It includes the following key components:

• HTML: The HTML file (index.html) provides the structure and layout for the web page. It defines the main content container, blog cards, and a modal for creating and editing blog posts.

• SCSS: The SCSS file (styles.scss) contains styles for the web application. It uses variables, mixins, and a well-organized structure to define the visual aspects of the application. The styles are designed for a responsive and user-friendly interface.

• JavaScript: The JavaScript file (app.js) adds interactivity and functionality to the web application. It manages blog data, allows users to create and edit blog posts, and dynamically renders the blog content.

Prerequisites

Before running or deploying this application, make sure you have the following prerequisites:

• A modern web browser that supports HTML5 and JavaScript.
• A local development environment or a web server to serve the web page.
• run `npm init``

Usage

To get started with the Micro Blogger web application, follow these steps:

1. Open the Project Directory: Open the project directory in your code editor.

2. Run a Local Development Server: Run a local development server or open the HTML file (index.html) in your web browser.

3. Create and Manage Blog Posts: Start creating and managing blog posts using the provided interface.

Key Features

Here are some details on how to use the key features of the Micro Blogger application:

• Creating a Blog Post: Click the "Create Blog" button to open a modal. Fill in the title, author, and content, and then click "Submit" to create a new blog post.

• Editing a Blog Post: Click the edit icon on a blog card to edit an existing blog post. The modal will open with the post's details pre-filled for editing.

• Viewing Blogs: The main content area displays a list of blog posts. Click on a blog card to view the full content, and hover over cards for a visual effect.