본문 바로가기
반응형

전체 글340

[Web] Database - 1 Database 데이터베이스란 정보를 관리하는 전문 애플리케이션이다.웹에서 데이터베이스가 담당하는 것은 정보이며 서버에서 정보를 저장하는 역할을 한다. 정보를 저장한다는 면에서 DB는 파일과 비교될 수 있는데파일은 어느 시스템에서나 사용가능하다, 그러나 DB는 프로그램이 설치되야하며 사용법을 알고있어야한다.그럼에도 불구하고 DB가 쓰이는 이유는 파일과는 비교할 수 없을정도로 많은 장점을 가지고 있기 때문이다. 첫번째, DB는 안전하다.백업이나 보안기능을 가지고 있으므로 임의로 열람이 가능한 파일과 다르게 안전하다는 장점이 있다. 두번째, DB는 빠르다.인덱스 기능을 가지고 있으므로 프로그래밍적으로 제어가 가능하다. 이외에도 다양한 장점이 많으나 크게 나누자면 이 두가지가 될수 있겠다. 현재 자주 사용되는.. 2017. 4. 18.
[Web] JavaScript&PHP JavaScript&PHP 웹페이지를 만들기 위해서는 여러가지 언어가 필요하다.HTML로도 충분히 웹페이지를 만들수 있지만 디자인적/기능적으로 부족하기 때문에다른 언어로 그 부분을 보충해줘야한다.그 중 기능적인 부분을 담당하는것이 Java Script, PHP이다.그중 Java Script는 클라이언트 쪽, PHP는 서버 쪽에서 동작하게 된다. Java Script - 정적인 웹페이지에 동적인 기능을 부여한다.PHP - 서버 쪽에서 하나의 PHP로 여러개의 웹페이지를 호출 하는 기능크게 나누자면 다음과 같이 분류 할수 있다. 더 쉽게 말하자면 HTML은 정보를 제공하기 위함,CSS는 웹페이지의 디자인, Java Script는 기능적인 부분을 담당한다라고 할수있다.PHP는 추후 DB와 함께 설명하도록 하겠.. 2017. 4. 18.
[Web] CSS(Cascade Style Sheet) - 2 CSS(Cascade Style Sheet) - 2 박스 모델 CSS로 태그들의 부피 위치 등을 지정해주는 것이다.위의 그림을 보면 쉽게 이해가 될 것이다.CONTENT를 기점으로 넓이와 높이, 내부공간에 대한 Padding, 아웃라인인 Border그리고 다른 컨텐츠 사이의 간격인 Margin을 통해 content를 배치한다.CSS는 이러한 위치, 부피에 박스 모델을 적용한다. 우선 3개의 리스트를 작성했다.리스트마다 효과를 다르게 주기 위하여 내부에 ID를 부여한다.CSS에서 아이디는 #ID로 구분할 수 있다.먼저 2번째 리스트에 border라인과 padding, margin이 적용되었다.여기서 내부공간과 다른 태그와의 간격이 어떻게 변경되었는지 확인해보자. 구글의 경우 웹페이지에서 우측클릭 -> 검사.. 2017. 4. 18.
[Web] CSS(Cascade Style Sheet) - 1 CSS(Cascade Style Sheet) - 1 HTML을 설명하는데 있어서 뗄레야 뗄수 없는 관계 바로 CSS이다CSS는 HTML과 다른 독립적 언어임에도 불구하고, 개별적으로 사용되기 어렵다.이유는 CSS가 HTML을 디자인하기 위해 제작되었기 때문이다.초기에는 HTML에도 디자인을 담당하는 태그가 있었으나 현재는 CSS에 흡수 되었다.쉽게 말해 웹페이지에서 HTML은 정보를, CSS는 디자인을 담당한다고 할 수 있다. 이러한 CSS를 HTML문 내에서 구분할수 있게 만드는 것은 이 나올 때 까지이다. 내부의 문법은 다음과 같다.먼저 선택자는 누구에게 스타일을 적용할 것 인가를 나타낸다.서술은 어떤효과를 적용할것인가를 나타낸다.마지막으로 이를 통틀어 속성이라고 부른다. 간단한 예제를 통해 CSS를.. 2017. 4. 18.
[Web] ATOM 에디터 ATOM 에디터 HTML은 메모장에서 돌아갈 정도로 가볍지만, 이 경우 가독성과 생산성이 그리 좋지 않다따라서 ATOM이나 sublime text등과 같은 여러 툴들이 생겨나게 되었다.이러한 텍스트 에디터의 장점으로는 코드 하이라이터로 가독성이 좋고,자동완성 기능으로 생산성이 비약적으로 향상된다는 것이 있다.또한, 플러그인등의 설치로 확장성도 높아진다. 오늘은 이러한 텍스트 에디터 중 ATOM에 대한 설치와 사용법에 대해 알아보자 ATOM은 git재단에서 지원하는 무료 에디터 이다.공식 홈페이지는 다음과 같다.https://atom.io/ 홈페이지에 접속하여 ATOM을 다운받는다윈도우나 맥 둘다 설치과정이 그리 어렵지 않으니, 방법은 생략한다.설치가 완료 되었으면 ATOM을 실행시킨다. 1. 폴더 지정 .. 2017. 4. 18.
[Web] HTML(Hypertext Mark-up Language) HTML(Hypertext Mark-up Language) 1. HTML이란? HTML을 설명하기 앞서 먼저 우리가 사용하는 웹페이지의 동작과정에 대해 알아보도록 하자우선, 웹은 크게 클라이언트와 서버의 두파트로 나뉘어진다. 클라이언트는 우리가 흔히 사용하는 PC이다. 이 PC에서 웹 서버로 요청을 보내게 되는 것이다. 서버에서는 이러한 요청을 받아 페이지를 찾고, 응답하게 된다.이런 일련의 과정을 통하여 우리가 보는 웹페이지가 브라우저에 뜨게 되는것이다. HTML은 Hypertext Mark-up Language의 약자이다.이것이 뜻하는 바가 무엇인지 알아보면 HTML에 대한 이해가 더 쉬울것이다.. - Hypertext : 쉽게 말해 문서 사이의 링크라고 할수 있다.우리가 네이버 등에서 텍스트를 클릭.. 2017. 4. 18.
[Web] Mac Bitnami 설치 Bitnami 설치(mac 기준) 우리가 사용하는 어플리케이션은 클라이언트 사용자 기준에서 제작되었기 때문에 설치과정에 있어서 별다른 어려움이 없다.그러나 서버에서 사용하는 프로그램의 경우 사용자가 엔지니어라는 가정하에,서버프로그램을 만드는 제작자 입장에서 제작 되었기 때문에 설치과정이 복잡하다.따라서, 이와 같은 불편함을 겪는사람들이 상당수이다.특히 학생들은 개발환경 구축에서 막혀 더이상 진행하지 못하는 경우도 있다. 이를 위해 Apache, MySQL, PHP를 한방에 설치할수있는 프로그램이 제작되었다. Bitnami도 그러한 프로그램중에 하나이다. 구글에 bitnami mamp를 검색하고 제일 상단 사이트에 접속한다. 웹사이트의 우측 하단에 보면 로컬 인스톨이라는 창이 있다.버전을 선택하여 다운로드.. 2017. 4. 18.
[네트워크] HTTP의 기초 - 4 HTTP의 기초 - 4 전에 다루었던 HTTP의 특성중에 로그인은 어떤 상태인지 알아보자앞서 HTTP는 stateless 상태, 서버에 상태를 저장할수 없다고 했었다.그렇기 때문에 사용자 구분을 위해서 쿠키를 사용한다. 사용자 식별에는 다음과 같은 방법이 있다.1) IP 추적2) HTTP Authentication3) URL에 식별자 포함4) Cookie 이 중에서 쿠키를 제일 많이 사용한다. 쿠키는 서버에서 먼저 요청한다.브라우저가 서버에 데이터를 요청을 했을때 서버에서 사용자 확인이 필요하다면 Set-Cookie라는 명령에 세션 아이디를 실어 보낸다.그러면 클라이언트는 이 세션 아이디를 받아 쿠키 값을 생성한다.그리고 다음부터 서버에 쿠키 데이터와 함께 요청을 전송 해준다. 세션은 상당히 긴 숫자로 .. 2017. 4. 18.
[네트워크] HTTP의 기초 - 3 HTTP의 기초 - 3 HTTP의 기초 중 포맷에 대해서 알아보자우리가 response를 보낼 때 content-type이라는 것이 있었는데어떤 타입으로 응답할 지를 정하는것이다.이를 MIME(Multipurpose Internal Mail Extensions)이라고 부른다 여기서 MIME은 email 서비스를 위한것이다email은 흔히 사용하는 네이버나 gmail과 같은 웹메일이 아니다 예전에 email이라는 인터넷 서비스가 있었는데,이를 위한 표준이었다. content-type은 다음과 같이 분류되어질 수 있다.중요한것 중에 multipart/form-data 가 있다.대용량의 파일을 전송할때 사용하는데, 이미지등을 업로드할 때 form-data를사용해야지 오류가 나지 않는다. 인터넷 통신의 경우 4.. 2017. 4. 18.
반응형

티스토리툴바