전체 글

문제는 다음과 같다. 아메리카노 카페라떼 이중에서 function handleClick() { // 아래의 빈 칸(____)을 채우세요. // console.log("working?"); let currentMenu = ____; // TODO console.log(currentMenu + "를 클릭하셨습니다."); 을 구해야 한다. 화면에는 아메리카노와 카페라떼 버튼이 있고, "버튼을 누를 때, 예를 들어 아메리카노를 클릭하셨습니다." 라는 식으로 콘솔에 출력되어야 한다. 힌트가 있다. 바로 function handleClick(event) { console.log(event); } 를 입력해보는 것, 그럼 그 상태에서 둘 중 아무버튼이나 버튼을 누르면.. target:button 이 보인다. 버튼을 ..

로그인창 만들기 css가 예전보단 좀 나아진듯....? box-shadow 랑 글꼴 바꾸는것, 이모지 넣는 것, 버튼 hover 기능,색 계열 맞추기 등이 들어갔다. 아 그리고, border:none; 시켜놓는 게 이쁜듯..! 오류 고치기 페어분이 잘 도와주셔서 덕분에 오류를 해결할 수 있었다. 1. document 철자를 틀리게 씀 2. class 라 .를 써야 하는데, #을 씀 let elPasswordErrorMessage = document.querySelector('.mismatch-message') 3. 먼저 함수 isMatch 를 써서 두 패스워드가 같을때 true를 뱉어내고, 다를때, false 를 뱉어내는 조건문을 만든다. function isMatch (password1, passwor..

이 글은 유튜버 '라매개발자'님의 영상을 보고 필기한 것입니다. https://www.youtube.com/watch?v=YbVuqWD12Ko 웹 프론트엔드 개발자 로드맵

DOM 이란? 문서 객체 모델, 즉 DOM은 웹 페이지(HTML이나 XML 문서)의 콘텐츠 및 구조, 그리고 스타일 요소를 구조화 시켜 표현하여 프로그래밍 언어가 해당 문서에 접근하여 읽고 조작할 수 있도록 API를 제공하는 일종의 인터페이스입니다.

scope 함수선언문으로 정의한 함수는 함수 호이스팅이 일어난다.함수 표현식은 불가능 함수 호이스팅: 함수 선언 이전에 호출이 된다. describe('scope 대해서 학습합니다.', function () { // scope는 변수의 값(변수에 담긴 값)을 찾을 때 확인하는 곳을 말합니다. 반드시 기억하시기 바랍니다. it('함수 선언식(declaration)과 함수 표현식(expression)의 차이를 확인합니다.', function () { let funcExpressed = 'to be a function'; expect(typeof funcDeclared).to.equal("function"); expect(typeof funcExpressed).to.equal("string"); functio..

어떤 컴퓨터 언어를 배우더라도 가장먼저 집중해야 할 것은 CRUD가 되겠다. 이번에는 document 객체를 통해서 html 엘리먼트를 create, read, update, delete 방법을 학습한다. 특히, DOM 에서는 html 에 적용(append) 하는 메서드가 따로 있으니 주의해야 겠다. CREATE 생성 document.createElement('div')를 사용하여 div를 생성한다 document.createElement('div') ​​ //자바스크립트에서 어떤 작업의 결과를 담으려면? //변수를 선언하고 어떤 작업의 결과를 변수에 할당 //여기서는 div element를 tweetDiv에 할당 const tweetDiv = document.createElement('div') 아직 ..

작고 소중한 나의 첫 푸로젝트는 바로 디지털 시계 만들기였다. html, css, javascript 를 모두 사용했고, 처음부터 스케치(?)를 하고 의사코드를 짜고, 코드를 수정했다. 스케치 만들고자 하는 디지털 시계의 대략적인 모습을 그렸다. 북흐 ㅎ 의사코드 의사코드는 어떻게 만들었냐면 기존에 있는 디지털 시계만들기 소스코드를 읽어보고, 자연어로 바꾸어서 적어본 것이다 그냥 존재하는 코드를 따라치면 클론코딩밖에 안될것 같아서, 코드 이해만 하고 웬만하면 구글링해서 찾아내려고 했다. html 상단에 명언을 입력 css 명언 중앙정렬 명언 글씨체 바꾸기 날짜와 시간 글씨체를 투명하게 영상을 백그라운드에 재생(실행해봤는데 반복재생 안되면 방법을 서치) javascript 요소선택 today와 time 선..

현재시간을 브라우저에 나타내는 코드입니다. h1에 now 가 가진 시간정보를 표시합니다 const h1 = document.querySelector('h1') const now = new Date(); console.log(now) const hour = now.getHours() const minu = now.getMinutes() const seco = now.getSeconds() const nowTime = `${hour}:${minu}:${seco}` h1.textContent = nowTime; 실행되는 화면입니다. 새로고침을 누르면 초가 계속 달라집니다.