Laurence Svekis

Laurence Svekis is a web technology enthusiast, educator, and author who has been working in the field for over 20 years. He has expertise in web development technologies, such as HTML, CSS, JavaScript, jQuery, Bootstrap, PHP, and MySQL. Svekis is a prolific course instructor on Udemy, with over 500,000 students enrolled in his courses. He has authored over 100 online courses, covering a wide range of web technologies and tools, such as Google Apps Script, WordPress, React, Node.js, Express.js, and MongoDB. His courses are known for their practical and hands-on approach, with a focus on real-world projects and examples. In addition to teaching, Svekis is also a published author, with several books to his name Svekis is passionate about empowering people with the skills and knowledge they need to succeed in the rapidly evolving field of web technology. He is committed to providing high-quality educational resources that are accessible to anyone, regardless of their background or experience level.

Clearing the Canvas with JavaScript

by

To clear the entire canvas ctx.clearRect(0, 0, canvas.width, canvas.height); Explanation: clearRect(x, y, width, height) clears the specified rectangular area and sets it to transparent black.  To clear the entire canvas, you can use the clearRect() method of the canvas’s 2D rendering context. This method clears the specified rectangular area, making it fully transparent. To clear … Read more

Creating Dashed Lines with JavaScript HTML5 Canvas

by

“Creating Dashed Lines with JavaScript & HTML5 Canvas! #WebDevelopment #JavaScript #HTML5Canvas #CodingTutorial #LearnToCode” YouTube Description: Dive into the fascinating world of web graphics with our latest tutorial on creating dashed lines using JavaScript and the HTML5 Canvas! This tutorial is perfect for beginners and seasoned developers alike, looking to add a unique visual touch to … Read more

Drawing Semi Circles and Multiple Circles with JavaScript

by

The code effectively draws a semi-circle on the canvas. The semi-circle has a radius of 50 pixels, its center is located at the point (100, 75), and it spans from the right side (3 o’clock position) to the left side (9 o’clock position) of its center. This is a simple example of how to use … Read more

Draw and Fill a Circle with HTML5 Canvas and JavaScript

by

Drawing a Circle and Filling it Draw a circle on the canvas ctx.beginPath(); ctx.arc(100, 75, 50, 0, 2 * Math.PI); ctx.stroke(); “Draw & Fill a Circle with HTML5 Canvas and JavaScript! #CodingTutorial #WebDsign #JavaScript #HTML5Canvas #LearnToCode” Dive into this engaging tutorial where we demonstrate how to draw and fill a circle using JavaScript and the … Read more

Easy JavaScript Canvas Tutorial Drawing a Line from Scratch

by

“Easy JavaScript Canvas Tutorial: Drawing a Line from Scratch! #LearnJavaScript #CodingTutorial #WebDevelopment #HTML5Canvas” Join us in this beginner-friendly tutorial where we dive into the basics of using JavaScript and HTML5 Canvas to draw a simple line. This video is perfect for anyone starting their journey in web development or looking to understand the fundamentals of … Read more

Drawing a SemiCircle in JavaScript HTML5 Canvas Tutorial

by

“Drawing a Semi-Circle in JavaScript: HTML5 Canvas Tutorial! #JavaScriptBasics #HTML5Canvas #DrawingTutorial #CodingSkills” Unlock the secrets of drawing with JavaScript on the HTML5 Canvas! In this detailed tutorial, we’ll show you step-by-step how to draw a semi-circle using JavaScript commands. Whether you’re a beginner or looking to refine your coding and artistic abilities, this video is … Read more

Create a Moving Rectangle Animation with JavaScript and HTML5

by

“Create a Moving Rectangle Animation with JavaScript & HTML5! #JavaScriptTutorial #HTML5Canvas #Animation #WebDevelopment” YouTube Description: Discover how to bring your web pages to life with our latest tutorial on creating a moving rectangle animation using JavaScript and the HTML5 Canvas API. This video is perfect for beginners looking to get hands-on with interactive web development. … Read more

Animating a Square Across the Screen with JavaScript and HTML5 Canvas

by

For a very simple example using requestAnimationFrame with an HTML5 canvas, let’s animate a small square moving across the canvas. This animation will continuously loop the square moving from left to right across the canvas, resetting its position to the left once it reaches the end of the canvas width. “Animating a Square Across the … Read more

Interactive Drawing with HTML5 Canvas and JavaScript

by

Unlock the power of HTML5 Canvas with our interactive tutorial on creating a dynamic drawing tool with JavaScript! This video dives deep into how to make your web pages interactive by responding to user mouse movements to draw lines on the canvas. Ideal for beginners and intermediate developers alike, this guide will take your web … Read more

Mastering HTML5 Canvas with JavaScript: Draw a Line

by

“Mastering HTML5 Canvas with JavaScript: Draw Your First Line! #LearnToCode #JavaScript #HTML5 #WebDevelopment” Dive into the world of web development with our latest tutorial on HTML5 Canvas and JavaScript! In this video, we break down the basics of using the <canvas> element to draw graphics on the web. Follow along as we demonstrate how to … Read more