Demo Day 12 - Key Sequence Detection JavaScript 코드 const pressed = []; const secretCode = "shigatsu"; function init() { window.addEventListener("keyup", (e) => { pressed.push(e.key); console.log(-secretCode.length - 1); pressed.splice(-secretCode.length - 1, pressed.length - secretCode.length); console.log(pressed); if (pressed.join("") === secretCode) { console.log("You found it!"); cornify_add..

Demo Day 11 - Custom HTML5 Video Player HTML 코드 ► « 10s 10s » CSS 코드 너무 많아서 생략하겠음 깃헙코드에 올려두었음! JavaScript 코드 const player = document.querySelector(".player"); const video = player.querySelector(".viewer"); const progress = player.querySelector(".progress"); const progressBar = player.querySelector(".progress__filled"); const toggle = player.querySelector(".toggle"); const skipButtons = player.qu..

Demo Day 10 - Hold Shift to Check Multiple Checkboxes HTML 코드 This is an inbox layout. Check one item Hold down your Shift key Check a lower item Everything in between should also be set to checked Try to do it without any libraries Just regular JavaScript Good Luck! Don't forget to tweet your result! CSS 코드 html { font-family: sans-serif; background: #ffc600; } .inbox { max-width: 400px; margin..

Demo Day 09 - 14 Must Know Dev Tools Tricks HTML 코드 ×BREAK×DOWN× JavaScript 코드 const dogs = [ { name: "Snickers", age: 2 }, { name: "hugo", age: 8 }, ]; function makeGreen() { const p = document.querySelector("p"); p.style.color = "#BADA55"; p.style.fontSize = "50px"; } // Regular console.log("Hello!"); // Interpolated console.log("Hello! I amm %s string", "🤎"); // Styled console.log( "%c I am s..

Demo Day 08 - Fun with HTML5 Canvas들어가서 마우스 드래그를 통해 그려보세요 :) HTML 코드 JavaScript 코드 const canvas = document.querySelector("#draw"); const ctx = canvas.getContext("2d"); canvas.width = window.innerWidth; canvas.height = window.innerHeight; ctx.strokeStyle = "#BADA55"; ctx.lineJoin = "round"; ctx.lineCap = "round"; let isDrawing = false; let lastX = 0; let lastY = 0; let hue = 0; let direction = tr..

Demo Day 07 - Array Cardio Day 2 JavaScript 코드 const people = [ { name: "Wes", year: 1988 }, { name: "Kait", year: 1986 }, { name: "Irv", year: 1970 }, { name: "Lux", year: 2015 }, ]; const comments = [ { text: "Love this!", id: 523423 }, { text: "Super good", id: 823423 }, { text: "You are the best", id: 2039842 }, { text: "Ramen is my fav food ever", id: 123523 }, { text: "Nice Nice Nice!", id..