영부터 구까지 영부터 구까지

HTML 코드 CSS 코드 JavaScript 코드 HTML & JavaScript 코드 HTML 코드 Clear = 1 2 3 + x^y 4 5 6 - sin 7 8 9 * cos 0 +/- . / tan 원래 만들고자 한 디자인이 있어, 정확히 따라해 보고자 버튼에 클래스 이름을 너무 많이 주었다. 막상 디자인을 보아하니 클래스 이름을 너무 많이 준 것 같아 코드가 복잡해 보인다. CSS 코드 #firstLine { text-align: center; } .button1 { width: 40%; color: blue; } #otherLines { text-align: center; } .button2 { width: 16%; color: blue; } .button3 { width: 16%; marg..

개요 쿠키(Cookie) 쿠키(Cookie)의 목적 쿠키(Cookie)의 구성 요소 쿠키(Cookie)의 동작 방식 세션(Session) 세션(Session)의 동작 방식 쿠키(Cookie)와 세션(Session)의 차이 개요 쿠키와 세션을 이해하기 위해서는 먼저 HTTP의 특징에 대해 이해해야 한다. HTTP(Hypertext Transfer Protocol)는 인터넷상에서 데이터를 주고 받기 위해 서버/클라이언트 모델을 따르는 통신규약을 말한다. HTTP 프로토콜에는 비연결성(Connectionless)과 비상태성(Stateless)라는 특징이 있다. - 비연결성(Connectionless) : 클라이언트가 요청을 한 후 응답을 받으면 연결을 끊어버림 - 비상태성(Stateless) : 통신이 끝나면..

시나리오 전체 코드 HTML을 통해 간단한 회원 가입 페이지를 만들어 보았다. [ 시나리오 ] 사용자의 정보를 담을 수 있는 틀인 표, 태그를 만들고 그 안을 태그와 태그로 묶는다. 사용자는 본인의 정보를 에 입력한다. ( 단, 아이디, 비밀번호, 비밀번호 확인은 4~12자 글자 수 제한 ) 주민등록번호는 13자리를 입력해야 한다. ( ex) 1234561234567 = 13자리 ) 생일의 월과 일은 태그 안에 태그를 통해 설정한다. 관심분야의 체크박스는 를 통해 만든다. 자기소개란은 태그를 통해 구성한다. 위의 사용자 정보를 태그로 묶어 버튼이 가질 정보들을 묶는다. 회원 가입 버튼은 위의 조건들이 만족했을 때 태그의 action을 통해 메일을 보낼 수 있도록 한다. 다시 입력 버튼은 입력했던 내용들이..

시나리오 HTML 코드 JavaScript 코드 전체 코드 HTML, CSS, JavaScript를 배우고 만들어 낸 첫 결과물이다. [ 시나리오 ] 사용자는 'inputText'라는 id를 가진 태그에 입력을 하고 [미리보기] 버튼을 누르게 되면 색상, 크기, 체크된 글자 형태에 따른 결과값을 태그에 담아 미리 볼 수 있다. JavaScript의 String method를 사용하여 글자의 형태를 바꾸었다. JavaScript의 Document 객체의 getElementByID(), getElementsByName()을 이용하여 HTML에 있는 공통된 ID와 Name들을 모았다. 또한 이를 사용하기 위해 HTML에서도 태그들의 ID와 Name을 지정해 주었다. [ HTML ] 색상: 빨강 파랑 초록 크기..

개요 HTTP Get 방식 Get 방식의 특징 Post 방식 Post 방식의 특징 - 개요 클라이언트는 인터넷 브라우저 주소창에 URL을 입력하고, 서버는 클라이언트의 요청에 응답하여 웹페이지를 보여준다. 이 때, 클라이언트가 서버로 보내는 데이터를 HTTP 패킷이라고 하며, HTTP 패킷은 크게 Header(헤더)와 Body(바디)로 나누어진다. Header(헤더)는 HTTP Method 방식, 클라이언트와 브라우저, 접속하고자 하는 URL 정보 등이 담겨져 있다. Body(바디)는 보통 비어있으며, 정보를 담아서 서버에 요청할 수 있다. 클라이언트가 서버로 요청을 보내는 HTTP Method에는 여러 가지가 있는데, 그 중 두개인 Get 방식과 Post 방식에 대해 알아보자. - HTTP HTTP란,..

OSI 7계층 TCP/IP 4계층 - OSI 7계층 OSI 7계층 모델은 네트워크 통신이 일어는 과정을 7단계로 나눈 것을 말한다. 계층을 나눈 이유 : 통신이 일어나는 과정을 단계별로 파악하기 용이하기 때문이다. 특정 계층에서 이상이 생기면, 다른 계층은 놔두고 문제가 있는 계층만 고쳐서 문제를 해결한다. 1계층. Physical Layer (물리계층) 전기적, 기계적, 기능적인 특성을 이용하여 통신 케이블로 데이터를 전송한다. 사용되는 통신 단위는 비트(bit)이며, 0 또는 1만 나타낼 수 있다. 단지 데이터를 전달하기만 하고, 전송하거나 받으려는 데이터가 무엇인지는 신경쓰지 않는다. 대표적인 장치로 통신 케이블, 리피터, 허브 등이 있다. 2계층. DataLink Layer (데이터 링크계층) 물..

GUI 프로그래밍이란? AWT란? Container란? Component란? LayoutManager란? 이벤트(Event)란? 구현 - GUI 프로그래밍이란? GUI는 과거에 사용하던 DOS(CUI방식)와 같은 방식의 텍스트 기반 운영체제가 아닌 그래픽을 이용하여 사용자와 프로그램 간의 상호작용을 할 수 있도록 해주는 인터페이스를 의미한다. 자바에서는 이러한 그래픽 프로그래밍을 지원하기 위해 나온 것이 AWT이다. - AWT란? AWT(Abstract Window Toolkit)는 GUI 프로그래밍을 제작하기 위해 자바에서 제공하는 라이브러리 AWT는 모든 GUI 프로그램에 사용되는 컴포넌트 및 툴킷을 제공, 향후 JFC와 같은 스윙(Swing)의 모태가 된다. AWT는 운영체제에 구애받지 않고 쓸 수..

JavaFX란? JavaFX의 장점 설치하기 전 간단한 응원 한마디 JavaFX 설치하기 SceneBuilder 설치하기 Eclipse(이클립스)에 JavaFX 적용하기 - JavaFX란? JavaFX는 RIA(Rich Internet Application)를 개발하고 배포하는 소프트웨어 플랫폼이며, 다양한 장치에서 실행이 가능하다. JavaFX는 자바 SE를 위한 표준 GUI 라이브러리로서 스윙(Swing)을 대체하기 위해 고안되었다. - JavaFX의 장점 JavaFX는 기존의 Swing보다 훨씬 가볍고, 더욱 더 좋은 그래픽을 지원하다. 또한 Web에서도 호환이 가능하다. 또한 Java 기반에서 동작하기 때문에, Linux, Windows, OS X 등등 Java를 설치할 수 있는 플랫폼이라면 모두..