From eed3e9e5853aeb7cde6e64c8203c1bf46fa04aea Mon Sep 17 00:00:00 2001
From: Avdhesh-Varshney <114330097+Avdhesh-Varshney@users.noreply.github.com>
Date: Mon, 14 Oct 2024 15:27:00 +0530
Subject: [PATCH] readme-layout-update

---
 Angular-JS-Projects/README.md                 |  46 ++-
 Front-end-Projects/README.md                  | 130 +++---
 Next-JS-Projects/README.md                    |  47 ++-
 Node-JS-Projects/README.md                    |  68 ++--
 .../{screnshot.webp => screenshot.webp}       | Bin
 React-JS-Projects/README.md                   | 142 ++++---
 Typescript-Projects/README.md                 |  42 +-
 .../{screennshot.webp => screenshot.webp}     | Bin
 Vanilla-JS-Projects/README.md                 | 369 ++++++++++++------
 Vue-JS-Projects/README.md                     |  47 ++-
 10 files changed, 585 insertions(+), 306 deletions(-)
 rename React-JS-Projects/Intermediate/Interview-Report/{screnshot.webp => screenshot.webp} (100%)
 rename Vanilla-JS-Projects/Intermediate/Daily-Journal-Website/{screennshot.webp => screenshot.webp} (100%)

diff --git a/Angular-JS-Projects/README.md b/Angular-JS-Projects/README.md
index 0edeb7df..bf68ec5c 100644
--- a/Angular-JS-Projects/README.md
+++ b/Angular-JS-Projects/README.md
@@ -7,28 +7,41 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
-1. Attach the project name as shown below or you can refer from the README file of Vanilla-JS.
-[To Do List](./Basic/To-Do-List)
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
 
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
+#### :zap: Row 1
 
-3. Add the category of the project using the provided links below here, according to your project.
+| <img src="./Basic/Quick-Notes/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Task-Manager/screenshot.webp" width="300px" height="180px"> |  |    
+|:--:|:--:|:--:|
+| [Quick Notes](./Basic/Quick-Notes) | [Task Manager](./Basic/Task-Manager) |  |
 
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
--->
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
 
+#### :zap: Row 1
+
+| <img src="./Intermediate/Train-Website/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Train Website](./Intermediate/Train-Website) |  |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Advanced/Contact-Manager/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Contact Manager](./Advanced/Contact-Manager) |  |  |
 
