How do I make animated sprites? like directional walking sprite / stand sprite.

You have created manually for animation sprite.

this is an example create simple animation

var player = {
x : 20,
y : 20,
animationDraw : 0,
currentState : "right",
anims:[158, 158,158, 158, 159, 159, 159, 159],
};
//▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄
// Update is called once per frame
exports.update = function () {
//clear render every tick update
cls();
//handle input
if(btn.right){
player.x += 1;
player.currentState = "right";
player.animationDraw +=1;
if (player.animationDraw > player.anims.length) player.animationDraw = 0;
}
else if(btn.left){
player.x -= 1;
player.currentState = "left";
player.animationDraw +=1;
if (player.animationDraw > player.anims.length) player.animationDraw = 0;
}
//draw player
sprite(player.anims[player.animationDraw], player.x, player.y, player.currentState != "right");
//sample show text
print("hello", 20, 20);
};

for layer you can draw one by one on the update, but I'm not sure how to handle opacity,