My programs


Tutorials

Reminder: Don't forget to check out also the Blog, Videos and Download sections.

Tutorials and Projects

Introduction to coding

Intro to coding

Welcome to the wonderful world of coding! In this first lesson you'll learn how to write your first JavaScript instruction.

Start tutorial
Pixels and Coordinates

Pixels and Coordinates

Learn about Pixels, Resolution and Coordinates - important computer science concepts widely used in CodeGuppy.

Start tutorial
Expressions and Variables

Expressions and Variables

Expressions and variables are the core of any programming language. Learn about these JavaScript concepts using a fun lesson.

Start tutorial
JavaScript Functions

Functions

Create new JavaScript 'instructions' and achieve code modularization through the use of functions.

Start tutorial
Variables and Functions recap

Printing messages

In this lesson you'll recap variables, expressions and functions and learn about the concept of strings.

Start tutorial
Getting Started with codeguppy.com - a p5.js and p5play based platform

Getting started with codeguppy.com for p5.js developers

This tutorial is indended for users that are familiar with the p5.js library. Codeguppy.com integrates updated versions of p5.js, p5play and other libraries in a single platform.

Start tutorial
Artist - How to implement a drawing program in JavaScript

Artist

Draw colored lines, circles and other shapes with the awesome Artist program.

Start tutorial
Blocky - A pixel art editor in JavaScript

Blocky

Pixel art is awesome. This tutorial will show you how easy is to build a simple pixel art editor.

Start tutorial
Color Blocky - A pixel art editor in JavaScript

Color Blocky

Pixel art is awesome. With this tutorial you'll learn how to build your own pixel art editor.

Start tutorial
Breakout - How to implement a Breakout clone in JavaScript

Breakout

Breakout game is a classic. Learn how to recreate this game that will offer you hours of entertainment.

Start tutorial
Analog clock

Analog clock

With all the digital gadgets around us, analog clocks represents a classical beauty. Learn how to re-create one with our tutorial and a little bit of trigonometry.

Start tutorial
Micro draw

Micro draw

It is amazing that in a few lines of code you can create a draw program.

Start tutorial
Falling balloons

Falling balloons

Balloons are falling! Pop them all with your needle to win the game.

Start tutorial
Plot a function

Plot a function

A simple and efficient function plotter.

Start tutorial
Visual sort

Visual sort

Visualize what happens in computer memory during a common sort operation.

Start tutorial
Invaders

Invaders

Invaders game is one of the most well known classic games. Learn how to how to create your own custom clone of this game.

Start tutorial
Input text

Input text

Build an arcade style name input screen.

Start tutorial
Line artist

Line artist

Create amazing drawings and texts using colored line art.

Start tutorial
Micro spirograph

Micro spirograph

Tune our micro spirograph and enjoy the amazing shapes left behind.

Start tutorial
Magnetic needles

Magnetic needles

Have fun moving your mouse in a field of magnetic needles.

Start tutorial
Eyes mouse

Eyes mouse

Learn how to build the famous eyes that follow the mouse cursor.

Start tutorial
Movable

Movable

Have fun with our drawing while learn how to implement movable shapes.

Start tutorial
Musical Notes

Musical Notes

Play with the musical notes to create your symphony.

Start tutorial
Plane vs Objects

Plane vs Objects

Pilot the airplane and distroy all the objects before your crash into them.

Start tutorial
Planets

Planets

Learn how to create a simulation of our solar system with realistic planet movement.

Start tutorial
Pop balloons

Pop balloons

Use your keyboard typing skills to shoot all the balloons.

Start tutorial
Random shapes

Random shapes

A visually interesting demo using only random shapes.

Start tutorial
Computer poetry

Computer poetry

With a little bit of coding, your computer can be a poet. Have fun at the amazing writtings.

Start tutorial
Sliding puzzle

Sliding puzzle

Implement the classic sliding puzzle... and then have fun solving it. Perhaps you can even share it with your friends.

Start tutorial
Snake

Snake

Guide the snake around the obstacles to find the exit door.

Start tutorial
Sprite MouseMove

Sprite MouseMove

A small sprite animation on mouse move.

Start tutorial
Retro sprite

Retro sprite

Create a retro sprite using only an array of numbers.

Start tutorial
Falling spiders

Falling spiders

Use the binary system to efficientize the retro sprite storage... and then animate the sprite to implement falling spiders effect.

Start tutorial
Tic Tac Toe

Tic Tac Toe

Implement the classical game of Tic Tac Toe and play a match against computer.

Start tutorial
Pong

Pong

Play a game of Pong against the computer. It can be pretty challenging.

Start tutorial
Random circle

Random circle

Watch how a series of dots are moving to reconstruct a circle.

Start tutorial
Jagged shapes

Jagged shapes

When straight lines and circles are not enought, you can implement jagged shapes.

Start tutorial
Virtual screen

Virtual screen

Implement the game mechanism for virtual world scrolling games.

Start tutorial
Connect the dots

Connect the dots

Learnd how to implement 'Connect the dots' game that you can share it with your friends and family.

Start tutorial
Character editor

Character editor

Implement an 8x8 character editor that you can use to edit your own fonts or sprites.

Start tutorial
User defined characters

User defined characters

Learn how to define and write with 8x8 characters while exercising binary to hex transformation in the process.

Start tutorial
Bitmap font

Bitmap font

Take the writing with 8x8 bitmap fonts to a new level.

Start tutorial
LED scrolling

LED scrolling

Implement a classical scrolling LED display to transmit your messages in style.

Start tutorial
LED matrix

LED matrix

Learn how to implement a color LED matrix for displaying your messages.

Start tutorial
Turtle graphics

Turtle graphics

Turtle graphics is the flagship feature of Logo programming language. See how easy is to add Logo like commands to your favorite JavaScript language.

Start tutorial
Guessing game

Guessing game

Pick an object from the display list then let the computer find the answer by answering a series of questions.

Start tutorial
Lava lamp

Lava lamp

Create nice animations that simulate a red and white lavalamp.

Start tutorial
Color lava lamp

Color lava lamp

Simulate a color lavalamp using metaballs.

Start tutorial
Seven segment display

Seven segment display

Learn what it takes to create a classic seven segment display to display the current time in style.

Start tutorial
Word search

Word search

Send your friends a special greeting... To see they first have to solve a classic game of word search.

Start tutorial
Caesar Cipher

Caesar Cipher

Exchange secret messages with your friends by encrypting and decrypting them with the Caesar cipher.

Start tutorial
Fibonacci

Fibonacci

Calculate numbers from the Fibonacci series while learning about recursion and big numbers.

Start tutorial
Prime numbers

Prime numbers

Let your computer generate prime numbers with amazing speed.

Start tutorial
Console math

Console math

Create a simple math game while coding in 'console' mode.

Start tutorial
Escape the lab

Escape the lab

Escape the lab is text adventure game that requires imagination rather than skills.

Start tutorial