2017. 09. 18 ~ 09. 21 - TIL

18 Sep 2017 • TIL

09.18

오늘 한 일

  • SLipp 댓글 기능 구현

09.19

오늘 한 일

  • 예비군 훈련

09. 20

  • 프로가 되기 위한 웹기술 입문 독서

09. 21

  • 자바스크립트를 이용해 stopwatch 페이지 제작 
      <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
      <style>
          #output {
              width: 100px;
              height: 50px;
              background-color: #ccc;
              border: 1px solid #999;
          }
      </style>
  </head>
  <body>
      <p id="output"></p>
      <div id="controls">
          <button id="startPause" onclick="startPause()">Start</button>
          <button onclick="reset()">Reset</button>
          <button onclick="lap()">Lap</button>
      </div>
      <div>
          <ol id="records"></ol>
      </div>

      <script>
          var time = 0;
          var running = 0;
          var labs = [];
          function startPause() {
              if(running == 0) {
                  running = 1;
                  increment();
                  document.getElementById('startPause').innerHTML = "Pause";
              } else {
                  running = 0;
                  document.getElementById("startPause").innerHTML = "Resume";
              }
          }

          function reset() {
              running = 0;
              time = 0;
              document.getElementById('startPause').innerHTML = "Start";
              document.getElementById('output').innerHTML = "00:00:00";
          }

          function increment() {
              if(running == 1) {
                  setTimeout(function() {
                      time++;
                      var mins = Math.floor(time/10/60);
                      var secs = Math.floor(time/10);
                      var tenths = time % 10;

                      if(mins < 10) {
                          mins = "0" + mins;
                      }
                      if(secs < 10) {
                          secs = "0" + secs;
                      }

                      document.getElementById('output').innerHTML = mins + ":" + secs + ":" + "0" + tenths;
                      increment();
                  }, 100);
              }
          }

          function lap() {
              document.getElementById('records').innerHTML += "<li>"+ document.getElementById('output').innerHTML +"</li>";
          }

      </script>
  </body>
  </html>
  • Django로 REST API를 만들어서 인스타그램 백엔드 클론 (Python 3, DRF, JWT, Social Auth)

Comments

Related Posts