hyejeong 코딩

Section 태그 일반적으로 부문, 구역, 영역을 나타내는 기능을 합니다. 문단이라던지 1장,2장,1절,2절 등과 같이 이루어지는 글 등을 하나의 그룹 혹은 묶음으로 다루어주는 역할을 합니다. 요소는 보통 제목 요소 (h1~h6)를 자식 요소로 포함하고 있는 경우가 많습니다. section 관련 태그 설명 header 주로 페이지의 제목영역에 사용합니다. 사이트 메인의 이름, 로고가 될 수 있고 article 내의 제목이 될 수도 있습니다. nav 내비게이션 역할을 하는 태그입니다. 페이지의 메뉴, 목차를 만들 때 사용하고, 사이트 내에서 다른 페이지로 링크되어 있는 경우입니다. 일반적으로 내부에 과 를 많이 사용합니다. section 논리적으로 관계있는 문서 혹은 요소를 분리할 때 사용합니다. art..

시멘틱 마크업이란? 시멘틱의 사전적 뜻은 '의미론적인' 정도로 해석할 수 있는데, 이것은 마크업을 할 때 의미에 부합하는 태그를 사용하라는 뜻입니다. 실제 마크업을 할 때는 작업자마다 콘텐츠의 의미를 해석하는 차이가 조금 있을 수도 있지만 가급적 시멘틱하게 마크업을 하려고 노력하는 것이 중요합니다. 즉, 개발자와 브라우저에게 의미있는 태그를 제공한다고 이해하면 됩니다. 간단한 예로 는 non-senamtic 태그라 볼 수 있고 ,,등은 semantic태그라고 볼 수 있습니다. 이면 표가 들어 갈 것이고, 는 네비게이션을 의미할 것이라 유추 할 수 있습니다 이렇게 의미를 가진 태그는 검색엔진이나 그 이외에 기계적인 동작들이 웹페이지를 쉽게 이해 할 수 있게 됩니다. 접근성이 좋아집니다. 검색 엔진 최적화 ..

01. 블록 레벨 요소(Block-level Element) 블록 레벨 요소는 마크업을 할 때 줄이 바뀌는 특성이 있어 가로로 정렬되지 않습니다. 블록 요소는 하나의 박스라고 생각하면 됩니다. 블록 레벨 요소는 줄 바꿈이 일어납니다. 블록 레벨 요소는 영역을 표시하기 때문에 패딩과 마진 값을 줄 수 있습니다. 블록 레벨 요소는 텍스트(문자)와 인라인 요소를 자식 요소로 포함할 수 있습니다. 블록 레벨 요소 중에는 블록 레벨 요소를 지식 요소를 자식 요소로 포함할 수 있는 요소와 포함할 수 없는 요소가 있습니다. div header section aside footer 02. 인라인 요소(Inline Element) 인라인 요소는 마크업을 할 때 줄 바꿈이 일어나지 않으며 가로로 정렬이 됩니다. 인라인 요..

패럴렉스 이펙트 - 메뉴 효과 HTML Javascript Parallax Effect01 패럴렉스 이펙트 : 메뉴 효과 1 2 3 4 5 6 7 메뉴1 메뉴2 메뉴3 메뉴4 메뉴5 메뉴6 메뉴7 메뉴8 메뉴9 01 Section01 늘 이걸 명심하라. 그 무엇보다 성공하겠다는 결의가 중요하다. 02 Section02 모든 진보는 안전 구역 밖에서 이루어진다. 03 Section03 성공이란 실패에 실패를 거듭하면서도 열의를 잃지 않는 것이다. 04 Section04 늘 이걸 명심하라. 그 무엇보다 성공하겠다는 결의가 중요하다. 05 Section05 더 열심히 일하면 할수록 운이 더 좋아진다는 것을 알게 된다. 06 Section06 더 나은 것을 위해 좋은 것을 포기하는 걸 두려워 하지 마라. 07 ..

