Project information

• Category: JavaScript
• Project date: July, 2020
• Project URL: https://github.com/RobertWestbrook/Pixel-art-Project

This Started as a project that I did for Udacity and now I just use it to illustrate a degree of competance in the Vanilla JavaScript. This can be implemented into any web layout and can be customized pretty simply with a little prior knowledge of HTML and CSS.

Logic

• All of the logic was built using Vanilla JavaScript. The basic function of this script is to access the form, which contains the desired number of pixels for the width and the height of the canvas and then draw them to the screen using nested loop functions. Also inside these functions lies the event handlers that listen for when a cell is clicked and then change it to the color that is indicated on the color picker. Each cell that is created on clicking the submit now functions almost as a button to be clicked and altered. Each time the submit button is pressed the canvas is then cleared. The bulk of this logic requires real time query of DOM to indicate what needs to happen upon each click or submit.
• The HTML foundation and the CSS Code that can be found on the Github originated from Udacity with minor tweaks from me. The JavaScript was my own design. During the implementation into this internally framed VenoBox Version of this app I actually modified the HTML and the CSS pretty heavily in order to seamlessly implement it into this BootstrapJS build website.

Tech Stack Used:

• JavaScript

• HTML

• Bootstrap (Just implementing on this page)