목록분류 전체보기 (61)
훈돌라

function sum (num1, num2) { return num1 + num2;} console.log(sum(2,3)); function isEvenOrOdd(num){ if(num%2 === 0){ console.log("짝수입니다") } if(num%2 === 1){ console.log("홀수입니다") }}isEvenOrOdd(5);isEvenOrOdd(4); const name = "훈돌라";const age = 28; const user = `이름 : ${name}나이 : ${age}`; console.log(user); document.querySelector document.querySelector docume..
본격적인 리액트를 배우기 앞서, 리액트에서 가장 많이 쓰이고 중요한 JS 문법들을 되새김질 하는 시간. // let blockScopeVariable = "Available only in this block";// if (true) {// let blockedScope = "Visible inside this block";// console.log(blockedScope);// }// console.log(blockedScope);// console.log(blockScopeVariable);//블록드스코프가 블록 범위를 벗어나서 로그에 찍히지 않음. (오류발생)// let blockScopeVariable = "Available only in this block";// if (true) ..

다크모드에서 댓글 수정하기 버튼을 누르면 인풋 창 안의 커서와 텍스트가 보이지 않는다.드래그 해보니 텍스트가 보이고, 확인을 눌렀을 때 수정은 되는걸로 보아 css 에 문제가 있는 것 같음. 확인해보니, A 팀원분이 만든 다크모드 코드에 B 팀원분이 수정을 했는데 B 팀원분이 " #commentInput, #passwordInput 컬러 부분 제가 어제 컬러 color: var(--rvInput-tc); 로 수정해서 그런 것 같아요" 라고 하셨고, css 에 dark 일 땐 하얀색이고, dark 가 아닐 땐 값이 안 정해져 있어서 적용이 안 된 것 같다. :root { --header-bg: black; --header-ft: white; --body-bg: white; --body-ft:..
한 줄 정리 : 최신 영화 리스트와 각 영화의 상세정보, 리뷰 등을 확인하고 작성할 수 있는 웹사이트내용메인페이지메인페이지 반응형@media screen으로 화면의 단위를 3개로 나눔1300px 이상 : 영화카드 4개 보임1000px 이상 : 영화카드 3개 보임700px 이상 : 영화카드 2개 보임그 이하 : 영화 카드 1개 보임영화 검색addEventListener를 input으로 설정하여 입력 이벤트를 실시간으로 반영하여 검색결과 보여줌.영화 카드카드를 마우스 hover하면 영화 줄거리를 보여줌카드를 클릭하면 해당 영화의 상세 페이지로 이동..상세페이지 (영화 설명)헤더바 : 메인페이지로 돌아가는 홈버튼과 라이트/다크 모드로 바꿀 수 있는 버튼이 있음영화 정보영화 제목, 런타임, 개봉일, 장르, 평점..

저번 글에 이어서오늘은 팀원분이 완성해두신 상세페이지 -> 리뷰 작성 기능에 유효성 검사를 추가해보려고 한다. 우선 어떤 식으로 유효성 검사를 구현할지 먼저 생각을 좀 해봤다. 1. 댓글 텍스트 수2. 캡스락 keyup 여부3. 한/영 여부인데, 사실 한/영 여부는 불필요하다고 생각했고, 댓글 텍스트 수도 실제로는 제한이 없기 때문에 2. 캡스락 keyup 여부를 구현하기로 했다. const usernameInput = document.getElementById("username"); usernameInput.addEventListener("keyup", function (event) { if (event.getModifierState("CapsLock")) { // CapsLoc..

검색창 인풋 유효성 검사의 다른 버젼! HTMLinput type="text" id="searchBar">p id="warningMessage" style="display: none; color: red;">영문은 지원하지 않습니다, 한글을 입력해주세요p> JSconst searchInput = document.getElementById("searchBar");const warningMessage = document.getElementById("warningMessage");searchInput.addEventListener("input", () => { const searchTerm = searchInput.value.toLowerCase(); const movieCards = Arra..