버튼과 썸네일을 누르면 해당 이미지로 바뀌는 이미지 슬라이드를 만들었습니다. HTML Javascript Slider Effect07 슬라이드 이펙트 : 썸네일 슬라이드(버튼, 썸네일) 1 2 3 4 5 6 7 prev next hyejeong3283@gmail.com CSS SCRIPT let images = [ "./img/sliderEffect02-min.jpg", "./img/sliderEffect03-min.jpg", "./img/sliderEffect06-min.jpg", "./img/sliderEffect09-min.jpg", "./img/sliderEffect10-min.jpg" ]; images라는 변수에 각 이미지 파일 경로를 문자열로 표현하여 배열 형태로 저장했습니다. 함수 image..

움직이는 이미지 슬라이드에 양쪽에 버튼과 하단에 닷 메뉴를 넣었습니다. 양쪽 버튼을 누르면 방향따라 이미지가 넘어가고 하단의 점을 누르면 해당 순서의 이미지로 바뀝니다. HTML Javascript Slider Effect06 슬라이드 이펙트 : 이미지 슬라이드(버튼, 닷메뉴) 1 2 3 4 5 6 7 prev next CSS SCRIPT 선택자 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = sliderWrap.querySelector(".slider__img"); // 보여지는 영역 const sliderInner = sliderWrap.querySelector(".slider__inner"); // 움직이는 ..

위로 연속적으로 이미지를 움직이는 슬라이드를 만들었습니다. 마지막 이미지가 나온 후 다시 첫번째 이미지부터 보여주기를 반복합니다. HTML Javascript Slider Effect05 슬라이드 이펙트 : 위로 움직이기(연속적으로) 1 2 3 4 5 6 hyejeong3283@gmail.com CSS 위로 움직이는 이미지 슬라이드를 만들기 위해 이미지 height(이미지 세로값)을 520px로 맞추었습니다. 모든 이미지가 들어갈 슬라이드 영역의 height(세로값)은 3120px로 맞추었습니다. SCRIPT 선택자 javascript HTML 코드에서 slider__wrap, slider__img, slider__inner, slider 클래스를 가진 요소들을 변수에 할당합니다. 그리고 이미지 변경 간..

좌측으로 연속적으로 이미지를 움직이는 슬라이드를 만들었습니다. 마지막 이미지가 나온 후 다시 첫번째 이미지부터 보여주기를 반복합니다. HTML Javascript Slider Effect04 슬라이드 이펙트 : 좌로 움직이기(연속적으로) 1 2 3 4 5 6 hyejeong3283@gmail.com CSS SCRIPT 선택자 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = sliderWrap.querySelector(".slider__img"); // 보여지는 영역 const sliderInner = sliderWrap.querySelector(".slider__inner"); // 움직이는 영역 const sli..

여러 이미지를 저장해 위로 움직여 이미지를 보여주는 페이지를 만들었습니다. HTML Javascript Slider Effect02 슬라이드 이펙트 : 위로 움직이기 1 2 3 4 5 6 hyejeong3283@gmail.com CSS SCRIPT 선택자 // 선택자 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = sliderWrap.querySelector(".slider__img"); // 보여지는 영역 const sliderInner = sliderWrap.querySelector(".slider__inner"); // 움직이는 영역 const slider = sliderWrap.querySelectorAll..

여러 이미지를 저장해 좌로 움직여 이미지를 보여주는 페이지를 만들었습니다. HTML Javascript Slider Effect02 슬라이드 이펙트 : 좌로 움직이기 1 2 3 4 5 6 hyejeong3283@gmail.com CSS script 선택자 // 선택자 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = sliderWrap.querySelector(".slider__img"); // 보여지는 영역 const sliderInner = sliderWrap.querySelector(".slider__inner"); // 움직이는 영역 const slider = sliderWrap.querySelectorAll..

