Brush Ninja

Free Digital Creativity

advert

← Help‹ Code Ninja

Code Ninja Tutorial - Getting Started

Code Ninja is a unique and engaging way to learn programming. It combines the simplicity and visual appeal of the Logo programming language with elements inspired by JavaScript. This blend makes it an ideal platform for beginners to start their coding journey, as well as for those looking to transition to more advanced languages like JavaScript.

At its core, Code Ninja allows you to control a pointer on a canvas, creating drawings and patterns with simple commands. This concept is borrowed from Logo, where commands are used to control a ‘turtle’ to create shapes. Code Ninja enhances this idea with syntax and structures inspired by JavaScript, making the transition to web programming smoother for learners.

Getting Started with Code Ninja

To get started all you have to do is visit the Code Ninja webpage. The app runs directly in your browser, so there’s no need to install anything. Let’s dive into creating your first drawing!

The Interface

The command input area is on the left, and is where you’ll type your Code Ninja commands.

The canvas on the right is your drawing space. This will draw the commands. To run your script you should press the Draw button which is directly above the canvas.

To save your created image you can press the Download Image button.

Your First Code Ninja Creation

Let’s create a simple square. This will introduce you to basic movement commands.

Type the following code in the command input area. We will go over the code in future tutorials, for now you can just copy and paste it:

forward 100
right 90
forward 100
right 90
forward 100
right 90
forward 100
right 90

This code moves the pointer forward by 100 units, then turns it right by 90 degrees and repeats this 3 more times creating a square.

Congratulations!

You’ve just drawn your first shape using Code Ninja. Experiment with changing the numbers in the code to see how it affects the shape.

Tutorials