Integrate HTML canvas for illustrator environment

[ayushnagar123]

What you will need to know?

Basics of HTML Canvas, CSS.

Integrate HTML canvas for illustrator environment

Create a new route in codebadge project for new badge creation. The route shall be directed to a new page which shall have an HTML Canvas integrated where the user can create their badges. This canvas must be centrally aligned and must be white.

Steps by step

• install codebadge project. by following steps:-

1. clone the repository
2. in the folder, run npm install to set up the repository and then npm run serve to run the code,

• once you have installed, create a new view in the view folder with name newBadge
• create a new file newBadge.vue.
• integrate canvas. To will need to add script tag and change dom properties of canvas such as context, height and width.

Expected Outcome

The route /newBadge shall be made and must have an HTML canvas integrated. for example, you can see the screenshot provided in the GitHub issue above.

Resources & References (Where to Start)

You can go through HTML Canvas tutorial and edit its code. You can refer this website for sample The Marauders Canvas. Commit your code on Codebadge development branch. Refer sample drawing app made in simple HTML, css and javascript for help.

Extras

Just follow the readme whenever you are stuck. Visit Codeuino's Website in case of any doubts.