여러 이미지를 저장해 슬라이드 형식으로 이미지를 보여주는 페이지를 만들었습니다. HTML Javascript Slider Effect01 슬라이드 이펙트 : 트랜지션 효과 1 2 3 4 5 6 hyejeong3283@gmail.com CSS SCRIPT 선택자 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = sliderWrap.querySelector(".slider__img"); const slider = sliderWrap.querySelectorAll(".slider"); let currentIndex = 0; // 현재 보이는 이미지 let sliderCount = slider.length; // 이미지 갯..

추가내용 점수 나오는 모달창 추가 첫 모달창에 이름을 입력하면 수험자 이름영역에 출력하기 카운터되는 시간이 1자리 수가되면 앞에 0붙이기 완성 화면 HTML Quiz 객관식 확인 CBT 유형 1 2 3 4 5 6 7 2020년 1회 정보처리기능사 기출문제 제출하기 59분 10초 수험자 : 이혜정 전체 문제수 : 0문항 남은 문제수 : 0문항 기능사 시험 시작하기 정보처리기능사 2005년 2회 정보처리기능사 2005년 4회 정보처리기능사 2005년 5회 정보처리기능사 2006년 1회 정보처리기능사 2006년 2회 정보처리기능사 2006년 3회 정보처리기능사 2006년 5회 정보처리기능사 2007년 1회 정보처리기능사 2007년 2회 정보처리기능사 2007년 5회 정보처리기능사 2008년 1회 정보처리기능사..

완성 화면 HTML Quiz 객관식 확인 CBT 유형 1 2 3 4 5 6 7 2020년 1회 정보처리기능사 기출문제 제출하기 59분 10초 수험자 : 이혜정 전체 문제수 : 0문항 남은 문제수 : 0문항 기능사 시험 시작하기 정보처리기능사 2005년 2회 정보처리기능사 2005년 4회 정보처리기능사 2005년 5회 정보처리기능사 2006년 1회 정보처리기능사 2006년 2회 정보처리기능사 2006년 3회 정보처리기능사 2006년 5회 정보처리기능사 2007년 1회 정보처리기능사 2007년 2회 정보처리기능사 2007년 5회 정보처리기능사 2008년 1회 정보처리기능사 2008년 2회 정보처리기능사 2008년 4회 정보처리기능사 2008년 5회 정보처리기능사 2009년 1회 정보처리기능사 2009년 5회..

이전에 만들었던 슬라이드, 이미지, 이미지/텍스트, 카드, 텍스트, 푸터 영역의 페이지들과 헤더, 배너 영역의 페이지를 하나로 모아 사이트페이지를 만들었습니다. 슬라이드 유형 슬라이드 유형 페이지 만들기! Figma 피그마를 이용해 만들고자하는 슬라이드 유형의 페이지를 작업했습니다. 슬라이드 유형 페이지 안에 넣은 아이콘을 만들어 jpg파일로 저장해주었습니다. HTML 코드 메인 슬라이드 영역 event hyejeong3283.tistory.com 카드 유형 카드 유형 페이지 만들기 카드 유형 페이지 만들기 피그마를 이용하여 만들고 싶은 페이지를 작업을 해주었습니다. 코드 반려동물을 키울때 필요한 책임감 애완동물을 "제대로" 기르려면 아이를 키우는 것 만큼 돈이 나 hyejeong3283.tistory...

Figma 피그마를 이용해 만들고자 하는 푸터 유형의 페이지를 작업했습니다. HTML 코드 푸터 반려동물 사이트 반려동물 소개 기타 반려동물 입양,분양 방법 사육 기본사항 반려견 반려견 종류 미용 정보 산책 맹견 관리 반려묘 반려묘 종류 미용 정보 그루밍 반려동물 건강 기본 건강상식 예방 접종 사료 구입 요령 금지 음식 반려동물 훈련 반려동물 복지 반려견 예절 반려묘 예절 반려동물과의 외출 반려동물 정보 반려동물 보호법 반려동물 등록제 유기동물 보호소 2023 hyejoeng 반려견 사이트 Portpolio is Power All Right Reserved footer__menu 클래스명을 가진 태그영역 안에 div태그 영역을 6개 만들고 그 안에 h3, ul, li 태그를 사용해 제목과 내용을 입력해주..

