GET 방식과 POST 방식은 사용자가 서버에 요청하는 메서드 입니다

1. GET 방식

위 내용을 폼을 이용하여 GET 방식을 이용한 간단한 로그인 페이지입니다 로그인 페이지에서 로그인을 하게 되면 이전 페이지에 입력한 ID와 PW의 내용이 URL에 표시되는 것을 확인하실 수 있습니다

즉 GET 방식은 사용자가 서버에 요청한 후 서버에서 응답을 받을 때 URL 상에 정보가 담겨서 전송되게 됩니다

그러나 로그인 페이지에서 ID와 패스워드가 URL에 노출이 된다면 굉장히 위험한 보안적 이슈가 발생하게 되며, GET 방식 같은 경우에는 보안적으로 노출이 되지 않아야 되는 곳을 사용하지 않습니다

그렇다면 GET 방식은 사용해야 되는 곳이 있습니다 GET 방식으로 사용이 필요하 곳을 자유게시판 같은 곳을 예를 들어보겠습니다

자유게시판의 글을 사용자에게 접근하기 위해선 URL이 필요하며, 또한 현재 포스팅한 블로그도 URL이 필요합니다 다른 사용자가 접근을 용의하기 위한 노출이 되어도 문제가 없는 곳을 GET 방식으로 사용하게 됩니다

2. POST 방식

위 내용을 폼을 이용하여 POST 방식을 이용한 간단한 로그인 페이지입니다 로그인 페이지에서 로그인을 하게 되면 이전 페이지에 입력한 ID와 PW의 내용이 URL에 표시되는 않는 것을 확인하실 수 있습니다

즉 GET 방식은 사용자가 서버에 요청한 후 서버에서 응답을 받을 때 URL 상에 표시 되는 않는 것으로 생각하시면 됩니다.

POST 방식은 로그인, 회원가입 정보가 URL에 노출이 되지 않게 하기 위한 것을 하기 위해 사용됩니다

이번에는 GET 방식과 POST 방식을 웹로그 통해 알아보겠습니다

1. HTML 폼

위 로그는 폼 로그인 페이지 입니다

2. GET 방식

위 로그의 GET 방식인 것을 확인 하실수 있으며, http://server-talk.com/in_put/get.html(폼 페이지)를 통해 데이터를 전송 받아 /in_put/input.php?id=server&pw=talk(URL)의 접근 한것을 확인 할수 있습니다

3. POST 방식

위 로그의 POST 방식인 것을 확인 하실수 있으며, http://server-talk.com/in_put/get.html(폼 페이지)를 통해 데이터를 전송 받아 /in_put/input.php(URL)의 접근 한것을 확인 할수 있습니다

위 코드는 $_GET[ ]는 배열(Array) 라고 하며, 배열의 대한것은 배열관련의 포스팅에서 자세히 알아보도록 하고 $_GET[ ]의 대해 알아보도록 하겠습니다

위 출력내용의 URL를 자세히 보시면 input.php?id=server로 되어 있습니다

이번에는 URL의 server 부분을 talk 로 수정한 후 다시 접속하니 변경된 URL 정보로 브라우저에 출력되는것을 확인하실 수 있습니다

즉 위 출력내용을 본다면 변경한 URL의 server, talk 부분을 입력한 값의 따라 출력내용이 다르다는 것을 확인 하실수 있습니다.

그리고 input.php 파일이 사용자가 입력한 값에 따라서 다른 출력값을 보내주는것으로 사용자와 서버가 데이터를 주고받는 애플리케이션이 된것입니다

코드로 다시 돌아와서 $_GET[ ] 는 사용자가 입력한 정보를 받는것 영역이며, $_GET['id'] 괄호 안에 들어가는 값은 입력한 값의 이름이 된다는 것으로 볼수 있겟습니다

이번에는 폼을 이용하여 PHP 애플리케이션의 데이터를 입력해 보도록 하겠습니다