-| S.No  | Project Name | Category |
-|-------|--------------|----------|
-|   1   | [Quick Notes](./Basic/Quick-Notes) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   2   | [Train Booking Website](./Intermediate/Train-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   3   | [Contact Manager](./Advanced/Contact-Manager/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   4   | [Task Manager](./Basic/Task-Manager) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
 
 </div>
 
@@ -38,4 +51,5 @@
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
diff --git a/Front-end-Projects/README.md b/Front-end-Projects/README.md
index f657403f..415cb2be 100644
--- a/Front-end-Projects/README.md
+++ b/Front-end-Projects/README.md
@@ -7,51 +7,88 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
-
-1. Attach the project name as shown below or you can refer from the README file of Vanilla-JS.
-[To Do List](./Basic/To-Do-List)
-
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
-
-3. Add the category of the project using the provided links below here, according to your project.
-
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
-
--->
-
-
-| S.No  | Project Name | Category |
-|-------|--------------|----------|
-|   1   | [Amazon Prime Clone](./Intermediate/Amazon-Prime-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   2   | [Make My Trip Website Clone](./Intermediate/MakeMyTrip-website-clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   3   | [Biography of Mahatma Gandhi](./Basic/Biography-Mahatma-Gandhi) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   4   | [Biography of Dr. B R Ambedkar](./Basic/Biography-BR-Ambedkar) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   5   | [Netflix Clone](./Intermediate/Netflix-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   6   | [Starbucks Landing Page Clone](./Basic/Starbucks-Landing-page) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   7   | [Product Landing Page](./Intermediate/Product-Landing-Page ) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   8   | [Spotify Clone](./Intermediate/Spotify-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   9   | [Apple Clone](./Intermediate/Apple-Clone ) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   10  | [Reddit Clone](./Intermediate/Reddit-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   11  | [Microsoft Clone](./Intermediate/Microsoft-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   12  | [Facebook Login Page](./Basic/Facebook-Login-Page) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   13  | [PhonePe Clone](./Basic/PhonePe/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   14  | [SpaceX Website Clone](./Basic/SpaceX-Website-Clone/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   15  | [Flipkart Clone](./Intermediate/Flipkart-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   16  | [IPHONE 14 Pro Clone](./Intermediate/IPHONE-14-Pro-Clone)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   17  | [Tea-Cup](./Basic/Animated-Tea-Cup) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   18  | [Google Drive Clone](./Basic/Google-Drive-Clone/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   19  | [FlexFlow](./Basic//FlexFlow) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   20  | [Login Signup Form](./Basic//Login-Signup-Form) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   21  | [Feedback Form](./Basic//Feedback-Form) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   22  | [Survey Form](./Basic//Survey-Form) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   23  | [Blood Donation Form](./Basic//Blood-Donation-Form) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   24  | [Linktree Clone](./Intermediate/Linktree-Clone)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   25  | [Google Search Clone](./Basic/Google-Search-Clone)| ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   26  | [Book Website](./Intermediate/Book-Website)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   27  | [Hotstar Clone](./Intermediate/Hotstar-Clone)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Basic/Animated-Tea-Cup/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Biography-BR-Ambedkar/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Biography-Mahatma-Gandhi/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Animated Tea Cup](./Basic/Animated-Tea-Cup) | [Biography BR Ambedkar](./Basic/Biography-BR-Ambedkar) | [Biography Mahatma Gandhi](./Basic/Biography-Mahatma-Gandhi) |
+
+#### :zap: Row 2
+
+| <img src="./Basic/Blood-Donation-Form/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Facebook-Login-Page/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Feedback-Form/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Blood Donation Form](./Basic/Blood-Donation-Form) | [Facebook Login Page](./Basic/Facebook-Login-Page) | [Feedback Form](./Basic/Feedback-Form) |
+
+#### :zap: Row 3
+
+| <img src="./Basic/FlexFlow/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Google-Drive-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Google-Search-Clone/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [FlexFlow](./Basic/FlexFlow) | [Google Drive Clone](./Basic/Google-Drive-Clone) | [Google Search Clone](./Basic/Google-Search-Clone) |
+
+#### :zap: Row 4
+
+| <img src="./Basic/Login-Signup-Form/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/PhonePe/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/SpaceX-Website-Clone/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Login Signup Form](./Basic/Login-Signup-Form) | [PhonePe](./Basic/PhonePe) | [SpaceX Website Clone](./Basic/SpaceX-Website-Clone) |
+
+#### :zap: Row 5
+
+| <img src="./Basic/Starbucks-Landing-page/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Survey-Form/screenshot.webp" width="300px" height="180px"> |  |
+|:--:|:--:|:--:|
+| [Starbucks Landing page](./Basic/Starbucks-Landing-page) | [Survey Form](./Basic/Survey-Form) |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Intermediate/Amazon-Prime-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Apple-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Book-Website/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Amazon Prime Clone](./Intermediate/Amazon-Prime-Clone) | [Apple Clone](./Intermediate/Apple-Clone) | [Book Website](./Intermediate/Book-Website) |
+
+#### :zap: Row 2
+
+| <img src="./Intermediate/Flipkart-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Hotstar-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/IPHONE-14-Pro-Clone/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Flipkart Clone](./Intermediate/Flipkart-Clone) | [Hotstar Clone](./Intermediate/Hotstar-Clone) | [IPHONE 14 Pro Clone](./Intermediate/IPHONE-14-Pro-Clone) |        
+
+#### :zap: Row 3
+
+| <img src="./Intermediate/Linktree-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/MakeMyTrip-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Microsoft-Clone/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Linktree Clone](./Intermediate/Linktree-Clone) | [MakeMyTrip Clone](./Intermediate/MakeMyTrip-Clone) | [Microsoft Clone](./Intermediate/Microsoft-Clone) |
+
+#### :zap: Row 4
+
+| <img src="./Intermediate/Netflix-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Product-Landing-Page/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Reddit-Clone/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Netflix Clone](./Intermediate/Netflix-Clone) | [Product Landing Page](./Intermediate/Product-Landing-Page) | [Reddit Clone](./Intermediate/Reddit-Clone) |
+
+#### :zap: Row 5
+
+| <img src="./Intermediate/Spotify-Clone/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Spotify Clone](./Intermediate/Spotify-Clone) |  |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1 
+
+|  |  |  |
+|:--:|:--:|:--:|
+|  |  |  |
 
 
 
@@ -63,4 +100,5 @@
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
diff --git a/Next-JS-Projects/README.md b/Next-JS-Projects/README.md
index 84611c2f..771ffccb 100644
--- a/Next-JS-Projects/README.md
+++ b/Next-JS-Projects/README.md
@@ -7,29 +7,41 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
-1. Attach the project name as shown below or you can refer from the README file of Vanilla-JS.
-[To Do List](./Basic/To-Do-List)
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
 
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
+#### :zap: Row 1
 
-3. Add the category of the project using the provided links below here, according to your project.
+| <img src="./Basic/Weather-Website/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Weather Website](./Basic/Weather-Website) |  |  |
 
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
--->
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
 
+#### :zap: Row 1
+
+| <img src="./Intermediate/Quiz-App/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Url-Shortener/screenshot.webp" width="300px" height="180px"> |  |
+|:--:|:--:|:--:|
+| [Quiz App](./Intermediate/Quiz-App) | [Url Shortener](./Intermediate/Url-Shortener) |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Advanced/Attendance-Tracking-App/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Breaking-News-App/screenshot.webp" width="300px" height="180px"> |  |
+|:--:|:--:|:--:|
+| [Attendance Tracking App](./Advanced/Attendance-Tracking-App) | [Breaking News App](./Advanced/Breaking-News-App) |  |
 
-| S.No | Project Name | Category |
-|------|--------------|----------|
-|  1   | [Weather-Website](./Basic/Weather-Website) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  2   | [Quiz-App](./Intermediate/Quiz-App) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  3   | [Breaking-News-App](./Advanced/Breaking-News-App/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  4   | [Attendance-Tracking-App](./Advanced/Attendance-Tracking-App/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  5   | [Url-Shortener](./Intermediate/Url-Shortener/)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
 
 </div>
 
@@ -39,4 +51,5 @@
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
\ No newline at end of file
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
diff --git a/Node-JS-Projects/README.md b/Node-JS-Projects/README.md
index f9d5d581..9cec55d3 100644
--- a/Node-JS-Projects/README.md
+++ b/Node-JS-Projects/README.md
@@ -7,37 +7,54 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
-1. Attach the project name as shown below or you can refer from the README file of Vanilla-JS.
-[To Do List](./Basic/To-Do-List)
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
 
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
+#### :zap: Row 1
 
-3. Add the category of the project using the provided links below here, according to your project.
+| <img src="./Basic/Crud-Operations/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Headline-Hub/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Infinite-Scrolling/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Crud Operations](./Basic/Crud-Operations) | [Headline Hub](./Basic/Headline-Hub) | [Infinite Scrolling](./Basic/Infinite-Scrolling) |
 
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
--->
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Intermediate/Gmail-Nodemailer/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/JWT-Authenticator-With-Roles/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Url-Scraper/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Gmail Nodemailer](./Intermediate/Gmail-Nodemailer) | [JWT Authenticator With Roles](./Intermediate/JWT-Authenticator-With-Roles) | [Url Scraper](./Intermediate/Url-Scraper) |
+
+#### :zap: Row 2
+
+| <img src="./Intermediate/YouTube-Video-Downloader/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [YouTube Video Downloader](./Intermediate/YouTube-Video-Downloader) |  |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Advanced/Blog-Platform/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Cooking-Blog/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Docx-To-Pdf-Converter/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Blog Platform](./Advanced/Blog-Platform) | [Cooking Blog](./Advanced/Cooking-Blog) | [Docx To Pdf Converter](./Advanced/Docx-To-Pdf-Converter) |
+
+#### :zap: Row 2
+
+| <img src="./Advanced/E-Commerce/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Url-Shortener/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/User-Registration-System/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [E Commerce](./Advanced/E-Commerce) | [Url Shortener](./Advanced/Url-Shortener) | [User Registration System](./Advanced/User-Registration-System) |
 
 
-| S.No  | Project Name | Category |
-|-------|--------------|----------|
-|   1   | [JWT Authenticator With Roles](./Intermediate/JWT-Authenticator-With-Roles) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   2   | [Infinite Scrolling](./Basic/Infinite-Scrolling) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   3   | [CRUD Operations](./Basic/Crud-Operations) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   4   | [YouTube Video Downloader](./Intermediate/YouTube-Video-Downloader) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   5   | [Url Shortener](./Advanced/Url-Shortener) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   6   | [Blog Platform](./Advanced/Blog-Platform) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   7   | [Headline Hub](./Basic/Headline-Hub) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   8   | [URL Scraper](./Intermediate/Url-Scraper) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   9   | [E COMMERCE](./Advanced/E-Commerce) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   10   | [Cooking Blog](./Advanced/Cooking-Blog) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   11  | [Docx To Pdf Converter](./Advanced/Docx-To-Pdf-Converter) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  12   |[Nodemailer Contact Form ](./Intermediate/Gmail-Nodemailer/app.js) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge)|
-|   13   | [User Registration System](./Advanced/User-Registration-System) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
 </div>
 
 
@@ -46,4 +63,5 @@
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
diff --git a/React-JS-Projects/Intermediate/Interview-Report/screnshot.webp b/React-JS-Projects/Intermediate/Interview-Report/screenshot.webp
similarity index 100%
rename from React-JS-Projects/Intermediate/Interview-Report/screnshot.webp
rename to React-JS-Projects/Intermediate/Interview-Report/screenshot.webp
diff --git a/React-JS-Projects/README.md b/React-JS-Projects/README.md
index 0eadddf0..a1f061b1 100644
--- a/React-JS-Projects/README.md
+++ b/React-JS-Projects/README.md
@@ -7,57 +7,94 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
-
-1. Attach the project name as shown below or you can refer from the README file of Vanilla-JS.
-[To Do List](./Basic/To-Do-List)
-
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
-
-3. Add the category of the project using the provided links below here, according to your project.
-
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
-
--->
-
-
-| S.No  | Project Name | Category |
-|-------|--------------|----------|
-|   1   | [Password Generator](./Basic/Password-Generator) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   2   | [To Do List](./Basic/ToDo-List) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   3   | [Weather App](./Basic/Weather-App) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   4   | [Cryptocurrency Finder](./Intermediate/Cryptocurrency-Finder/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   5   | [QR Code Generator](./Advanced/Qr-Code-Generator/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   6   | [Quiz App](./Intermediate/Quiz-App/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   7   | [Currency Converter](./Intermediate/Currency-Converter/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   8   | [Code Editor](./Advanced/Code-Editor/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   9   | [Notes App](./Advanced/Notes-App/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   10  | [Movie Land](./Intermediate/Movie-Land/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   11  | [Travel Website](./Advanced/Travel-Website/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   12  | [Form Validation](./Intermediate/Form-Validation/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   13  | [Solar System Model](./Advanced/Solar-system-model/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   14  | [Image Carousel](./Intermediate/Image-Carousel) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   15  | [IP Address Tracker](./Advanced/IP-Address-Tracker/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   16  | [Myntra Clone](./Intermediate/Myntra-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   17  | [Interview Report](./Intermediate/Interview-Report/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   18  | [Swiggy Clone](./Basic/Swiggy-Clone/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   19  | [Chat Application](./Advanced/Chat-Application/)  | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   20  | [Shopping Cart](./Basic/Shopping-Cart/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   21  | [GitHub Profile Viewer](./Intermediate/GitHub-Profile-Viewer/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   22  | [Random Bible Verse](./Intermediate/Random-Bible-Verse/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   23  | [Chat Bot](./Intermediate/Chat-Bot/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   24  | [Tesla Clone](./Intermediate/Tesla-Clone) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   25  | [Motivation For The Day](./Basic/Motivation-For-The-Day/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   26  | [Job Portal](./Advanced/Job-Portal/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   27  | [Cakes n Cookies](./Intermediate/Cakes-N-Cookies/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   28  | [TSPOT Travel App](./Intermediate/Tspot-Travel-App/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   29  | [Tutoring Website](./Advanced/Tutoring-Website/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   30  | [Youtube Clone](./Intermediate/Youtube-Clone/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   31  | [Typing Speed Tracker](./Advanced/Typing-Speed-Tracker/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   32 | [Food Recipe App](./Advanced/Food-Recipe-App/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   33 | [Netflix Clone](./Intermediate/Netflix-Clone/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Basic/Motivation-For-The-Day/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Password-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Shopping-Cart/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Motivation For The Day](./Basic/Motivation-For-The-Day) | [Password Generator](./Basic/Password-Generator) | [Shopping Cart](./Basic/Shopping-Cart) |
+
+#### :zap: Row 2
+
+| <img src="./Basic/Swiggy-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/To-Do-List/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Weather-App/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Swiggy Clone](./Basic/Swiggy-Clone) | [To Do List](./Basic/To-Do-List) | [Weather App](./Basic/Weather-App) |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Intermediate/Cakes-N-Cookies/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Chat-Bot/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Cryptocurrency-Finder/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Cakes N Cookies](./Intermediate/Cakes-N-Cookies) | [Chat Bot](./Intermediate/Chat-Bot) | [Cryptocurrency Finder](./Intermediate/Cryptocurrency-Finder) |
+
+#### :zap: Row 2
+
+| <img src="./Intermediate/Currency-Converter/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Form-Validation/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/GitHub-Profile-Viewer/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Currency Converter](./Intermediate/Currency-Converter) | [Form Validation](./Intermediate/Form-Validation) | [GitHub Profile Viewer](./Intermediate/GitHub-Profile-Viewer) |
+
+#### :zap: Row 3
+
+| <img src="./Intermediate/Image-Carousel/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Interview-Report/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Movie-Land/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Image Carousel](./Intermediate/Image-Carousel) | [Interview Report](./Intermediate/Interview-Report) | [Movie Land](./Intermediate/Movie-Land) |
+
+#### :zap: Row 4
+
+| <img src="./Intermediate/Myntra-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Netflix-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Quiz-App/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Myntra Clone](./Intermediate/Myntra-Clone) | [Netflix Clone](./Intermediate/Netflix-Clone) | [Quiz App](./Intermediate/Quiz-App) |
+
+#### :zap: Row 5
+
+| <img src="./Intermediate/Random-Bible-Verse/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Tesla-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Tspot-Travel-App/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Random Bible Verse](./Intermediate/Random-Bible-Verse) | [Tesla Clone](./Intermediate/Tesla-Clone) | [Tspot Travel App](./Intermediate/Tspot-Travel-App) |
+
+#### :zap: Row 6
+
+| <img src="./Intermediate/Youtube-Clone/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Youtube Clone](./Intermediate/Youtube-Clone) |  |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Advanced/Chat-Application/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Code-Editor/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Food-Recipe-App/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Chat Application](./Advanced/Chat-Application) | [Code Editor](./Advanced/Code-Editor) | [Food Recipe App](./Advanced/Food-Recipe-App) |
+
+#### :zap: Row 2
+
+| <img src="./Advanced/IP-Address-Tracker/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Job-Portal/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Notes-App/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [IP Address Tracker](./Advanced/IP-Address-Tracker) | [Job Portal](./Advanced/Job-Portal) | [Notes App](./Advanced/Notes-App) |
+
+#### :zap: Row 3
+
+| <img src="./Advanced/Qr-Code-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Solar-System-Model/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Travel-Website/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Qr Code Generator](./Advanced/Qr-Code-Generator) | [Solar System Model](./Advanced/Solar-System-Model) | [Travel Website](./Advanced/Travel-Website) |
+
+#### :zap: Row 4
+
+| <img src="./Advanced/Tutoring-Website/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Typing-Speed-Tracker/screenshot.webp" width="300px" height="180px"> |  |
+|:--:|:--:|:--:|
+| [Tutoring Website](./Advanced/Tutoring-Website) | [Typing Speed Tracker](./Advanced/Typing-Speed-Tracker) |  |
 
 </div>
 
@@ -67,4 +104,5 @@
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
diff --git a/Typescript-Projects/README.md b/Typescript-Projects/README.md
index d3542cbd..602fa705 100644
--- a/Typescript-Projects/README.md
+++ b/Typescript-Projects/README.md
@@ -7,27 +7,40 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
-1. Attach the project name as shown below or you can refer from the README file of Vanilla-JS.
-[To Do List](./Basic/To-Do-List)
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
 
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
+#### :zap: Row 1 
 
-3. Add the category of the project using the provided links below here, according to your project.
+|  |  |  |
+|:--:|:--:|:--:|
+|  |  |  |
 
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
--->
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
 
+#### :zap: Row 1
 
-| S.No  | Project Name | Category |
-|-------|--------------|----------|
-|   1  | [To do list app](./Advanced/To-Do-List-App/)  | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   2  | [Quiz App](./Intermediate/Quiz-App/)  | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
+| <img src="./Intermediate/Quiz-App/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Quiz App](./Intermediate/Quiz-App) |  |  |
 
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Advanced/To-Do-List-App/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [To Do List App](./Advanced/To-Do-List-App) |  |  |
 
 
 </div>
@@ -38,4 +51,5 @@
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
diff --git a/Vanilla-JS-Projects/Intermediate/Daily-Journal-Website/screennshot.webp b/Vanilla-JS-Projects/Intermediate/Daily-Journal-Website/screenshot.webp
similarity index 100%
rename from Vanilla-JS-Projects/Intermediate/Daily-Journal-Website/screennshot.webp
rename to Vanilla-JS-Projects/Intermediate/Daily-Journal-Website/screenshot.webp
diff --git a/Vanilla-JS-Projects/README.md b/Vanilla-JS-Projects/README.md
index 096252e2..7de4943c 100644
--- a/Vanilla-JS-Projects/README.md
+++ b/Vanilla-JS-Projects/README.md
@@ -7,131 +7,260 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
-
-1. Attach the project name as shown below.
-[To Do List](./Basic/To-Do-List)
-
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
-
-3. Add the category of the project using the provided links below here, according to your project.
-
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
-
--->
-
-
-| S.No  | Project Name | Category |
-|-------|--------------|----------|
-|   1   | [To Do List](./Basic/To-Do-List) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   2   | [Day Calculator](./Intermediate/Day-Calculator) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   3   | [Time Watcher](./Intermediate/Time-Watcher) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   4   | [Number to Words Convertor](./Intermediate/Number-To-Words-Convertor) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   5   | [Gallery](./Basic/Gallery) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   6   | [Audio Analyzer](./Advanced/Audio-Analyzer) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|   7   | [Password Generator](./Intermediate/Password-Generator) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   8   | [Palindrome Checker](./Basic/Palindrome-Checker) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   9   | [Hex Color Code Generator](./Intermediate/Hex-color-code-generator-website) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  10   | [Countdown Timer](./Intermediate/Countdown-Timer) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  11   | [Recipe Finder](./Advanced/Recipe-Finder/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  12   | [Morse Code Generator](./Intermediate/Morse-Code-Convertor) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  13   | [CosmoXplore : APOD](./Intermediate/CosmoXplore-APoD/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  14   | [Random Name Generator](./Intermediate/Random-Name-Generator) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  15   | [Martian Imagery](./Intermediate/Martian-Imagery) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  16   | [Battery Status Tracker](./Intermediate/Battery-Status-Tracker/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  17   | [Emoji Maker](./Intermediate/Emoji-Maker/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  18   | [Weather App](./Intermediate/Weather-App/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  19   | [Sudoku Solver](./Intermediate/Sudoku-Solver/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  20   | [Sudoku Game 6x6](./Intermediate/Sudoku-Game-6x6/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  21   | [Sort Visualizer](./Advanced/sort-visualizer/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  22   | [Joke Telling Website](./Basic/Joke-Telling-Website/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  23   | [Interval Timer](./Intermediate/Interval_Timer/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  24   | [Language Translator](./Intermediate/Language-Translator/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  25   | [Ceaser-Cipher](./Intermediate/Ceaser-Cipher/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  26   | [Email-Subscription-form-with-google-sheet](./Intermediate/Email-Subscription-form-with-google-sheet/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  27   | [Dictonary-App](./Basic/Dictonary-App/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  28   | [Typing-Test](./Advanced/Typing-Test/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  29   | [RGB-Color-Slider](./Basic/RGB-Color-Slider/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  30   | [Expense Tracker](./Basic/Expense-Tracker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge)  |
-|  31   | [CSS Art Gallery](./Basic/CSS-Art-Gallery) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge)  |
-|  32   | [Quote-Generator](./Basic/Quote-Generator/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge)  |
-|  33   | [Social Media Analytics](./Intermediate/Social-Media-Analytics/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) | 
-|  34   | [Movie Finder](./Intermediate/Movie-Finder/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) | 
-|  35   | [Resume Builder](./Advanced/Resume-Builder/) |![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  36   | [Virtual-Piano](./Basic/Virtual-Piano/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  37   | [Text-to-Image-Generator](./Intermediate/Text-to-Image-Generator/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) | 
-|  38   | [Text-Translator](./Basic/Text-Translator/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  39   | [Interactive-Periodic-Table](./Intermediate/Interactive-Periodic-Table/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) | 
-|  40 	| [Anagram-Checker](./Basic/Anagram-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  41   | [Leap-Year-Checker](./Basic/Leap-Year-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  42	  | [Image-Search-Engine](./Basic/Image-Search-Engine/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  43   | [Code-Editor](./Intermediate/Code-Editor/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  44   | [Prime-Number-Checker](./Basic/Prime-Number-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  45   |  [Fitness Website](./Intermediate/Fitness-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  46   | [Drag-and-Drop](./Intermediate/Drag-and-Drop/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) | 
-|  47   | [Pangram-Checker](./Basic/Pangram-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  48   |  [Language-Learning-Website](./Intermediate/Language-Learning-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  49   | [Valid-Parenthesis-Checker](./Intermediate/Valid-Parenthesis-Checker/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  50   | [Interactive-Drawing-Website](./Intermediate/Interactive-Drawing-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  51   | [Isogram-Checker](./Basic/Isogram-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  52   | [Synonym-Searcher](./Intermediate/Synonym-Searcher/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) | 
-|  53   | [GasGuys-HomePage-Clone](./Intermediate/GasGuys-HomePage-Clone/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  54   | [Daily-Journal-Website](./Intermediate/Daily-Journal-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  55   | [Apna-College-Clone](./Basic/Apna-College-Clone/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  56   | [Isomorphic-Strings-Checker](./Basic/Isomorphic-Strings-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  57   | [Random-Advice-Generator](./Basic/Random-Advice-Generator/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  58   | [Task-Reminder](./Intermediate/Task-Reminder/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  59   | [Analog-Clock](./Basic/Analog-Clock/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  60   | [Kanban-Board](./Intermediate/Kanban-Board/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  61   | [World Population Predictor](./Basic/World-Population/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  62   | [Stop Watch](./Basic/Stop-Watch/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  63   | [Garden-Planning-Website](./Advanced/Garden-Planning-Website/) |![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  64   | [Substring-Checker](./Basic/Substring-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  65   | [Zomato-Clone](./Intermediate/Zomato-Clone/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  66   | [Tesla-Website-Clone](./Basic/Tesla-Website-Clone/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  67   | [Countries-Over-The-World](./Intermediate/Countries-Over-The-World/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  68   | [Expense-Splitter-Website](./Intermediate/Expense-Splitter-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  69   | [Star-Rating-Component](./Basic/Star-Rating-Component/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  70   | [Random-Picker](./Basic/Random-Picker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  71   | [Subsequence-Checker](./Basic/Subsequence-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  72   | [Vocabulary-Builder](./Advanced/Vocabulary-Builder/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  73   | [Text-Summarizer](./Intermediate/Text-Summarizer/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  74   | [3D Solar System](./Basic/3D-Solar-System/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  75   | [Co-Prime-Number-Checker](./Basic/Co-Prime-Number-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  76   | [Vowel-Counter](./Basic/Vowel-Counter/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge)|
-|  77   | [Youtube-Clone](./Basic/Youtube-Clone/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  78   | [Word-Counter](./Basic/Word-Counter/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  79   | [Captcha-Generator](./Basic/Captcha-Generator/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  80   | [Custom-Video-Player](./Basic/Custom-Video-Player/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  81   | [Perfect-Number-Checker](./Basic/Perfect-Number-Checker/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  82   | [Password-Manager](./Basic/Password-Manager/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  83   | [Wheel-Counter](./Intermediate/Wheel-Selector/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  84   | [Book-Review-Website](./Intermediate/Book-Review-Website/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  85   | [Lunar Cycle - Moon Phase Visibility](./Advanced/Moon-Phase-Visibility/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  86   | [Paint-App](./Intermediate/Paint-App/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  87   | [Dictionay-App](./Basic/Dictionary-App/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  88   | [Hackathon-Tracker](./Advanced/Hackathon-Tracker/) | ![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) |
-|  89   | [Travel-Journal](./Intermediate/Travel-Journal/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  90   | [Bulb-On-Off](./Basic/Bulb-On-Off/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  91   | [Theme Cake Order Form](./Basic/Theme-Cake-Order-Form/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  92   | [Time-Capsule-Center](./Intermediate/Time-Capsule-Center/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  93   | [Gravity-Drops](./Intermediate/Gravity-Drops/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  94   | [Movie-App](./Intermediate/Movie-App/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  95   | [Meme-Creator](./Intermediate/Meme-Creator/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  96   | [Github-Profile-Viewer](./Intermediate/Github-Profile-Viewer/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  97   | [Qr-Code-Generator](./Basic/Qr-Code-Generator/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  98   | [Amazon-Clone](./Intermediate/Amazon-Clone/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|  99   | [Travel-App](./Basic/Travel-App/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|  100  | [Personal Portfolio](./Basic/Personal-Portfolio/) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
 
-</div>
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Basic/3D-Solar-System/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Anagram-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Analog-Clock/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [3D Solar System](./Basic/3D-Solar-System) | [Anagram Checker](./Basic/Anagram-Checker) | [Analog Clock](./Basic/Analog-Clock) |
+
+#### :zap: Row 2
+
+| <img src="./Basic/Apna-College-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Bulb-On-Off/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Captcha-Generator/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Apna College Clone](./Basic/Apna-College-Clone) | [Bulb On Off](./Basic/Bulb-On-Off) | [Captcha Generator](./Basic/Captcha-Generator) |
+
+#### :zap: Row 3
+
+| <img src="./Basic/Co-Prime-Number-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/CSS-Art-Gallery/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Custom-Video-Player/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Co Prime Number Checker](./Basic/Co-Prime-Number-Checker) | [CSS Art Gallery](./Basic/CSS-Art-Gallery) | [Custom Video Player](./Basic/Custom-Video-Player) |       
+
+#### :zap: Row 4
+
+| <img src="./Basic/Days-Between-Two-Dates/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Dictionary-App/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Dictonary-App/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Days Between Two Dates](./Basic/Days-Between-Two-Dates) | [Dictionary App](./Basic/Dictionary-App) | [Dictonary App](./Basic/Dictonary-App) |
+
+#### :zap: Row 5
+
+| <img src="./Basic/Expense-Tracker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Gallery/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Image-Search-Engine/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Expense Tracker](./Basic/Expense-Tracker) | [Gallery](./Basic/Gallery) | [Image Search Engine](./Basic/Image-Search-Engine) |
+
+#### :zap: Row 6
+
+| <img src="./Basic/Isogram-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Isomorphic-Strings-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Joke-Telling-Website/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Isogram Checker](./Basic/Isogram-Checker) | [Isomorphic Strings Checker](./Basic/Isomorphic-Strings-Checker) | [Joke Telling Website](./Basic/Joke-Telling-Website) |
+
+#### :zap: Row 7
+
+| <img src="./Basic/Leap-Year-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Palindrome-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Pangram-Checker/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Leap Year Checker](./Basic/Leap-Year-Checker) | [Palindrome Checker](./Basic/Palindrome-Checker) | [Pangram Checker](./Basic/Pangram-Checker) |
+
+#### :zap: Row 8
+
+| <img src="./Basic/Password-Manager/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Perfect-Number-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Personal-Portfolio/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Password Manager](./Basic/Password-Manager) | [Perfect Number Checker](./Basic/Perfect-Number-Checker) | [Personal Portfolio](./Basic/Personal-Portfolio) |
+
+#### :zap: Row 9
+
+| <img src="./Basic/Prime-Number-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Qr-Code-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Quote-Generator/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Prime Number Checker](./Basic/Prime-Number-Checker) | [Qr Code Generator](./Basic/Qr-Code-Generator) | [Quote Generator](./Basic/Quote-Generator) |
+
+#### :zap: Row 10
+
+| <img src="./Basic/Random-Advice-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Random-Picker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/RGB-Color-Slider/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Random Advice Generator](./Basic/Random-Advice-Generator) | [Random Picker](./Basic/Random-Picker) | [RGB Color Slider](./Basic/RGB-Color-Slider) |
+
+#### :zap: Row 11
+
+| <img src="./Basic/Star-Rating-Component/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Stop-Watch/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Stopwatch/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Star Rating Component](./Basic/Star-Rating-Component) | [Stop Watch](./Basic/Stop-Watch) | [Stopwatch](./Basic/Stopwatch) |
+
+#### :zap: Row 12
+
+| <img src="./Basic/Subsequence-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Substring-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Tesla-Website-Clone/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Subsequence Checker](./Basic/Subsequence-Checker) | [Substring Checker](./Basic/Substring-Checker) | [Tesla Website Clone](./Basic/Tesla-Website-Clone) |
+
+#### :zap: Row 13
+
+| <img src="./Basic/Text-Translator/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Theme-Cake-Order-Form/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/To-Do-List/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Text Translator](./Basic/Text-Translator) | [Theme Cake Order Form](./Basic/Theme-Cake-Order-Form) | [To Do List](./Basic/To-Do-List) |
+
+#### :zap: Row 14
+
+| <img src="./Basic/Travel-App/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Virtual-Piano/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Vowel-Counter/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Travel App](./Basic/Travel-App) | [Virtual Piano](./Basic/Virtual-Piano) | [Vowel Counter](./Basic/Vowel-Counter) |
+
+#### :zap: Row 15
+
+| <img src="./Basic/Word-Counter/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/World-Clock/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/World-Population/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Word Counter](./Basic/Word-Counter) | [World Clock](./Basic/World-Clock) | [World Population](./Basic/World-Population) |
+
+#### :zap: Row 16
+
+| <img src="./Basic/Youtube-Clone/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Youtube Clone](./Basic/Youtube-Clone) |  |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Intermediate/Amazon-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Battery-Status-Tracker/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Book-Review-Website/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Amazon Clone](./Intermediate/Amazon-Clone) | [Battery Status Tracker](./Intermediate/Battery-Status-Tracker) | [Book Review Website](./Intermediate/Book-Review-Website) |
+
+#### :zap: Row 2
+
+| <img src="./Intermediate/Ceaser-Cipher/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Code-Editor/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/CosmoXplore-APoD/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Ceaser Cipher](./Intermediate/Ceaser-Cipher) | [Code Editor](./Intermediate/Code-Editor) | [CosmoXplore APoD](./Intermediate/CosmoXplore-APoD) |
+
+#### :zap: Row 3
+
+| <img src="./Intermediate/Countdown-Timer/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Countries-Over-The-World/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Daily-Journal-Website/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Countdown Timer](./Intermediate/Countdown-Timer) | [Countries Over The World](./Intermediate/Countries-Over-The-World) | [Daily Journal Website](./Intermediate/Daily-Journal-Website) |
+
+#### :zap: Row 4
+
+| <img src="./Intermediate/Day-Calculator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Drag-and-Drop/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Email-Subscription-form-with-google-sheet/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Day Calculator](./Intermediate/Day-Calculator) | [Drag and Drop](./Intermediate/Drag-and-Drop) | [Email Subscription form with google sheet](./Intermediate/Email-Subscription-form-with-google-sheet) |
 
+#### :zap: Row 5
+
+| <img src="./Intermediate/Emoji-Maker/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Expense-Splitter-Website/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Fitness-Website/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Emoji Maker](./Intermediate/Emoji-Maker) | [Expense Splitter Website](./Intermediate/Expense-Splitter-Website) | [Fitness Website](./Intermediate/Fitness-Website) |
+
+
+#### :zap: Row 6
+
+| <img src="./Intermediate/Food-Recipe-Finder/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/GasGuys-HomePage-Clone/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Github-Profile-Viewer/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Food Recipe Finder](./Intermediate/Food-Recipe-Finder) | [GasGuys HomePage Clone](./Intermediate/GasGuys-HomePage-Clone) | [Github Profile Viewer](./Intermediate/Github-Profile-Viewer) |
+
+#### :zap: Row 7
+
+| <img src="./Intermediate/Gravity-Drops/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Hex-Color-Code-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Interactive-Drawing-Website/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Gravity Drops](./Intermediate/Gravity-Drops) | [Hex Color Code Generator](./Intermediate/Hex-Color-Code-Generator) | [Interactive Drawing Website](./Intermediate/Interactive-Drawing-Website) |
+
+#### :zap: Row 8
+
+| <img src="./Intermediate/Interactive-Periodic-Table/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Interval-Timer/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Kanban-Board/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Interactive Periodic Table](./Intermediate/Interactive-Periodic-Table) | [Interval Timer](./Intermediate/Interval-Timer) | [Kanban Board](./Intermediate/Kanban-Board) |
+
+#### :zap: Row 9
+
+| <img src="./Intermediate/Language-Learning-Website/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Language-Translator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Martian-Imagery/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Language Learning Website](./Intermediate/Language-Learning-Website) | [Language Translator](./Intermediate/Language-Translator) | [Martian Imagery](./Intermediate/Martian-Imagery) |
+
+#### :zap: Row 10
+
+| <img src="./Intermediate/Meme-Creator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Meme-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Morse-Code-Convertor/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Meme Creator](./Intermediate/Meme-Creator) | [Meme Generator](./Intermediate/Meme-Generator) | [Morse Code Convertor](./Intermediate/Morse-Code-Convertor) |        
+
+#### :zap: Row 11
+
+| <img src="./Intermediate/Movie-App/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Movie-Finder/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Number-To-Words-Convertor/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Movie App](./Intermediate/Movie-App) | [Movie Finder](./Intermediate/Movie-Finder) | [Number To Words Convertor](./Intermediate/Number-To-Words-Convertor) |        
+
+#### :zap: Row 12
+
+| <img src="./Intermediate/Paint-App/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Password-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Password-Strength-Checker/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Paint App](./Intermediate/Paint-App) | [Password Generator](./Intermediate/Password-Generator) | [Password Strength Checker](./Intermediate/Password-Strength-Checker) |
+
+#### :zap: Row 13
+
+| <img src="./Intermediate/Random-Name-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Social-Media-Analytics/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Sudoku-Game/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Random Name Generator](./Intermediate/Random-Name-Generator) | [Social Media Analytics](./Intermediate/Social-Media-Analytics) | [Sudoku Game](./Intermediate/Sudoku-Game) |
+
+#### :zap: Row 14
+
+| <img src="./Intermediate/Sudoku-Solver/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Synonym-Searcher/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Task-Reminder/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Sudoku Solver](./Intermediate/Sudoku-Solver) | [Synonym Searcher](./Intermediate/Synonym-Searcher) | [Task Reminder](./Intermediate/Task-Reminder) |
+
+#### :zap: Row 15
+
+| <img src="./Intermediate/Text-Summarizer/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Text-to-Image-Generator/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Text-to-Voice/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Text Summarizer](./Intermediate/Text-Summarizer) | [Text to Image Generator](./Intermediate/Text-to-Image-Generator) | [Text to Voice](./Intermediate/Text-to-Voice) |
+
+#### :zap: Row 16
+
+| <img src="./Intermediate/Time-Capsule-Center/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Time-Watcher/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Travel-Journal/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Time Capsule Center](./Intermediate/Time-Capsule-Center) | [Time Watcher](./Intermediate/Time-Watcher) | [Travel Journal](./Intermediate/Travel-Journal) |
+
+#### :zap: Row 17
+
+| <img src="./Intermediate/Valid-Parenthesis-Checker/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Weather-App/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Wheel-Selector/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Valid Parenthesis Checker](./Intermediate/Valid-Parenthesis-Checker) | [Weather App](./Intermediate/Weather-App) | [Wheel Selector](./Intermediate/Wheel-Selector) |
+
+
+#### :zap: Row 18
+
+| <img src="./Intermediate/Zomato-Clone/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Zomato Clone](./Intermediate/Zomato-Clone) |  |  |
+
+---
+<!-- ###################################################################################################################### -->
+<!-- ###################################################################################################################### -->
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1
+
+| <img src="./Advanced/Audio-Analyzer/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Garden-Planning-Website/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Hackathon-Tracker/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Audio Analyzer](./Advanced/Audio-Analyzer) | [Garden Planning Website](./Advanced/Garden-Planning-Website) | [Hackathon Tracker](./Advanced/Hackathon-Tracker) |    
+
+#### :zap: Row 2
+
+| <img src="./Advanced/Markdown-Previewer/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Moon-Phase-Visibility/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Recipe-Finder/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Markdown Previewer](./Advanced/Markdown-Previewer) | [Moon Phase Visibility](./Advanced/Moon-Phase-Visibility) | [Recipe Finder](./Advanced/Recipe-Finder) |        
+
+#### :zap: Row 3
+
+| <img src="./Advanced/Resume-Builder/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Sort-Visualizer/screenshot.webp" width="300px" height="180px"> | <img src="./Advanced/Typing-Test/screenshot.webp" width="300px" height="180px"> |
+|:--:|:--:|:--:|
+| [Resume Builder](./Advanced/Resume-Builder) | [Sort Visualizer](./Advanced/Sort-Visualizer) | [Typing Test](./Advanced/Typing-Test) |
+
+#### :zap: Row 4
+
+| <img src="./Advanced/Vocabulary-Builder/screenshot.webp" width="300px" height="180px"> |  |  |
+|:--:|:--:|:--:|
+| [Vocabulary Builder](./Advanced/Vocabulary-Builder) |  |  |
+
+
+</div>
 
 ![Line](https://github.com/Avdhesh-Varshney/WebMasterLog/assets/114330097/4b78510f-a941-45f8-a9d5-80ed0705e847)
 
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
diff --git a/Vue-JS-Projects/README.md b/Vue-JS-Projects/README.md
index 305e22b6..3b3a013a 100644
--- a/Vue-JS-Projects/README.md
+++ b/Vue-JS-Projects/README.md
@@ -7,29 +7,43 @@
 <div align="center">
 
 ## :zap: Available Projects 🎉
-<!-- Rules to Add project are as follows:
 
-1. Attach the project name as shown below or you can refer from the README file of Vanilla-JS.
-[To Do List](./Basic/To-Do-List)
+![Basic Level](https://img.shields.io/badge/Level-Basic-00FF00?style=for-the-badge&logo=codeigniter)
 
-2. If alignment is distorted, i will manage it. You have just added you project here according to serial number. 
+#### :zap: Row 1
 
-3. Add the category of the project using the provided links below here, according to your project.
+| <img src="./Basic/Markdown-Previewer/screenshot.webp" width="300px" height="180px"> | <img src="./Basic/Quote-Generator/screenshot.webp" width="300px" height="180px"> |  |
+|:--:|:--:|:--:|
+| [Markdown Previewer](./Basic/Markdown-Previewer) | [Quote Generator](./Basic/Quote-Generator) |  |
 
-![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) 
-![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) 
-![Advanced](https://img.shields.io/badge/Advanced-FF0000?style=for-the-badge) 
 
--->
+</div>
+
+---
 
+<div align="center">
 
-| S.No  | Project Name | Category |
-|-------|--------------|----------|
-|   1   | [Markdown Previewer](./Basic/Markdown-Previewer) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   2   | [Quote-Generator](./Basic/Quote-Generator) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |
-|   3   | [Expense Tracker](./Intermediate/Expense-Tracker/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
-|   4   | [Google-Keep](./Intermediate//Google-Keep/) | ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
+![Intermediate Level](https://img.shields.io/badge/Level-Intermediate-FFD700?style=for-the-badge&logo=codeigniter)
 
+#### :zap: Row 1
+
+| <img src="./Intermediate/Expense-Tracker/screenshot.webp" width="300px" height="180px"> | <img src="./Intermediate/Google-Keep/screenshot.webp" width="300px" height="180px"> |  |
+|:--:|:--:|:--:|
+| [Expense Tracker](./Intermediate/Expense-Tracker) | [Google Keep](./Intermediate/Google-Keep) |  |
+
+</div>
+
+
+---
+<div align="center">
+
+![Advanced Level](https://img.shields.io/badge/Level-Advanced-FF0000?style=for-the-badge&logo=codeigniter)
+
+#### :zap: Row 1 
+
+|  |  |  |
+|:--:|:--:|:--:|
+|  |  |  |
 
 
 </div>
@@ -40,4 +54,5 @@
 <div align="center">
 	<h3>Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
 </div>
-<a href="#top"><img src="https://img.shields.io/badge/-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>
+
+<a href="#top"><img src="https://img.shields.io/badge/⬆-Back%20to%20Top-red?style=for-the-badge" align="right"/></a>