"For loop developer" how to use pug/jade, scss, javascript, python(backend) - (Stack Tutorial 1)

This tutorial we will learn how to use for loop at

• Pug/Jade
• Scss
• Javascript
• Python (BackEnd) For front-end code editor you can use codepen and backend python Programic

1. Pug/Jade

Pug will compile html and for online code editor pug/jade is the best way to practice code such as codepen, codesandbox, Web Maker (chrome extension).

Pug/Jade Example 1

- var max= 10+1;
- for(var i = 1; i < max; i++)
    input(value="Hello Input " + i, class="input"+i)

There are several way to loop pug/jude like while loop, each will will discuss it later.

2. SCSS
Scss is the css preprocessor to compile scss extension to css, vs live sass compiler one of the best extension I ever see.

Scss Example 1

$count: 10;
@for $i from 1 through $count {
  [class*=input]{
    border: solid red;
    animation: animate 10s ;
    @keyframes animate{
      0%{
        opacity: 0;
      }
      100%{
        opacity: 1;
      }
    }
    &:nth-child(#{$i}){
      animation-delay: #{$i}s;
    }
  }
}

3. Javascript
Javascript is one of the most useful programming language for web programmer.
for javascript there are couple of way to loop for example: do, while, for, (foreach,map,filter)=array etc
for this tutorial we are going to learn just basic about for loop
Javascript Example1

let input = document.querySelectorAll('input');
for(let i = 0; i< input.length; i++){
  input[i].style.setProperty('margin','15px')
}

4. Python
Python is one of the best choices for backend development with Django framework, so we will go to keep that beautiful language, and also it is very easy to learn.
Python Example1

for i in range(1,20+1):
    print(i)

Python Example2

country = ["Bangladehs", "India", "Pakistan"]
for c in country:
    print(c)

This is our short tutorial, if you like this tutorial please like, comment, follow. I will encourage by you to do more posts here.
Thanks all.