Figma 피그마를 이용해 만들고자 하는 텍스트 유형의 페이지를 작업했습니다. HTML 코드 notice 반려동물을 키울때 필요한 책임감 생명과 안전 보호 동물의 소유자 등은 동물로 하여금 갈증·배고픔, 영양불량, 불편함, 통증·부상·질병, 두려움과 정상적으로 행동할 수 없는 것으로 인하여 고통을 받지 아니하도록 노력하여야 합니다. 더보기 복지 증진 동물의 소유자 등은 사육·관리하는 동물의 습성을 이해함으로써 최대한 본래의 습성에 가깝게 사육·관리하고, 동물의 보호와 복지에 책임감을 가져야 합니다. 더보기 사육 환경 사육 공간 및 사육 시설은 동물이 자연스러운 자세로 일어나거나 눕거나 움직이는 등 일상적인 동작을 하는 데에 지장이 없는 크기이어야 합니다. 더보기 예방접종 전염병 예방을 위하여 정기적으로 ..

Figma 피그마를 이용해 만들고자하는 슬라이드 유형의 페이지를 작업했습니다. 슬라이드 유형 페이지 안에 넣은 아이콘을 만들어 jpg파일로 저장해주었습니다. HTML 코드 메인 슬라이드 영역 event 반려동물 알기 반려동물과의 상호작용, 즉 교감은 반려인의 정서적 안정 뿐 아니라 사회적 소통의 창구가 될 수 있습니다. 사람과 사회적 관계망에서 생기는 스트레스를 자연적 순수함을 간직하고 있는 반려동물에게서 위안을 받습니다. 자세히 보기 상담 신청 이전 이미지 다음 이미지 첫번째 이미지 두번째 이미지 세번째 이미지 플레이 정지 html 영역별 설명 : 제목을 적어줍니다. : 내용을 담을 구역을 만들어 줍니다. 영역 안에는 , 등의 버튼태그를 만들어 줍니다. slider__arrow, slider__dot라..

Figma 피그마를 이용해서 만들고자하는 이미지텍스트 유형 페이지를 작업했습니다. HTML 코드 notice 반려동물과 외출하기 반려동물 외출 시 챙겨야 할 것들과 주의사항입니다. 인식표 부착하기 목줄 등 안전조치하기 맹견의 경우 입마개 착용하기 배설물 수거하기 입장제한 여부 확인하기 반려동물을 안은 상태에서의 운전금지 대중교통 이용시 이동가방 사용하기 body 안에 html 태그들을 사용하여 각 영역별 보여줄 정보들을 정의합니다. 영역마다 class명을 주어 보다 효과적으로 css를 적용시킬 수 있습니다. body 안에 imgtext라는 클래스명을 가진 태그의 영역을 3개 만들어주었습니다. 1번째 영역에는 텍스트를, 2,3번째 영역에는 이미지를 넣었습니다. CSS 코드 head 안에 사용할 폰트를 링크..

Figma 피그마를 사용하여 만들고자 하는 이미지 유형 페이지를 작업했습니다. HTML 코드 반려동물 귀여운 반려동물들 입니다. 반려견 강아지는 산책을 좋아합니다. 하루에 충분한 산책시간을 가져야 합니다. 자세히보기 반려묘 고양이는 높은 곳을 좋아합니다. 고양이는 야외 활동을 거의 하지 않습니다. 자세히보기 body 안에 html 태그들을 사용하여 각 영역별 보여줄 정보들을 정의합니다. 영역마다 class명을 주어 보다 효과적으로 css를 적용시킬 수 있습니다. CSS 코드 html 안에 아래와 같이 css 효과를 넣어주었습니다. head 안에 사용할 폰트를 링크 태그를 통해 호출하여 사용합니다. style을 영역을 선언 후, 그 안에 html 태그 및 class명에 따른 스타일(css)효과를 작성합니다..