사용자가 URL의 직접 정보를 입력하는것은 많은 불편함이 있습니다 이러한 불편함을 해결하기 위해 만든것이 Form(폼) 입니다

Form(폼)이란? 사용자가 이력한 데이터를 받아 서버로 전송하는 HTML 태그이며, 사용자가 입력한 정보를 받은 후 입력받은 컨트롤에 포함되어 있는 속성값의 따라 데이터가 서버로 전송하게 됩니다

위 내용이 바로 폼입니다 이쁘지는 않지만 로그인하는데 필요한 정보는 모두 있죠? 폼의 대한 코드를 보도록 하겠습니다

File : form.html

File : input.php

위 코드는 폼의 출력내용의 HTML 코드입니다 차근차근 알아보도록 하겠습니다

4, 5번째 줄은 id와 pw의 텍스트필드 이고 6번째 줄은 쿼리전송의 submit 버튼이며 사용자가 버튼을 클릭하게 되면 사용자가 입력한 데이터를 3번째줄의 있는 action부분의 URL를 지정하여 정보를 보내는곳을 지정하게 됩니다

위 출력내용은 id  / pw 를 입력할수 있는 텍스트필드가 있고 입력된 정보를 서버로 전송하기 위한 버튼이 있습니다

정보를 입력하고 쿼리전송을 클릭해보겠습니다

출력내용을 보시면 폼에서 입력한 정보로 URL이 변경된것을 확인하실수 있습니다

이번에는 URL를 부분을 자세히 알아보도록 하겠습니다

1. 주소와 값의 구분자

위 내용은 브라우저를 통한 접근 URL이며, server-talk.com/in_put/input.php 는 서버의 주소가되고 id=talk&pw=talk 은 입력데이터가 되게 됩니다 서버의 주소와 입력데이터는 ?(물음표)라는 구분자를 통해 나눠지게됩니다

2. 값의 구분자

위 URL를 보시면 id와 pw라는 2개의 값 있으며, 값과 값 사이는 & 가 구분자입니다

3. 값의 이름과 값 사이의 구분자

위 URL를 보시면 id(값의 이름)와 pw(값)가 있으며, 값의 이름과 값 사이는 = 가 구분자입니다

php 폴더의 php.ini 파일 편집

opcache.enable=1

1 = 켜져있음

0 = 꺼져잇음

1이면 php 가 같은시간동안 더 많은 웹페이지를 만들어낼수 있다.

하지만 php 파일 수정시 즉시 반영이 아닌 30초 ~ 1분 주기로 웹페이지에 반영되는 이슈.

개발시에는 0으로 놓아야 즉시 개발이 반영된다..

php 설치 폴더 안의 php.ini 파일 편집.

display_errors = off -> on 으로 변경하면 오류가 표시된다.

하지만 상용 서비스시에는 off 로 해야함

개인정보등의 오류 내용이 client 에 노출될 가능성있기때문에..

Atom Text Editor (아톰 텍스트 편집기) 설치 및 설정 편입니다.

웹 개발을 하고 싶어서 HTML과 CSS를 공부하기 시작했는데 코드들을 간편하고 빠르게 작성하기 위해 텍스트 에디터 (문서 편집기) 들을 둘러보던 중 Atom Text Editor가 눈에 띄었습니다. 아톰 에디터를 사용해보았는데요, 편리한 기능들을 제공하고 심플하면서 디자인도 좋은 에디터인 것 같았습니다. 지금부터 아톰 에디터 (이하 아톰) 설치 및 설정 방법을 알려드리겠습니다. 

[Atom 소개]

아톰은 편리한 텍스트 작성을 위해 Github에서 만든 프로그램입니다. 아톰 홈페이지의 소개를 보면 

"Atom is a text editor that's modern, approachable, yet hackable to the core-a tool you can customize to do anything but also use productively without ever touching a config file." 

(출처: atom.io 메인 페이지) 

