Add-README.md file in accordance with provided format

Node-JS-Projects/Url-Scraper/README.md

@@ -1,21 +1,97 @@
-## URL SCRAPPER
-- Uses Node.js, Express.js to scrap content of any url entered.
-- Eases the process of information extraction
-
-## HOW TO USE
-**Step1**
+<h1 align='center'><b>💥 PROJECT NAME 💥</b></h1>
 
-Run the project on your localhost using -
+<!-- -------------------------------------------------------------------------------------------------------------- -->
+
+<h3 align='center'>Tech Stack Used 🎮</h3>
+<!-- enlist all the technologies used to create this project from them (Remove co
+mment using 'ctrl+z' or 'command+z') -->
+
+<div align='center'>
+
+  <!-- ![HTML5](https://img.shields.io/badge/html5-%23E34F26.svg?style=for-the-badge&logo=html5&logoColor=white) -->
+  <!-- ![CSS3](https://img.shields.io/badge/css3-%231572B6.svg?style=for-the-badge&logo=css3&logoColor=white) -->
+
+  <!-- ![JavaScript](https://img.shields.io/badge/javascript-%23323330.svg?style=for-the-badge&logo=javascript&logoColor=%23F7DF1E) -->
+
+  <!-- ![Express.js](https://img.shields.io/badge/express.js-%23404d59.svg?style=for-the-badge&logo=express&logoColor=%2361DAFB) -->
+
+  <!-- ![NodeJS](https://img.shields.io/badge/node.js-6DA55F?style=for-the-badge&logo=node.js&logoColor=white) -->
+
+</div>
+
+![Line](https://github.com/Avdhesh-Varshney/WebMasterLog/assets/114330097/4b78510f-a941-45f8-a9d5-80ed0705e847)
+
+<!-- -------------------------------------------------------------------------------------------------------------- -->
+
+## :zap: Description 📃
+
+<div>
+  <h3>URL-Scraper:</h3>
+  <p>
+  <ul>
+  <li>This project will be a Web Content Aggregator that collects and summarizes content of any website. 
+  <li>It will fetch the headings, sub headings, and further content of the website and display it in a visually appealing manner.
+  <li>It can be used as a summarizer for the web page without actually going through the whole web page.
+  </li>
+  </li>
+  </li>
+  </ul></p>
+</div>
+
+<!-- -------------------------------------------------------------------------------------------------------------- -->
+
+## :zap: How to run it? 🕹️
+
+To run the application follow these steps:
+
+**Step 1:** Fork the repository. Follow these guidelines to know all about how to fork a repository
+[Forking a Repo](https://help.github.com/en/github/getting-started-with-github/fork-a-repo)
+
+**Step 2:** Clone the repository. [Cloning a Repo](https://help.github.com/en/desktop/contributing-to-projects/creating-an-issue-or-pull-request)
+
+**Step 3:** Go to Url-Scrapper folder and run
 
 `npm install`
 
-`npm run` 
+`npm run dev`
+
+**Step 4:** Go to `http://localhost:8001` and enter url of the webpage you want to access contents of
+
+## Voila! Have fun using the site.
+
+<!-- -------------------------------------------------------------------------------------------------------------- -->
+
+## :zap: Screenshots 📸
+
+- Web page user interface
+  ![web-page-demo](image.png)
+- Input type
+  ![example-url](image-1.png)
+- Scraped information
+  ![scraped-text](image-2.png)
+- When in case of invalid input
+  ![invalid-url](image-3.png)
+- Error message gets displayed for invalid URL
+  ![error-message](image-4.png)
+- When in case of an unsafe site
+  ![unsafe-site](image-5.png)
+- Error is displayed for the invalid site
+  ![invalid-url](image-6.png)
 
-**Step 2**
+![Line](https://github.com/Avdhesh-Varshney/WebMasterLog/assets/114330097/4b78510f-a941-45f8-a9d5-80ed0705e847)
 
-Go to `http://localhost:8000` in your preferred browser.
+<!-- -------------------------------------------------------------------------------------------------------------- -->
 
-**Step 3** 
+<h4 align='center'>Developed By <b><i>RAGINI MISHRA</i></b> 👦</h4>
+<p align='center'>
+  <a href='https://www.linkedin.com/in/ragini-mishra-5a78b3217/'>
+    <img src='https://img.shields.io/badge/linkedin-%230077B5.svg?style=for-the-badge&logo=linkedin&logoColor=white' />
+  </a>
+  <a href='https://github.com/Rags-Mishra'>
+    <img src='https://img.shields.io/badge/github-%23121011.svg?style=for-the-badge&logo=github&logoColor=white' />
+  </a>
+</p>
 
-Enter the url of your choice and hit `scrape` and voila! All the contents of the site is displayed on your screen.
+<h4 align='center'>Happy Coding 🧑‍💻</h4>
 
+<h3 align="center">Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>