To make the snake move we'll be working in the update function of game.js.

First of all, we create event listeners for controlling the direction of the snake with the arrow keys.

The actual movement is a bit complex, since update is triggered at a very quick rate, and if we move the snake every time it's called we would end up with one uncontrollably speedy reptile. To change this, we've set up an if statement that checks weather this is the 10th consecutive call of update() using a counter variable called updateDelay.

If it really is the 10th call, we remove the last square of our snake (first element in the stack), give it new coordinates according to the current direction and place it in front of the head of the snake (top of the stack). Here's how the code looks like:

        update: function() {

            // Handle arrow key presses, while not allowing illegal direction changes that will kill the player.
        
            if (cursors.right.isDown && direction!='left')
            {
                new_direction = 'right';
            }
            else if (cursors.left.isDown && direction!='right')
            {
                new_direction = 'left';
            }
            else if (cursors.up.isDown && direction!='down')
            {
                new_direction = 'up';
            }
            else if (cursors.down.isDown && direction!='up')
            {
                new_direction = 'down';
            }
        
            // A formula to calculate game speed based on the score.
            // The higher the score, the higher the game speed, with a maximum of 10;
            speed = Math.min(10, Math.floor(score/5));
            // Update speed value on game screen.
            speedTextValue.text = '' + speed;
        
            // Since the update function of Phaser has an update rate of around 60 FPS,
            // we need to slow that down make the game playable.
        
            // Increase a counter on every update call.
            updateDelay++;
        
            // Do game stuff only if the counter is aliquot to (10 - the game speed).
            // The higher the speed, the more frequently this is fulfilled,
            // making the snake move faster.
            if (updateDelay % (10 - speed) == 0) {
        
                // Snake movement
        
                var firstCell = snake[snake.length - 1],
                    lastCell = snake.shift(),
                    oldLastCellx = lastCell.x,
                    oldLastCelly = lastCell.y;
        
                // If a new direction has been chosen from the keyboard, make it the direction of the snake now.
                if(new_direction){
                    direction = new_direction;
                    new_direction = null;
                }
        
                // Change the last cell's coordinates relative to the head of the snake, according to the direction.
        
                if(direction == 'right'){
        
                    lastCell.x = firstCell.x + 15;
                    lastCell.y = firstCell.y;
                }
                else if(direction == 'left'){
                    lastCell.x = firstCell.x - 15;
                    lastCell.y = firstCell.y;
                }
                else if(direction == 'up'){
                    lastCell.x = firstCell.x;
                    lastCell.y = firstCell.y - 15;
                }
                else if(direction == 'down'){
                    lastCell.x = firstCell.x;
                    lastCell.y = firstCell.y + 15;
                }
        
                // Place the last cell in the front of the stack.
                // Mark it the first cell.
        
                snake.push(lastCell);
                firstCell = lastCell;
        
            }
        
        }

Try and control the snake via the arrow keys on your keyboard.