분류 전체보기 130

Javascript를 이용한 사이트 만들기! - 퀴즈 효과 사이트 만들기03

- 자 오늘은 2번에 있는 문제들을 여러 개가 있는 사이트를 만들어 보겠습니다. - 완성본 입니다. - 기본적인 HTML태그들은 문제가 있는 태그인 가 3개로 늘어난 것 말고는 달라진 것이 없습니다. - 그래서 script부분만 보도록 하겠습니다. - 차이점이 보이시나요?? 여러 개를 만들 때 가장 큰 차이점은 바로 선택자를 만들 때 querySelector가 아닌 querySelectorAll을 사용한다는 점입니다. - 그렇기 때문에 선택자를 입력할 때도 몇 번째 선택자인지 "[]"안에 번호를 넣어서 선택을 해주어야 합니다.(가장 많이 한 실수 ㅎㅎ;;) - 선택자의 종류 자체는 2번과 같습니다!! 아!! 종목과 횟수가 나누어져 있던 것을 하나로 합쳐주었어요!! - 문제가 3가지이니까 내용도 3개 여야..

Archive/Javascript 2023.03.14

MySQL을 배워봅시다! 01. 그래서 MySQL이 뭔가요?

MySQL은 오픈 소스 관계형 데이터베이스 관리 시스템(RDBMS)입니다. - MySQL은 다중 사용자, 다중 스레드 RDBMS로서, 데이터의 안정성과 보안성을 제공합니다. MySQL은 대부분의 운영 체제에서 작동하며, 웹 애플리케이션 개발, 데이터 분석, 빅 데이터, 클라우드 기반 애플리케이션 등에 많이 사용됩니다. - MySQL은 SQL(Structured Query Language)을 사용하여 데이터를 관리합니다. SQL은 데이터베이스에 저장된 데이터를 조작하기 위한 표준적인 언어로서, 데이터를 검색, 삽입, 업데이트, 삭제하는 데 사용됩니다. MySQL은 이러한 SQL 문을 이용하여 데이터를 쿼리 하고, 데이터의 무결성을 유지하며, 데이터베이스를 관리합니다. - MySQL은 사용이 간편하며, 대용..

Archive/PHP 2023.03.13

Javascript를 공부해 봅시다! 09. addEventListener()

- addEventListener는 자바스크립트에서 HTML 요소에 이벤트 리스너를 추가하는 메서드입니다. 이벤트 리스너는 특정 이벤트가 요소에서 발생할 때 실행되는 함수입니다. - 다음은 addEventListener를 사용하여 이벤트 리스너를 추가하는 기본 구문입니다. element.addEventListener(event, function, useCapture); - 구성 요소는 다음과 같습니다. element: 이벤트 리스너를 추가할 HTML 요소입니다. event: 이벤트 이름입니다. 예를 들어, "click", "mousemove", "keydown" 등이 될 수 있습니다. function: 이벤트가 발생할 때 실행할 함수입니다. useCapture: 선택적 매개변수로, 이벤트 캡처링을 사용할..

Archive/Javascript 2023.03.12

사이트를 만들어 봅시다. - Image Type(01)

- 오늘은 위에 있는 예시처럼 이미지들로 이루어진 이미지타입의 페이지를 만들어 보겠습니다. - 구조는 크게 제목을 이루고 있는 헤더 부분과 이미지로 이루어진 컨텐츠 부분이 있겠습니다. - 함께 코드를 보시죠 식물을 키우는 방법 식물을 키우는 것은 생각만큼 쉽지않지만 배운다면 할 수 있습니다. 물을 주는 주기 올바른 주기를 알고 물을 주는 것이 중요합니다. 너무 자주주면 뿌리가 썩을 수도 있기 때문입니다. 자세히보기 광합성의 중요성 올바른 주기를 알고 물을 주는 것이 중요합니다. 너무 자주주면 뿌리가 썩을 수도 있기 때문입니다. 자세히보기 - 자 먼저 body 부분을 보겠습니다. - 먼저 아까 말씀드렸던 것과 같이 제목과 아래 설명부분을 h2와 p태그를 통해 만들어주고 - 이미지가 들어갈 부분을 image..

Archive/HTML 2023.03.11

Javascript를 공부해 봅시다! - 번외편. 오답노트를 해보자(2)

- 자 오늘도 금요일이라 시험을 보는 날이 되었습니다!! - 같이 문제를 보시고 제가 틀린문제를 같이 풀어보겠습니다. // 01. 결괏값을 작성하시오. { if( null ){ console.log("true"); } else { console.log("false"); } } // 정답은 false // 02. 결괏값을 작성하시오. { let num = 0; while( num 6 ){ break; } console.log(num); } } // 정답은 12456 // 07. 결괏값을 작성하시오. { for(let i=1; i { const str = "함수가 실행되었습니다."; return str; } console.log(func()); } // 정답은 함수가 실행되었습니다 // 11. 결괏값을 작성..

Archive/Javascript 2023.03.10

Javascript를 이용한 사이트 만들기! - 퀴즈 효과 사이트 만들기02

- 자 오늘은 어제 만든 강아지가 정답을 맞추면 웃고 정답을 틀리면 우는 것을 만들어 보겠습니다. - 일단 완성본입니다!! - 이제 코드를 뜯어보도록하죠 - 사실 html과 CSS는 크게 달라진 점이 없기 때문에 오늘도 자바스크립트에 집중하도록 하겠습니다. - 설명부분과 우측상단에 문제번호가 추가된 것 말고는 내용 상에는 변한게 없습니다. - 일단 기본적인 부분은(번호를 넣거나 문제를 넣는 내용적인 부분들) 어제 것과 같기 때문에 설명을 생략하겠습니다. - 이게 사소해 보이지만 중요한 것인데 html를 짤 때 규격에(?) 맞춰서 짠다면 코드의 재활용이 가능하다는 점입니다. - 덕분에 저희는 달라지는 요소들만 바꾸면 된다는 것이죠!! - 출력과 숨기기는 어제 했으니 오늘은 사용자의 정답을 받아와서 정답을 ..

Archive/Javascript 2023.03.09