이라고 되어있습니다. 현대적이고 사용하기 쉽고 동시에 원하는 데로 조작할 수 있는 강력한 에디터입니다. 아톰의 장점들을 꼽아보자면, 무료로 사용할 수 있고, 심플하고 직관적인 UI와 다양한 패키지들이 있습니다. 아톰은 가볍지만 다양한 플러그인/패키지들을 제공하기 때문에 강력하고 효과적인 툴로 사용하실 수 있습니다. 또한, HTML, CSS, JavaScript 같은 웹 기반 언어로 구현이 되었기 때문에 이런 웹 기술들을 배우면서 직접 원하는 것들을 쉽게 수정할 수 있습니다. 

[Atom 설치]

먼저 아톰 홈페이지 https://atom.io/로 들어가세요

▲ 이렇게 홈 화면이 뜹니다. 빨간색 버튼으로 되어있는 Download Windows Installer를 눌러주세요. 그러면 AtomSetup.exe 파일을 다운로드 받게 됩니다. 실행시켜서 아톰을 설치해주세요. 

▲ 이런 화면이 뜨면서 자동으로 설치가 완료됩니다.

[Atom 설정]

▲ Atom을 실행하시면 이렇게 시작화면이 뜹니다. 바로 Choose a Theme (테마 고르기)나 File ▶ Setting ▶ Themes 로 가시면 아톰의 테마를 변경하실 수 있습니다. UI Theme과 Syntax Theme에서 원하시는 테마를 조합하시면 됩니다. 마음에 드는 테마가 없으면 Setting ▶ Install 로 가셔서 패키지 검색 창 옆에 있는 Themes 를 누른 다음에 인기 있는 테마를 다운로드 받으시거나 직접 검색하셔서 찾으시면 됩니다. 

▲ Setting ▶ Packages 로 가면 설치되어있는 패키지들을 확인하실 수 있고 설정을 바꾸고 필요 없는 기능들은 비활성화시키거나 삭제시키실 수 있습니다. Setting ▶ Install 로 가셔서 검색 창 옆에 Packages를 누르시면 인기 있는 패키지들을 다운로드 받을 수 있고 원하는 패키지를 검색하셔서 설치할 수 있습니다.

[추천 패키지]

아톰을 처음 설치하시면 기본 패키지들과 함께 설 됩니다. Ctrl + \(역슬래쉬 키) 를 누르면 왼쪽에 디텍터리 구조를 볼 수 있게 해주는 창도 기본적으로 설치 되어있는 tree-view 패키지입니다. 이렇듯 패키지들을 설치하시면 가벼운 아톰 에디터를 강력한 툴로 변하게 할 수 있습니다. 그중에서 인기 있고 아주 간편한 패키지 몇 개를 소개해 드립니다.

• Emmet: 웹 개발을 위한 강력한 툴인데요, 간편한 자동완성은 물론이고 수식을 조합해서 반복적으로 입력해야 하는 코드를 한 줄로 완성 시킬 수 있습니다. http://docs.emmet.io/로 가시면 Emmet에 대한 사용법이 자세히 나와 있습니다. ▼

• Minimap: 코드가 아주 길어질수록 줄이 많아집니다. 이런 경우 어느 위치에서 코딩하는 지 알기 쉽지 않은데 Minimap을 설치하시면 오른쪽에 코드들이 아주 작게 적혀있고 해당 위치가 표시돼서 마치 코드들의 지도를 보는 것처럼 사용할 수 있습니다. ▼

• Linter: 코드를 작성하다 보면 오타들이나 문법적 오류들이 생기는 데요, 이런 실수를 할 때마다 Linter 패키지가 오류가 있는 부분을 가리키고 어떤 문제가 있는지 알려줍니다. Linter 패키지를 설치한 후 원하시는 프로그래밍 언어에 해당하는 패키지를 추가로 설치하시면 됩니다. (예: Linter-htmlhint) ▼

출처: http://plainthought.tistory.com/10 [PLAIN THOUGHT]