2021.10.18

VScode

-> command palette :  이것만 잘 써도 작업 속도가 빨라진다고 함

-> 코드 복사 : shift + alt + 위/아래 방향키

-> 한줄 삭제 : control + shift + k

 

코드를 확인해 볼 때 : 일일이 프로젝트  생성하기 번거로우니까 이런식으로 간단하게 확인한다고 함

1. https://jsfiddle.net/

JSFiddle - Code Playground

https://jsbin.com/?html,output 

 

JS Bin

 

2. 빠르게 코드 작성하기

<!--. #-->
    <div></div>
    <div class="myc"></div>
    <div id="mui"></div>
    <div class="tttt"></div>

    <!-->-->
    <div>
      <ul>
        <li></li>
      </ul>
    </div>

    <!--- + -->
    <div>
      <ul></ul>
      <ol></ol>
    </div>

    <!-- * -->
    <ul>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
      <li></li>
    </ul>

    <!-- ^ div>ul>li^ol-->
    <!-- ul li 까지 만들어 놨는데 ul(li의 상위) 형제로 ol을 만들고 싶더라 할 때 씀-->
    <div>
      <ul>
        <li></li>
      </ul>
      <ol></ol>
    </div>

 

<그룹화>

<!-- div>(header>ul>li*2>a)+footer>p -->
    <div>
      <header>
        <ul>
          <li><a href=""></a></li>
          <li><a href=""></a></li>
        </ul>
      </header>
      <footer>
        <p></p>
      </footer>
    </div>

<태그안에 텍스트 넣기>

<!--p{hello}-->  
    <p>helllo</p>
    
    <!-- 번호 매기기{$} -->
    <!-- p.class${item $}*5 -->
    <p class="class1">item 1</p>
    <p class="class2">item 2</p>
    <p class="class3">item 3</p>
    <p class="class4">item 4</p>
    <p class="class5">item 5</p>
    
    <!-- 더미 텍스트 -->
    p>lorem
    p>lorem4 (4글자만 넣을 수 있다.)