분류 전체보기 135

효율적으로 문자열과 배열 활용해봅시다

효율적으로 문자열과 배열을 활용하는 법을 알아봅시다! length() length(): 이 메서드는 문자열의 길이를 반환합니다. const str = "Hello, world!"; console.log(str.length); // 13 배열의 경우엔 배열의 수를 나타냅니다. const arr = [1, 2, 3, 4, 5]; console.log(arr.length); // 5 유사 배열 객체의 경우, length 속성은 해당 객체가 가지고 있는 요소의 개수를 나타냅니다. const paragraphs = document.getElementsByTagName("p"); console.log(paragraphs.length); // the number of elements in the document ch..

공부하기 2023.03.29

Git 초보자도 알아야 하는 용어

Git 브랜치 브랜치란 독립적으로 어떤 작업을 진행하기 위한 개념입니다. 필요에 의해 만들어지는 각각의 브랜치는 다른 브랜치의 영향을 받지 않기 때문에, 여러 작업을 동시에 진행할 수 있습니다. 통합 브랜치 통합 브랜치란 언제든지 배포할 수 있는 버전을 만들 수 있어야 하는 브랜치 입니다. 그렇기 때문에 늘 안정적인 상태를 유지하는 것이 중요합니다. 여기서 '안정적인 상태'란 현재 작업 중인 소스코드가 모바일에서 동작하는 어플리케이션을 개발하기 위한 것이라면, '그 어플리케이션의 모든 기능이 정상적으로 동작하는 상태'를 의미합니다. 만약 이 어플리케이션에 어떤 문제가 발견되어 그 문제(버그)를 수정한다던지 새로운 기능을 추가해야 한다던지 해야할 때, 바로 '토픽 브랜치(Topic branch)'를 만들 ..

공부하기 2023.03.29

사이트 만들기 모아서 완성하기!

t만들어 온 사이트 완성하기! 사이트 만들기1 여태까지 만들어 온 사이트를 모아 한 페이지로 만들어보았다. 처음엔 head에 메타 태그를 넣어 검색에 노출 되게 해주었다. meta태그란? 태그는 웹 페이지의 HTML 코드에서 사용되며, 웹 브라우저나 검색 엔진 등에게 해당 페이지의 정보를 제공하는 역할을 합니다. 일반적으로 태그 안에 위치하며, 다양한 속성을 사용하여 다양한 정보를 제공할 수 있습니다. 가장 일반적인 태그의 속성으로는 다음과 같은 것들이 있습니다. charset: 페이지의 문자 인코딩 방식을 지정합니다. name: 페이지의 정보의 유형을 지정합니다. 예를 들어, "description"은 페이지의 간단한 요약을 제공합니다. content: name 속성에서 지정한 정보의 내용을 지정합니다..

퀴즈효과 6 : 버튼을 누르면 다음 문제로 넘어가는 효과

다음문제로 넘어가보자! Quiz 주관식 확인하기 유형 1 2 3 4 5 6 d w 정답입니다! 오답입니다! 다음 문제 ??점 정답 확인! esansi@naver.com 퀴즈유형 6번은 보기를 선택하고 다음문제 버튼을 누르면 다음 문제로 넘어가는 효과로 만들어 보았다. const quizWrap = document.querySelector(".quiz__wrap"); const quizTitle = quizWrap.querySelector(".quiz__title") const quizQusetion = quizWrap.querySelector(".quiz__question") const quizChoice = quizWrap.querySelector(".quiz__choice") const dogWrap..

CSS : 여백 속성에는 어떤 것들이 있을까?

CSS : 여백 속성 CSS에서 여백(margin)과 내부여백(padding),은 요소의 레이아웃을 조절하는 데 사용되는 속성입니다. Margin Margin: 요소와 주변 요소 사이의 공간을 지정합니다. margin 속성은 top, right, bottom, left 속성을 사용하여 각 방향별로 여백을 지정할 수 있습니다. h1 {margin: 10px 5px 15px 20px;} /* top-10px, right-5px, bottom-15px, right-20px */ h2 {margin: 10px 5px 15px;} /* top-10px, right & left-5px, bottom-15px */ h3 {margin: 10px 5px;} /* top & bottom-10px, right & left..

CSS 2023.03.26

부족한 점 공부를 해봅시다 CSS 속성편

부족한 점 공부하기 = CSS속성 편 사이트 유형 공부를 하다가 css의 background 속성의 종류를 공부해야겠다 생각해서 background 속성의 종류를 알아보려 한다! background-attachment : 요소의 배경 이미지가 콘텐츠와 함께 스크롤되어야 하는지 아니면 제자리에 고정되어 있어야 하는지를 지정하는 CSS 속성입니다. 다음 두 값 중 하나를 사용할 수 있습니다. scroll: 기본값이며 배경 이미지가 요소의 내용과 함께 스크롤된다는 의미입니다. fixed: 이 값을 사용하면 요소의 콘텐츠가 스크롤되더라도 배경 이미지가 뷰포트에 상대적으로 제자리에 고정됩니다. 이렇게 하면 배경 이미지가 나머지 콘텐츠보다 느린 속도로 움직이는 것처럼 보이는 시차 효과가 생성됩니다. backgrou..

공부하기 2023.03.26

퀴즈효과5 : 객관식 확인하는 유형(여러문제)

객관식을 선택하면 정답을 확인하는 유형. Quiz 주관식 확인하기 유형 1 2 3 4 5 d w esansi@naver.com 퀴즈효과5번은 앞의 퀴즈 효과들과는 다르게 메인 내용을 html이 아닌 javascript를 이용하여 넣었다. quiz__wrap안의 내용들을 주석 처리를 하고 자바스크립트로 넣을 것이기 때문에 quiz__wrap을 선택자로 선택한다 const quizWrap = document.querySelector(".quiz__wrap"); 그 뒤로 출력을 updataQuiz로 할 것이기 때문에 안에 문제를 넣어줘야한다. updataQuiz 안에 exam이란 변수를 설정해준다. const updateQuiz = () => { const exam = []; 문제가 들어있는 quizInfo를..

3.24일 오답노트-----매우우우우 많이 틀림

오답노트 01. 결괏값을 작성하시오. { const str = "javascript"; const text = str.indexOf("a"); const text2 = str.lastIndexOf("a"); const text3 = str.includes("a"); console.log(text); console.log(text2); console.log(text3); } 정답: 1 0 3 해설: indexOf 는 앞부터 0부터 시작하기 때문에 a자리는 1이기 때문에 1이나온다. lastindexOf는 뒷자리 부터 기준을 두어 뒤에 있는 a는 3자리이기 때문에 3 includes는 불린으로 반환하기 때문에 javascript가 들어가 있어 true가 나온다. 02. 다음의 결괏값을 보고 빈칸을 채우시오...

공부하기 2023.03.24