카드 유형 페이지 만들기 피그마를 이용하여 만들고 싶은 페이지를 작업을 해주었습니다. 코드 반려동물을 키울때 필요한 책임감 애완동물을 "제대로" 기르려면 아이를 키우는 것 만큼 돈이 나간다. 사료, 간식, 장난감, 병원비는 물론이고, 애완동물 출입을 허가하는 주거시설과 놀이 시설에 가기 위해 많은 비용을 지불해야 한다. 먼 거리까지 가려면 자동차도 필수다. 동거인에게 허락받기 새로운 가족을 들이는 것이나 마찬가지이므로, 같이 살고 있는 사람의 동의를 얻도록 한다. 왜냐면, 동물을 키운다는 것이 사실 애정만으로는 여러 가지로 어렵기 때문이다. 자세히 보기 타인에게 피해를 주지 않기 동물은 자신이 어떤 행위를 해야 사회적, 법적으로 분쟁이 발생하는지 알 도리가 없으므로 그 주인이 예상되는 문제점을 숙지하여 ..

1. font-family 문자의 글꼴을 지정하는 속성입니다. 여러 단어이거나 한글 글꼴인 경우는 따옴표로 감싸고 여러 개의 글꼴을 쉼표로 구분하여, 지정한 글꼴이 없을 경우 그 다음 글꼴로 지정할 수 있습니다. font-family: '돋움', Dotum, Arial, Helvetica, sans-serif ; 2. font-size 문자의 글자 크기를 지정하는 속성입니다. 글자 크기는 명시하지 않을 경우 16px이 기본입니다. CSS에서 유용하게 사용하는 단위에는 다음과 같은 것들이 있습니다. 단위 코드 예시 설명 px font-size: 12px; 해상도에 따라 상대적으로 달라지는 기본 단위 % font-size: 150%; 부모 요소의 글자 크기를 100% 기준으로 계산한 단위 em font-si..

grid layout은 페이지를 여러 주요 영역으로 나누거나, 크키와 위치 및 문서 계층 구조의 관점에서 HTML 기본 요소로 작성된 콘트롤 간의 관계를 정의하는데 탁월합니다. flex 처럼 반응형 디자인을 만들 때 사용하는 방법 중 하나입니다. flex와 grid의 큰 차이점 flex는 한 방향 레이아웃 시스템 (1차원) grid는 두 방향 (가로-세로) 레이아웃 시스템 (2차원) 따라서 flex 보다 더 복합적인 레이아웃 표현이 가능합니다. grid 속성 부모 요소인 grid container 와 자식 요소인 grid item이 있습니다. container가 grid의 영향을 받는 전체 공간이고, 설정된 속성에 따라 각각의 item들이 어떤 형태로 배치되는 것이라고 생각하시면 됩니다. flex와 마찬..

flex layout은 요소들이 포함된 큰 박스에 flex를 선언하고, 안에 있는 요소들에게는 유연하게 배치하는 속성들을 부여하여 레이아웃을 잡는 것입니다. display: flex; 위의 구문은 해당 요소에 flex로 레이아웃을 설계한다고 선언한다는 뜻입니다. flex 속성 부모 요소인 flex container 와 자식 요소인 flex item이 있습니다. container가 flex의 영향을 받는 전체 공간이고, 설정된 속성에 따라 각각의 item들이 어떤 형태로 배치되는 것이라고 생각하시면 됩니다. flex container : 컨테이너에 적용하는 속성 display flex-direction flex-wrap flex-flow justify-content align-items align-cont..

See the Pen Untitled by hyejeong3283 (@hyejeong3283) on CodePen.

See the Pen Untitled by hyejeong3283 (@hyejeong3283) on CodePen.

See the Pen Tail Animation by hyejeong3283 (@hyejeong3283) on CodePen.

