HTML5 Canvas Drawing with Bitwise Patterns

Learn how to draw some really cool-looking patterns to the HTML5 canvas element using the 2D drawing context, Bitwise Operators, and the Modulo Operator.

Finished Project Code Sandbox:
0:00 Intro
1:29 Bitwise Opertors Overview
4:19 Modulo Operator Overview
5:05 Creating Patterns with Bitwise Operators and Modulo
8:53 Setting up a Canvas Element
10:08 Using the Canvas API and 2D Context to Draw
15:06 Using Loops to Draw At Each Coordinate
18:55 Setting up the Bitwise pattern functions
21:05 Tweaking the Pattern Configurations
25:00 Refactoring and adding Simple Animation

[darkferiousity]

Love it thank you very much this video was very helpful and might use something like this in my project. Working on react three fiber site atm although have gone through 20 different ways of moving the camera nothing going as planned yet haha, but I keep going until I find a solution.

[alvarobyrne]

hey! great channel! thanks a lot! but/and please increase the font size of your/the IDE/vsCode (insist in saying please), thanks in advance. dare to ask, even further, to hide side bar while not using it since it (only) takes a stroke of a key (ctrl+B) to toggle it's visibility (insist in thanking in advance), would say it's a not-hurting nice improvement in accesibility wise. cheers: continue with great work, great content: react-three-fiber being highlight.