본문 바로가기

전체 카테고리361

[JavaScript] 숫자와 문자 1. 숫자 프로그래밍에서 가장 많이 사용하는 데이터형인 문자와 숫자를 어떻게 표현하고 연산하는지 알아보겠습니다. 자바스크립트에서는 큰따옴표나 작은따옴표가 붙지 않은 숫자는 숫자로 인식합니다. 다음과 같은 파일을 실행해보면 각각의 연산에 대해서 경고창이 뜨는 것을 볼 수 있습니다. '/'는 나누기 연산자로 몫을 반환합니다. '*'는 곱하기 연산을 합니다. 하지만 이렇게 파일을 만들지 않고 개발자 도구를 이용해서 쉽게 자바스크립트를 실행해 볼 수 있습니다. 크롬을 기준으로 F12키를 클릭 후 console창에 alert(1); 을 치면 조금 전과 같은 결과를 얻을 수 있습니다. Math.pow(3,2); // 9, 3의 2승 Math.round(10.6); // 11, 10.6을 반올림 Math.ceil(1.. 2019. 5. 23.
[Javascript] 자바스크립트 Hello World 자바스크립트를 통해 'Hello World' 라는 문장을 띄워보겠습니다. 밑의 코드와 같이 html 파일을 만들어 보겠습니다. 부분 사이에 자바스크립트 코드를 넣겠습니다. alert라는 경고창을 띄워주는 함수를 실행하겠습니다. 파일을 저장할 때는 .html로 확장자를 선택해주면 됩니다. 코드 는 자바스크립트 구간이 끝났기 때문에 이 후부터 나타나는 코드는 HTML의 문법으로 해석하라고 브라우저에게 알려주는 것입니다. 2019. 5. 23.
[HTML] HTML video 태그 HTML의 video 태그에 대해서 알아보겠습니다. 이 전에 배웠던 태그와 비슷하게 사용하면 됩니다. HTML5가 등장하기 전에는 비디오를 올리는 표준화된 방법이 없었습니다. 비디오는 기본적으로 오랜시간 동안 브라우저가 제공하지 않았습니다. 플래시라는 프로그램을 이용하여 비디오를 보여주었습니다. 브라우저마다 브라우저가 진행하는 포맷(코덱)이 다릅니다. 파이어폭스의 경우에는 ogv, 크롬 같은경우에는 mp4. 코드 처럼 작성하면 가장 선호하는 형식을 웹브라우저가 선택해서 보여줍니다. 따라서 source를 여러개 써 넣어놔도 상관이 없습니다. 그리고 동영상 컨트롤을 위해서 video 태그안에 controls를 써줍니다. autoplay 속성같은경우에는 동영상이 자동으로 실행되게 해줍니다. 그때 그때 필요한 .. 2019. 5. 23.
[HTML] 외부문서삽입(iframe) iframe iframe의 등장시기는 html 4.01입니다. 웹 페이지에 다른 웹 페이지를 삽입하는 방법인 아이프레임은 참 편리하면서도 위험한 방법입니다. 왜냐면 신뢰할 수 없는 사이트에서 악성코드 같은 것을 포함하고 있다면 삽입된 외부소스에서 악성코드가 실행될 수 있기 때문이죠. 이런 문제를 해소하기 위해서 HTML의 최신 버전인 HTML5에서는 샌드박스라는 것을 도입했습니다. 아이프레임으로 삽입된 웹 페이지에서 자바스크립트 등이 실행되지 않도록 하는 방법입니다. 다음 코드는 http://opentutorials.org 를 iframe에 가져오는 소스입니다. 가로, 세로 높이를 지정해 줄 수 있습니다. 이 iframe은 외부의 콘텐츠를 내 사이트로 가지고 올 때 많이 사용합니다. Iframe에 san.. 2019. 5. 12.
[Spring Framework] 스프링 시작하기 스프링이란 무엇인가? 애플리케이션의 기본 틀 - 스프링 컨테이너 스프링 컨테이너 : 설정정보를 참고로 해서 애플리케이션을 구성하는 오브젝트를 생성하고 관리 공통 프로그래밍 모델 - loC/DI, 서비스 추상화, AOP 3가지 핵심 프로그래밍 모델 지원 * IoC/DI 오브젝트의 생명주기와 의존관계에 대한 프로그래밍 모델. 유연하고 확장성이 뛰어난 코드를 만들 수 있게 도와주는 객체지향 설계 원칙과 디자인 패턴의 핵심 원리를 담고 있는 IoC/DI를 프레임워크의 근간으로 삼고 있습니다 * 서비스 추상화 스프링을 사용하면 환경이나 서버, 특정 기술에 종속되지 않고 이식성이 뛰어나며 유연한 애플리케이션 만들 수 있습니다. 이를 가능하게 해주는 것이 바로 서비스 추상화입니다. 구체적인 기술과 환경에 종속되지 않.. 2019. 5. 12.
[HTML] View Port 만든 웹페이지를 모바일이나 태블릿에서 볼만하게 만들어주는 방법을 알아 보겠습니다. HTML 기술소개 기본문법 하이퍼텍스트와 속성 리스트와 태그의 중첩 선행학습 본 수업을 효과적으로 수행하기 위해서는 웹애플리케이션에 대한 전반적인 이해가 필요합니다. 이를 위해서 준비된 수업은 아래 링크를 통해서 접근하실 수 있습니다. 크롬 웹브라우저에서 F12버튼을 눌러 개발자 도구를 실행합니다. 그 후 위의 사각형 버튼을 누릅니다. 그러면 Responsive를 클릭 후 원하는 기기를 선택합니다. 그러면 그 기기에서 나타나는 화면을 볼 수 있습니다. 2019. 5. 8.

티스토리툴바