마무리 문제풀이 (명언 랜덤) 에서 배경이미지를 추가하여 같이 10초마다 바뀌게 만들었습니다. HTML 배경이미지를 넣기 위해 wrap클래스명을 가진 div로 main 영역을 감쌌습니다. CSS SCRIPT 추가한 script function randomImg(){ let wrapImg = document.querySelector(".wrap"); const bgimgURL = `https://source.unsplash.com/random/?nature&t=${new Date().getTime()}`; wrapImg.style.backgroundImage = `url(${bgimgURL})`; } randomImg(); setInterval(randomImg, 10000); 함수 randomImg를 만..

문제 자바스크립트를 사용해서 자동으로 복권 번호를 생성해주는 프로그램을 작성하세요. 번호는 중복되면 안되므로 Set을 이용하고, 숫자는 1부터 45까지의 범위 안에 있어야 하며, 6개의 무작위 수를 추출합니다. 버튼을 클릭했을 때 모든 조건을 반영해서 6개의 숫자를 추출하세요. HTML 로또 번호 생성기 추첨 CSS SCRIPT 추첨 버튼 클릭시 실행하는 함수 lottoNumber를 생성합니다. button.addEventListener("click", lottoNumber);를 통해 버튼에 클릭 이벤트를 등록합니다. let randomLotto = new Set(); 중복된 데이터를 저장하지 않는 배열 변수를 만들어 줍니다. 6개의 추첨 번호를 출력하기 위해 for문을 사용해 6번 반복실행하여 .add..

문제 명언 데이터를 가져와 그 중에서 1개의 명언만 가져와서 문서의 #result 영역에 명언 내용과 말한 사람을 표시해보세요. 이 때 명언 내용은 #result 영역에 있는 .quote 영역에, 말한 사람은 .author 영역에 표시하세요. 10초마다 명언과 말한사람이 바뀌게 작업하세요. HTML CSS SCRIPT JSON 형식으로 된 명언 데이터가 들어있는 사이트의 주소를 quoteURL 변수에 저장합니다. 함수 randomQuote에 fetch(quoteURL)를 사용하여 명언데이터를 가져옵니다. .then(response => response.json()) fetch 성공 했을 때 실행되는 것으로 가져온 데이터를 변수 response에 저장 후 데이터 형태를 json으로 바꿔줍니다. .then(..

2009년 9월 27일 필기 기출문제 3. (11111)2 + (01011)2의 결과로 옳은 것은? ① (101010)2 ② (110101)2 ③ (101001)2 ④ (010101)2 11111 +01011 ______ 101010 6. 기억장치에서 읽어낸 명령을 받고 이것을 실행하기 위하여 일시 기억하는 레지스터는? ① 명령(instruction) ② 누산기(accumulator) ③ 저장(storage) ④ 인덱스(index) 명령어를 읽어서 저장한다고 하였으므로 명령어 레지스터(IR) 입니다. 15. 다음 논리회로의 논리식은? 정답 : 1번 드모르간 정리를 이용하면 됩니다. f = (A' +B')' = A"·B" = A·B 31. 다음 ( )안에 공통으로 들어갈 알맞은 용어는? ① Input/Ou..

2015년 7월 19일 필기 기출문제 1. 색의 3속성 중 사람의 눈이 가장 예민하고 강하게 반응하는 대비는? ❶ 명도대비 ② 색상대비 ③ 보색대비 ④ 채도대비 색의 3속성은 색상, 명도, 채도이다. 명도대비:명도가 다른 두 색의 영향에 의해 명도차가 다르게 지각되는 현상. 주위 색에 따라 더욱 밝게 느껴지거나 더욱 어둡게 느껴짐. 3. 디자인의 원리 중 비례에 대한 설명이 잘못된 것은? ❶ 균형을 가장 많이 고려하여 구성해야 한다. ② 부분과 부분, 부분과 전체에 균형이 잡혀있음을 말한다. ③ 조형을 구성하는 모든 단위의 크기를 결정한다. ④ 객관적 질서와 과학적 근거를 명확하게 드러내는 구성 형식이다. 비례란 부분과 부분, 부분과 전체의 연관시켜서 상대적으로 설명하는 것으로 부분사이의 상호관계에 대한..

