반복문 while문 while문은 반복문 입니다. 반복문은 어떠한 값이 조건에 의해 그 조건에 만족하는 동안 계속 실행할 수 있습니다. 예를 들어 1을 200회 화면에 출력을 해야 한다면 1을 직접 200번 타이핑 하지 않고 반복문을 사용해 200회 출력할 수 있게 할 때 사용합니다. while(조건){조건에만족할동안실행할명령문} 위의 소스를 보면 a의 값을 1로 선언 후 조건에는 a가 10보다 작거나 같다는 조건이 있습니다. 그리고 그동안에 a의 값을 출력하는 명령문 그리고 a의 값을 1씩 올리는 a++가 있습니다. 위의 소스에 a++가 없다면 a가 값을 증가하면서 10에 도달하는 기능이 없으므로 무한루프에 걸리게 됩니다. 다음은 1부터 10까지의 누적합을 구하는 소스입니다. 다른예제 sum+=x; =..

자바스크립트 제어문 자바스크립트 제어문 조건문(if, if~else, switch~case) 조건에따라 다음문장을 선택적으로 실행한다. 반복문(for, while, do~while) 동일한 명령을 여러번 처리하거나 특정 연산을 반복적으로 처리한다 보조제어문(contune, break) 조건문을 만나면 건너뛰거나 반복수행을 종료한다. 반복문내에서 사용한다. 조건문 if문 if~else문 // M 자리에는 M외에 다른 문자들은 모두 여자로 출력된다. 아래는 if~else문을 이용해 다른 html파일을 를 불러오는 예제이다. 아이디, 비밀번호 입력 id = prompt("아이디입력"); if (id == "admin") { password = prompt("비밀번호입력"); if (password === "1..

연산자 (특정값을 조회하여 변환액션을 만드는 것) 피연산자에게 연산 명령을 내리기위해 사용하는 기호 연산자의 종류 : 문자열연산자, 산술연산자, 비교연산자, 논리연산자, 조건연산자, 대입연산자 [간략설명] 문자열연산자: + 하면 문자끼리붙여서 출력한다 산수연산자 : ++은 1씩늘어간다는 의미이다. 조건연산자 : 특정조건에따라, 참/거짓이 나온다. 대입연산자 : += 은 기존값에 어떤값을+한다(아래예시참고) ** =거듭제곱 /는 그냥 나누기(5 / 2 == 2.5)고.. %는 나머지(5 % 2 == 1)이다. % 나머지 값은 자주사용된다. 사용 예) 홀수: X%2 = 1 짝수: Y%2 = 0 어떤값이 들어와도 5를 넘기면 안돼 X % 5 = 0~4사이의 값만 반환 ​ 증감연산자는 증가연산자(++) / 감소..

1. 자바스크립트의 역할 : AJAX : 서버와 통신하는 기술 덩어리를 만들어서 넣었다 뺐다 하는 방식이다. => 객체지향 ​ 자바스크립트는 DOM을 제어한다. ​ DOM: 브라우저 객체모델(BOM)중 하나이며, XML HTML 문서에 접근하기 위한 인터페이스이다. 넓은 의미로 웹 브라우저가 HTML페이지를 인식 하는 방식. DOM은 트리형식의 자료구조이다. 트리의 최상단 root에 html이 위치하며 하위노드에 head ,body가 위치하고 있으며 그 하위에 여러노드들이 포함 되어있다. DOM이 없다면 웹페이지 또는 XML페이지 및 요소들과 관련된 모델이나 개념들에 대한 정보를 가지지 못한다. DOM이란 무엇인가? 웹브라우저는 "HTML해석 -> 렌더링 (화면에출력)"​ 하는 과정을 거친다. HTML해..

Git 이란? 깃(Git /ɡɪt)은 프로그램 등의 소스 코드 관리를 위한 분산 버전 관리 시스템이다 리누스 토르발스가 개발한 분산형 버전 관리 시스템(VCS) 이다. (형상관리도구) 매우 빠른속도와 분산형 저장소 지원 , 데이터 무결성보장이 특징이다. 브랜치를 통해 개발한 뒤 본 프로그램에 합치는 방식으로 여러 명이 동시에 작업하는 병렬 개발이 가능하다. 여러명의 개발자(분산)가 특정 프로젝트를 자신의 컴퓨터로 협업하여 개발하면서 버전을 관리할 수 있는 시스템이다. ​ Git의 버전관리 방식 : ​ Git은 중앙 서버 컴퓨터와 여러개의 컴퓨터들이 연결되어 모두 같은 버전의 데이터베이스를 유지한다. 이 버전은 업데이트가 될 때마다 자동으로 생성된다. 따라서 이 파일들은 최신버전으로 모든 컴퓨터에서 유지될..

soundcloud 웹사이트 작업 정리 -1 ​ javascript 수업을 앞두고 html css 강의가 끝나고 기존 웹사이트를 따라 만드는 작업을 했다. ​ 사이트 선정 후 UI 설계서를 작성하였다. 자바스크립로 구현 해야 할 부분도 매우 많겠지만... 우선 최대한 배운 선에서 조금이라도 비슷하게 흉내를 내겠다 라는 마음으로 작성했다. 해당 설계서는 아마 새로운 것들을 체득하고 나서 다시 작성하는 것이 좋을 것 같다. 코드리팩토링도 마찬가지로 .... ​ 처음은 사이트를 관리자도구로 한번 쓱 봐준 후 대략적으로, 시멘트 태그 구역을 나누어 주었다. 1부분은 header , 2는 nav , 3은 section, 4는 footer로 나누어 주었다. ​ ​ ​ 텍스트를 스크랩 해 html 부분 먼저 틀을 잡..

빨간색 : 문제설명 / 노란색: css코드 / 보라색: 코드로 인해 움직여질 문제 요소 앞서 소개드린 Flex 게임과 비슷한 느낌의 게임이다.. 물길을 당근에, 독물을 잡초에 뿌릴수 있게 코드를 입력해주면 된다. 문제 설명이 잘되어있어서 정답이 있다고 보고 풀면 된다. ​ Grid Garden A game for learning CSS grid layout cssgridgarden.com CSS grid 공부 게임 추천 Grid Garden 링크 ↑ Grid Garden 문제 정답 ​ 1번 (그리드에서 기준을 잘 생각하여 문제를 풀자.) grid-column-start: 3; ​ 2번 grid-column-start: 5; +다른 정답으로 grid-column-stard: -1; 도 가능하고 grid-c..

HTML 레이아웃 display 속성값 종류 : block, inline , inlin block position 종류 : static, relative, absolute 해더안에 네비가 있는 경우가 많다. + inline block 인라인이지만 블록같은(속성을 넣을수있다) ​ float과 clear(float 레이아웃 해제) + clear 전재조건(float가 있을때) ​ 그리드 시스템 종류 : 정적그리드시스템 , 동적그리드시스템, 반응형그리드시스템 ​ 반응형 그리드 클래스 종류 : 모바일 태블릿 노트북 데스크탑 . col-xs-* .col-sm-* .col-md-* .col-lg-* 디바이스의 해상도에 따라서 적절하게 대응하는 반응형 웹을 만들기 위하여 사용하는 viewport 모바일 브라우저들은 v..