{"id":20377040,"url":"https://github.com/vishanurag/canvas-editor","last_synced_at":"2025-10-07T23:57:46.213Z","repository":{"id":258261156,"uuid":"821456909","full_name":"vishanurag/Canvas-Editor","owner":"vishanurag","description":"This is a simple web project that is made with an aim to learn about canvas element of html. Now, this project is open to all of the amazing contributors.","archived":false,"fork":false,"pushed_at":"2024-12-24T18:29:19.000Z","size":9230,"stargazers_count":70,"open_issues_count":491,"forks_count":294,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-01T11:48:29.845Z","etag":null,"topics":["beginner-friendly","canvas","gssoc","gssoc-ext","gssoc24","hacktoberfest","hacktoberfest-accepted","html-css-javascript","open-source","project","web"],"latest_commit_sha":null,"homepage":"https://vishanurag.github.io/Canvas-Editor/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vishanurag.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"Contributing.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-06-28T15:24:39.000Z","updated_at":"2025-02-13T19:01:36.000Z","dependencies_parsed_at":"2024-10-25T14:46:12.401Z","dependency_job_id":"8dff83c7-0df5-420a-be9a-b6dfb03a8057","html_url":"https://github.com/vishanurag/Canvas-Editor","commit_stats":null,"previous_names":["vishanurag/canvas-editor"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vishanurag%2FCanvas-Editor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vishanurag%2FCanvas-Editor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vishanurag%2FCanvas-Editor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vishanurag%2FCanvas-Editor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vishanurag","download_url":"https://codeload.github.com/vishanurag/Canvas-Editor/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241928527,"owners_count":20043820,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["beginner-friendly","canvas","gssoc","gssoc-ext","gssoc24","hacktoberfest","hacktoberfest-accepted","html-css-javascript","open-source","project","web"],"created_at":"2024-11-15T01:40:51.452Z","updated_at":"2025-10-07T23:57:46.207Z","avatar_url":"https://github.com/vishanurag.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\n# 🎨 Canvas Editor 🖌️\n\n\n\u003cimg  src=\"https://readme-typing-svg.herokuapp.com?color=45ffaa\u0026center=true\u0026vCenter=true\u0026size=40\u0026width=900\u0026height=80\u0026lines=Welcome+to+Canvas+Editor!\"/\u003e\n\u003c/div\u003e\n\n\u003cdiv align = \"center\"\u003e\n\u003cbr\u003e\n\n\u003ctable align=\"center\"\u003e\n    \u003cthead align=\"center\"\u003e\n        \u003ctr border: 1px;\u003e\n            \u003ctd\u003e\u003cb\u003e🌟 Stars\u003c/b\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cb\u003e🍴 Forks\u003c/b\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cb\u003e🐛 Issues\u003c/b\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cb\u003e🔔 Open PRs\u003c/b\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cb\u003e🔕 Close PRs\u003c/b\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cb\u003e🛠️ Languages\u003c/b\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cb\u003e👥 Contributors\u003c/b\u003e\u003c/td\u003e\n        \u003c/tr\u003e\n     \u003c/thead\u003e\n    \u003ctbody\u003e\n         \u003ctr\u003e\n            \u003ctd\u003e\u003cimg alt=\"Stars\" src=\"https://img.shields.io/github/stars/vishanurag/Canvas-Editor?style=flat\u0026logo=github\"/\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cimg alt=\"Forks\" src=\"https://img.shields.io/github/forks/vishanurag/Canvas-Editor?style=flat\u0026logo=github\"/\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cimg alt=\"Issues\" src=\"https://img.shields.io/github/issues/vishanurag/Canvas-Editor?style=flat\u0026logo=github\"/\u003e\u003c/td\u003e\n            \u003ctd\u003e\u003cimg alt=\"Open Pull Requests\" src=\"https://img.shields.io/github/issues-pr/vishanurag/Canvas-Editor?style=flat\u0026logo=github\"/\u003e\u003c/td\u003e\n           \u003ctd\u003e\u003cimg alt=\"Close Pull Requests\" src=\"https://img.shields.io/github/issues-pr-closed/vishanurag/Canvas-Editor?style=flat\u0026color=critical\u0026logo=github\"/\u003e\u003c/td\u003e\n           \u003ctd\u003e\u003cimg alt=\"GitHub language count\" src=\"https://img.shields.io/github/languages/count/vishanurag/Canvas-Editor?style=flat\u0026color=green\u0026logo=github\"\u003e\u003c/td\u003e\n         \u003ctd\u003e\u003cimg alt=\"GitHub Contributors count\" src=\"https://img.shields.io/github/contributors/vishanurag/Canvas-Editor?style=flat\u0026color=blue\u0026logo=github\"/\u003e\u003c/td\u003e\n        \u003c/tr\u003e\n    \u003c/tbody\u003e\n\u003c/table\u003e\n\u003c/div\u003e\n\u003cbr\u003e\n\n\u003c!--Line--\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif\" width=\"900\"\u003e \n\n\u003ch2\u003eOpen-Source-Programmes⭐\u003c/h2\u003e\n\n\u003c!-- Added Hacktoberfest 2024 and GSSoC Extended 2024 banners --\u003e\n### This project is now OFFICIALLY accepted for\n\n\u003ctable\u003e\n\n   \u003ctr\u003e\n      \u003cth\u003eEvent Logo\u003c/th\u003e\n      \u003cth\u003eEvent Name\u003c/th\u003e\n      \u003cth\u003eEvent Description\u003c/th\u003e\n   \u003c/tr\u003e\n   \u003ctr\u003e\n      \u003ctd\u003e\u003cimg src=\"https://github.com/Annapoornaaradhya/Canvas-Editor/blob/readme/gssocextd.jpg\" width=\"200\" height=\"auto\" loading=\"lazy\" alt=\"GSSoC 25\"/\u003e\u003c/td\u003e\n      \u003ctd\u003eGirlScript Summer of Code 2025\u003c/td\u003e\n      \u003ctd\u003eGirlScript Summer of Code is a three-month-long Open Source Program conducted every summer by GirlScript Foundation. It is an initiative to bring more beginners to Open-Source Software Development.\u003c/td\u003e\n   \u003c/tr\u003e\n    \u003ctr\u003e\n      \u003ctd\u003e\u003cimg src=\"https://github.com/Annapoornaaradhya/Canvas-Editor/blob/readme/hacktoberfest.png\" width=\"200\" height=\"auto\" loading=\"lazy\" alt=\"Hacktoberfest 2024\"/\u003e\u003c/td\u003e\n      \u003ctd\u003eHacktoberfest 2024\u003c/td\u003e\n      \u003ctd\u003eHacktoberfest is a month-long celebration of open source software run by DigitalOcean, GitHub, and Twilio. It encourages contributions to open source projects and promotes a global community of developers.\u003c/td\u003e\n   \u003c/tr\u003e\n\n\u003c/table\u003e\n\u003cbr/\u003e\n\u003c!--Line--\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif\" width=\"900\"\u003e\n\n\u003ch2\u003eHi there,\u003cimg src=\"https://raw.githubusercontent.com/nixin72/nixin72/master/wave.gif\" height=\"40\"width=\"40\" /\u003e Enjoy the World of Open source contribution \u003cimg src='https://raw.githubusercontent.com/ShahriarShafin/ShahriarShafin/main/Assets/handshake.gif' width=\"60px\" height=\"35\"\u003e \u003c/h2\u003e\n\n\u003cstrong\u003eHello Coders!!👨‍💻\u003cbr\u003e I am Aanurag Vishwakarma, an aspiring Web developer🤖. Here is the project on front-end Web Development.\u003c/strong\u003e\n\n\u003c!--Line--\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif\" width=\"900\"\u003e\n\n## Table of Contents\n- [Overview](#overview)\n- [Project Structure](#project-structure)\n- [Website Preview](#website-preview)\n- [Technologies Used](#technologies-used)\n- [How to make a Pull Request](#how-to-make-a-pull-request)\n- [Troubleshooting](#troubleshooting)\n- [Contributors](#contributors)\n- [Stargazers](#stargazers)\n- [Forkers](#forkers)\n- [🌐 Connect with Me](#-connect-with-me)\n- [📝 License](#-license)\n\n## Overview\n\u003cul\u003e\n  \u003cli\u003e🎨 This repository contains my project on a Canvas Editor using HTML, CSS, Bootstrap, and JavaScript.\u003c/li\u003e\n  \u003cli\u003e🖼️ It includes a webpage with a canvas element that allows you to style text content as needed (made for fun purposes 🎉).\u003c/li\u003e\n  \u003cli\u003e🚀 We welcome all contributions to make this a fantastic resource for other users.\u003c/li\u003e\n  \u003cli\u003e💻 Jump in and contribute to this grand project\u003c/li\u003e\n  \u003cli\u003e📚 Read the guidelines and get started building! 🛠️\u003c/li\u003e\n  \u003cli\u003e🚀 The project now supports setting background images and colors, enhancing the customization options for your canvas!\u003c/li\u003e\n  \u003cli\u003e🎉 This project is open to contributions from the community. Jump in and help make it a great resource!\u003c/li\u003e\n     \n\u003c/ul\u003e\n\n## Project Structure\n\n\u003c!-- START_STRUCTURE --\u003e\n```\n├── 404.html\n├── Blog_page.html\n├── CODE_OF_CONDUCT.md\n├── Contributing.md\n├── Faq.html\n├── Feedback.html\n├── LICENSE\n├── Mini-canvas-painting-bird-of-paradise-1.jpg\n├── README.md\n├── about-us.html\n├── about.html\n├── auth.css\n├── auth.html\n├── basictemp.html\n├── blog.html\n├── canva.css\n├── canva.html\n├── canva.js\n├── canva.md\n├── canvas.jpg\n├── community.html\n├── contact-app.js\n├── contact-pagePic1.jpeg\n├── contact-pagePic2.jpeg\n├── contact-pagePic3.jpeg\n├── contact-style.css\n├── contact.html\n├── contributors.html\n├── download (1).webp\n├── edition.html\n├── feature.webp\n├── gssocextd.webp\n├── icon-192x192.png\n├── icon-512x512.png\n├── index.html\n├── login.html\n├── logo4.png\n├── m_gen_canvas-square-p1_72f6de51-aaf7-4177-b19a-c8aae91404be.avif\n├── manifest.json\n├── package-lock.json\n├── package.json\n├── popup.jpg\n├── popup.js\n├── privacy.html\n├── profile.html\n├── profileedit.html\n├── repo_structure.txt\n├── repreviewfix.html\n├── resources/\n│   ├── favicon.ico\n│   └── painting_image.webp\n├── review.html\n├── script1.js\n├── scripts.js\n├── signup.html\n├── src/\n│   ├── Contributor.css\n│   ├── Contributor.html\n│   ├── Contributor.js\n│   ├── Scripts/\n│   │   ├── BacktoTop.js\n│   │   ├── Canvas.js\n│   │   ├── Save.js\n│   │   ├── contributor.js\n│   │   └── preloader.js\n│   ├── Styles/\n│   │   ├── Responsive.css\n│   │   ├── Style.css\n│   │   ├── Style_Blog_page.css\n│   │   ├── contact.css\n│   │   ├── contact.html\n│   │   ├── contributor.css\n│   │   ├── scroll.css\n│   │   └── signup.css\n│   ├── bootstrap/\n│   │   └── css/\n│   │       ├── bootstrap-grid.css\n│   │       ├── bootstrap-grid.css.map\n│   │       ├── bootstrap-grid.min.css\n│   │       ├── bootstrap-grid.min.css.map\n│   │       ├── bootstrap-grid.rtl.css\n│   │       ├── bootstrap-grid.rtl.css.map\n│   │       ├── bootstrap-grid.rtl.min.css\n│   │       ├── bootstrap-grid.rtl.min.css.map\n│   │       ├── bootstrap-reboot.css\n│   │       ├── bootstrap-reboot.css.map\n│   │       ├── bootstrap-reboot.min.css\n│   │       ├── bootstrap-reboot.min.css.map\n│   │       ├── bootstrap-reboot.rtl.css\n│   │       ├── bootstrap-reboot.rtl.css.map\n│   │       ├── bootstrap-reboot.rtl.min.css\n│   │       ├── bootstrap-reboot.rtl.min.css.map\n│   │       ├── bootstrap-utilities.css\n│   │       ├── bootstrap-utilities.css.map\n│   │       ├── bootstrap-utilities.min.css\n│   │       ├── bootstrap-utilities.min.css.map\n│   │       ├── bootstrap-utilities.rtl.css\n│   │       ├── bootstrap-utilities.rtl.css.map\n│   │       ├── bootstrap-utilities.rtl.min.css\n│   │       ├── bootstrap-utilities.rtl.min.css.map\n│   │       ├── bootstrap.css\n│   │       ├── bootstrap.css.map\n│   │       ├── bootstrap.min.css\n│   │       ├── bootstrap.min.css.map\n│   │       ├── bootstrap.rtl.css\n│   │       ├── bootstrap.rtl.css.map\n│   │       ├── bootstrap.rtl.min.css\n│   │       └── bootstrap.rtl.min.css.map\n│   └── images/\n│       ├── about-bg.webp\n│       ├── art-design-1.webp\n│       ├── art-design-2.webp\n│       ├── art-design-3.webp\n│       ├── art-design-4.webp\n│       ├── art-design-5.webp\n│       ├── art-design-6.webp\n│       ├── banner-bg.webp\n│       ├── blog-p-1.webp\n│       ├── blog-p-2.webp\n│       ├── blog-p-3.webp\n│       ├── blog-p-4.webp\n│       ├── blog-p-5.webp\n│       └── blog-p-6.webp\n├── story.jpg\n├── style.css\n├── style1.css\n├── sw.js\n├── testimonial.html\n├── testp.css\n├── testp.js\n├── tooltips.html\n├── tutorial.html\n├── visi.css\n├── visi.js\n├── visitor.css\n├── visitor.js\n└── welcome.html\n```\n\u003c!-- END_STRUCTURE --\u003e\n\n### New Features ✨\n\u003cli\u003e Background Image: Easily set an image as the background of your canvas to create more visually appealing designs\u003c/li\u003e\n\u003cli\u003e Background Color: You can now add a custom background color to the canvas with ease!\u003c/li\u003e\n\n## Website Preview\n\n![image](https://github.com/user-attachments/assets/02614ccd-b2ec-492a-9f02-f53d69e9d2b9)\n\n![image](https://github.com/user-attachments/assets/7f355f78-2846-441d-b10d-73958b311f79)\n\n\n### How to Use\nTo change the background color or image:\n\n\u003cli\u003e Navigate to the canvas options on the webpage!\u003c/li\u003e\n\u003cli\u003e For background color: Select a color from the color picker to apply it to the canvas!\u003c/li\u003e\n\u003cli\u003e For background image: Upload an image file, and it will be displayed as the canvas background!\u003c/li\u003e\n\n\u003cbr\u003e\n\n\u003c!--Line--\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif\" width=\"900\"\u003e \n\n## Technologies Used\n\n\u003cp\u003e\n  \u003ca href=\"https://www.w3schools.com/html/\"\u003e \u003cimg src=\"https://img.icons8.com/color/70/000000/html-5--v1.png\" alt=\"HTML\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.w3schools.com/css/\"\u003e \u003cimg src=\"https://img.icons8.com/color/70/000000/css3.png\" alt=\"CSS\" /\u003e\u003c/a\u003e\n   \u003ca href=\"https://www.w3schools.com/js/\"\u003e \u003cimg src=\"https://img.icons8.com/?size=70\u0026id=PXTY4q2Sq2lG\u0026format=png\u0026color=000000\" alt=\"js\" /\u003e\u003c/a\u003e\n\u003c/p\u003e\n\u003cp align=\"right\"\u003e\u003ca href=\"#top\"\u003e\u003cimg src=\"https://img.shields.io/badge/Move%20to%20top-Blue?style=plastic\" alt=\"Back To Top\"\u003e\u003c/a\u003e\u003c/p\u003e\n\n\u003c!--Line--\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif\" width=\"900\"\u003e\n\n\u003ch2\u003eGetting Started💥\u003c/h2\u003e\n\n## How to make a Pull Request?\n\n**1.** Start by forking the [**Canvas-Editor**](https://github.com/vishanurag/Canvas-Editor) repository. Click on the \u003ca href=\"https://github.com/vishanurag/Canvas-Editor/fork\"\u003e\u003cimg src=\"https://i.imgur.com/G4z1kEe.png\" height=\"21\" width=\"21\"\u003e\u003c/a\u003e symbol at the top right corner.\n\n**2.** Clone your forked repository:\n\n```bash\ngit clone https://github.com/\u003cyour-github-username\u003e/Canvas-Editor\n```\n\n**3.** Navigate to the new project directory:\n\n```bash\ncd Canvas-Editor\n```\n\n**4.** Set upstream command:\n\n```bash\ngit remote add upstream https://github.com/vishanurag/Canvas-Editor\n```\n\n**5.** Create a new branch:\n\n```bash\ngit checkout -b YourBranchName\n```\n\n\u003ci\u003eor\u003c/i\u003e\n\n```bash\ngit branch YourBranchName\ngit switch YourBranchName\n```\n\n**6.** Sync your fork or local repository with the origin repository:\n\n- In your forked repository click on `Fetch upstream`.\n- Click `Fetch and merge`.\n\n### Alternatively, Git CLI way to Sync forked repository with origin repository:\n\n```bash\ngit fetch upstream\n```\n\n```bash\ngit merge upstream/main\n```\n\n### [Github Docs](https://docs.github.com/en/github/collaborating-with-pull-requests/addressing-merge-conflicts/resolving-a-merge-conflict-on-github) for Syncing\n\n**7.** Make your changes to the source code.\n\n**8.** Stage your changes and commit:\n\n\n⚠️ **Make sure** not to run the commands `git add .` or `git add *`. Instead, stage your changes for each file/folder\n\n```bash\ngit add file/folder\n```\n\n```bash\ngit commit -m \"\u003cyour_commit_message\u003e\"\n```\n\n**9.** Push your local commits to the remote repository:\n\n```bash\ngit push origin YourBranchName\n```\n\n**10.** Create a [Pull Request](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request)!\n\n **Congratulations! You've made your first contribution! 🙌🏼**\n\u003cp align=\"right\"\u003e\u003ca href=\"#top\"\u003e\u003cimg src=\"https://img.shields.io/badge/Move%20to%20top-Blue?style=plastic\" alt=\"Back To Top\"\u003e\u003c/a\u003e\u003c/p\u003e\n\n\u003c!--Line--\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif\" width=\"900\"\u003e \n\n # Project Admin⚡\n \n\u003ctable\u003e\n\u003ctr\u003e\n\u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/vishanurag\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/126074487?v=4\" width=150px height=150px /\u003e\u003c/a\u003e\u003c/br\u003e \u003ch4 style=\"color:red;\"\u003eAnurag Vishwakarma\u003c/h4\u003e\n \u003ca href=\"https://www.linkedin.com/in/anuragvishwakarma/\"\u003e\u003cimg src=\"https://img.icons8.com/fluency/2x/linkedin.png\" width=\"32px\" height=\"32px\"\u003e\u003c/img\u003e\u003c/a\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\n # Project Mentor⚡🧑‍💻\n \n\u003ctable\u003e\n\u003ctr\u003e\n\u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/ShirshenduR\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/94801572?v=4\" width=150px height=150px /\u003e\u003c/a\u003e\u003c/br\u003e \u003ch4 style=\"color:red;\"\u003eShirshendu R Tripathi\u003c/h4\u003e\n \u003ca href=\"https://www.linkedin.com/in/shirshendur/\"\u003e\u003cimg src=\"https://img.icons8.com/fluency/2x/linkedin.png\" width=\"32px\" height=\"32px\"\u003e\u003c/img\u003e\u003c/a\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\n # Prev. Project Mentor⚡🧑‍💻\n \n\u003ctable\u003e\n\u003ctr\u003e\n\u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/somyadipghosh\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/77097996?v=4\" width=150px height=150px /\u003e\u003c/a\u003e\u003c/br\u003e \u003ch4 style=\"color:red;\"\u003eSomyadip Ghosh\u003c/h4\u003e\n \u003ca href=\"https://www.linkedin.com/in/somyadipghosh/\"\u003e\u003cimg src=\"https://img.icons8.com/fluency/2x/linkedin.png\" width=\"32px\" height=\"32px\"\u003e\u003c/img\u003e\u003c/a\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\n\n\u003c!--Line--\u003e\n\u003cimg src=\"https://user-images.githubusercontent.com/74038190/212284100-561aa473-3905-4a80-b561-0d28506553ee.gif\" width=\"900\"\u003e \n\n## Troubleshooting\n\n### Common Issues\n\n1. **Installation Error: `npm install` fails**\n   - **Symptoms:** Error messages during the installation process.\n   - **Solution:** \n     - Ensure you have the latest version of Node.js and npm installed. You can check your versions using `node -v` and `npm -v`.\n     - Clear the npm cache by running `npm cache clean --force`.\n     - Try deleting the `node_modules` folder and the `package-lock.json` file, then rerun the installation with `npm install`.\n\n2. **Wallet Connection Issues**\n   - **Symptoms:** Unable to connect to MetaMask.\n   - **Solution:**\n     - Verify that MetaMask is installed and enabled in your browser.\n     - Check that you are on the correct network (e.g., Rinkeby) in both your app and MetaMask.\n     - Ensure that your wallet is unlocked. If issues persist, refresh the page or restart your browser.\n\n3. **Smart Contract Deployment Fails**\n   - **Error Message:** `Revert: Contract validation failed`\n   - **Solution:** \n     - Double-check that all contract parameters are accurate and align with your contract’s requirements.\n     - Make sure you have sufficient Ether in your wallet to cover gas fees.\n     - Confirm that you are deploying to the intended network.\n\n### Configuration Issues\n- Ensure that the `.env` file is properly configured with the necessary environment variables, including your Infura Project ID and wallet private key. \n\n### Development Environment\n- Make sure you are using Node.js version **16.x.x** or **18.x.x** and that all required npm packages are installed. You can check your current Node.js version using `node -v`.\n\n### Tips for Optimizing Performance\n- Minimize the number of unnecessary background tasks during deployment to improve efficiency.\n- Monitor gas fees closely and consider deploying during off-peak hours to reduce costs.\n\n### Contact for Support\nIf you encounter an issue not listed here, please reach out via [GitHub Issues](https://github.com/vishanurag/Canvas-Editor/issues).\n\n  \n## Contributors\n\nWe are immensely grateful to the following amazing individuals who have contributed their time, effort, and expertise to make this project better. Your contributions, whether through code, documentation, bug reports, or feature suggestions, have been invaluable. Thank you for helping us build and improve Canvas Editor 🌟✨\n\nYour dedication and hard work are what drive this project forward, and we couldn't have done it without you. Each contribution, no matter how small, plays a crucial role in our journey towards creating a more efficient and user-friendly tool for developers. 🙌💻\n\nWe look forward to your continued support and collaboration. Together, we can achieve even greater heights! 🚀🌐\n\nThank you once again to all our contributors! Your efforts are truly appreciated. 💖👏\n\n\u003cp align=\"center\"\u003e\n      \u003ca href=\"https://github.com/vishanurag/Canvas-Editor/graphs/contributors\"\u003e\n         \u003cimg src=\"https://api.vaunt.dev/v1/github/entities/vishanurag/repositories/Canvas-Editor/contributors?format=svg\u0026limit=54\" width=\"700\" height=\"250\" /\u003e\n      \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cbr\u003e\n\n\n## Stargazers\n\n\n\u003cdiv align='center'\u003e\n\n[![Stargazers repo roster for @vishanurag/Canvas-Editor](https://reporoster.com/stars/vishanurag/Canvas-Editor)](https://github.com/vishanurag/Canvas-Editor/stargazers)\n\n\u003c/div\u003e\n\n## Forkers\n\n\u003cdiv align='center'\u003e\n\n[![Forkers repo roster for @vishanurag/Canvas-Editor](https://reporoster.com/forks/vishanurag/Canvas-Editor)](https://github.com/vishanurag/Canvas-Editor/network/members)\n\n\u003c/div\u003e\n\n\u003ca id=\"-connect-with-me\"\u003e\u003c/a\u003e\n## 🌐 Connect with Me\n\n\n\u003cdiv align=\"center\"\u003e\n    \u003ca href=\"https://www.linkedin.com/in/anuragvishwakarma/\"\u003e\n        \u003cimg src=\"https://img.shields.io/badge/LinkedIn-0077B5?style=flat-square\u0026logo=linkedin\u0026logoColor=white\" alt=\"LinkedIn\" width=\"100\" height=\"30\"/\u003e\n    \u003c/a\u003e\n    \u003ca href=\"mailto:anuraga2005@gmail.com\"\u003e\n        \u003cimg src=\"https://img.shields.io/badge/Email-D14836?style=flat-square\u0026logo=gmail\u0026logoColor=white\" alt=\"Email\" width=\"100\" height=\"30\"/\u003e\n    \u003c/a\u003e\n    \u003ca href=\"https://github.com/vishanurag\"\u003e\n        \u003cimg src=\"https://img.shields.io/badge/GitHub-181717?style=flat-square\u0026logo=github\u0026logoColor=white\" alt=\"GitHub\" width=\"100\" height=\"30\"/\u003e\n    \u003c/a\u003e\n    \u003ca href=\"https://api.whatsapp.com/send/?phone=%2B917693993165\u0026text\u0026type=phone_number\u0026app_absent=0\"\u003e\n        \u003cimg src=\"https://img.shields.io/badge/WhatsApp-25D366?style=flat-square\u0026logo=whatsapp\u0026logoColor=white\" alt=\"WhatsApp\" width=\"100\" height=\"30\"/\u003e\n    \u003c/a\u003e\n\u003c/div\u003e\n\n---\n\nThank you for visiting! Feel free to reach out through any of the links above.\n\n\u003ca id=\"-license\"\u003e\u003c/a\u003e\n## 📝 License\n\n\u003cdiv align=\"center\"\u003e\n\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](./LICENSE)\n\n\u003cbr\u003e\nThis project is licensed under the terms of the \u003cstrong\u003e\u003ca href=\"./LICENSE\"\u003eMIT License\u003c/a\u003e\u003c/strong\u003e. \u003cbr\u003e\nYou are free to use, modify, and distribute this project with proper attribution.\n\n\u003c/div\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvishanurag%2Fcanvas-editor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvishanurag%2Fcanvas-editor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvishanurag%2Fcanvas-editor/lists"}