2011년 4월 17일 필기 기출문제 2. 다음 중 RISC(Reduced Instruction Set Computer)의 설명으로 옳은 것은? 명령어마다 다른 수행 사이클을 가지므로 파이프라이닝이 효율적이다. 메모리에 대한 액세스는 LOAD와 STORE만으로 한정되어 있다. 마이크로 코드에 의해 해석 후 명령어를 수행한다. 주소지정방식이 다양하게 존재한다. RISC의 약자인 Reduced는 제한된으로 해석 될 수도 있습니다. 따라서 메모리에 대한 엑세스는 LOAD와 STORE만으로 "한정" 되어 있다.에서 한정 이라는 말과 Reduced의 뜻이랑 같습니다. 5. 다음에 실행할 명령어의 번지를 기억하는 레지스터는? Program Counter Memory Address Register Processor ..

01. 다음의 결과값을 작성하시오. { let num = 0; while(false){ num++; if( num == 3 ){ continue; } if( num > 10 ){ break; } } console.log(num); } 정답 : 0 02. 다음의 결과값을 작성하시오. { let a = 6, b = 9, c = 3, result; result = ++a + b++ + ++c; console.log(result); console.log(a+b+c); } 정답 : 20 21 03. 결과값을 작성하시오. { function func(){ let a = []; for(i=1; i

코딩일기 2번째 입니다. 오늘은 부족하다고 생각한 내용들을 정리하려고 합니다. 전역 변수, 지역 변수 전역변수 : 함수 바깥에서 선언된 변수를 얘기하며 프로그램 전체에서 접근이 가능한 변수입니다. 지역변수 : 함수 내부에서 선언된 변수로 함수의 실행, 종료와 함께 생성되고 소멸되는 변수이고, 함수 바깥쪽에서 접근하는 것이 불가능합니다. let x = 100; // 전역 변수 let y = 200; // 전역 변수 function func(){ x = 300; // 전역 변수 - let이 앞에 없으므로 전역변수 x의 값을 변경 let y = 400; // 지역 변수 z = "javascript"; console.log("함수안"+x); //300 console.log("함수안"+y); //400 conso..

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 3 true 02. 다음의 결과값을 보고 빈칸을 채우시오. { function func(){ document.write("함수2가 실행되었습니다."); } function callback(str){ document.write("함수1가 실행되었습니다."); _______(); } callback(func); //함수1가 실행되었습니..

01. 결괏값을 작성하시오. { (function(){ console.log("함수가 실행되었습니다."); })(); } 정답 : 함수가 실행되었습니다. 02. 결괏값을 작성하시오. { function func(str = "함수가 실행되었습니다."){ document.write(str); } func(); } 정답 : 함수가 실행되었습니다. 03. 결괏값을 작성하시오. { let sum = 0; for(var i=1; i num2) return num1 else return num2 } console.log(func(10, 23) + func(40, 50)) } 정답 : 73

MySQL 이란? MYSQL은 전세계적으로 가장 널리 사용되고 있는 오픈 소스 데이터베이스이며, MySQL AB사가 개발하여 배포/판매하고 있는 데이터베이스(DataBase)이다. 표준 데이터베이스 질의 언어 SQL(Structured Query Language)을 사용하는 개방 소스의 관계형 데이터베이스 관리 관리시스템(RDBMS), 매우 빠르고, 유연하며, 사용하기 쉬운 특징이 있다. 다중사용자, 다중 쓰레드를 지원하고, C, C++, Eiffel, 자바, 펄, PHP, Pyton 스크립트 등을 위한 응용프로그램 인터페이스(API)를 제공한다. 유닉스나 리눅스, Windows 운영체제 등에서 사용할 수 있다. LAPM 즉 리눅스 운영체제와 Apahe 서버 프로그램, MySQL, PHP 스크립트 언어 ..