Web
[웹 서비스 개발] Xampp 환경에서 AJAX 경험하기
지금까지 Xampp 환경을 세팅하고 Apache와 MySQL을 실행하여 페이지에 접근하고, phpmyadmin에 접근하는 과정까지 알아봤습니다. 이제 앞으로의 실습 동안 Xampp에 설치된 Apache에 xml, html, css, xsl 등의 파일을 넣고 해당 파일에 엑세스하는 실습을 진행할 것입니다. 그를 위해서는 가장 먼저 Xampp 저장공간, 자세히 말하면 Apache가 할당받은 저장 공간에 접근하는 과정을 알아야 합니다. 가장 기본적으로 알아야하는 부분이기 때문에 이 방법에 대해서 먼저 알아보도록 하겠습니다. 이 글은 Mac OS 상에서 Xampp -vm 버전으로 설치했음을 가정하고 진행합니다. m1 프로세서를 사용하셔서 -installer 버전을 설치하시거나 Windows 환경에서 사용하시는 ..
jQuery - AJAX
이전에 JavaScript를 공부하면서 AJAX에 대해서 공부한바 있습니다. 쉽게 기억하시겠지만 JavaScript를 사용하여 AJAX를 구현하는 코드가 그렇게 깔끔하지만은 않았습니다. 또한 각 웹 브라우져마다 AJAX를 구현하는 코드에 차이가 있어 브라우져의 종류에 따라서 조금씩 다른 코드가 나오기도 하고, 나름 복잡하고 꽤 긴라인의 코드를 작성해야 AJAX를 구현할 수 있었습니다. 그런데 마찬가지로 이 jQuery를 사용함으로서 AJAX를 구현하기 위한 코드를 미리 구현된 method를 사용함으로써 훨신 간단한 코드로 작성하는 것이 가능합니다. jQuery에서 AJAX를 위해 지원하는 대표적인 method는 다음과 같습니다. 1. load() 2. get() 3. post() load() load m..
jQuery - Traversing
jQuery Traversing은 다른 element와의 관계에 따라서 html element를 찾거나 선택하는 데 사용 됩니다. 여기서 사용되는 "Traversing"이라는 용어가 우리말로 "탐색"이라는 점을 생각해보면 해당 개념이 어디에 사용되는 지 쉽게 기억할 수 있을 것입니다. 즉, jQuery Traversing을 사용하면 현재 선택된 html element를 기준으로 마음대로 상위, 하위 요소로 그 선택상태를 쉽게 이동할 수 있다는 장점이 있으며, 이는 jQuery를 이용한 web page 작성 시 굉장히 유의미한 강력한 기능으로서 사용될 수 있습니다. Traversing에서 중요한 것은 각 html element들이 서로 어떤 관계를 가지는 지 정확하게 파악하는 것이 중요합니다. 아래와 같은..
jQuery - HTML
jQuery에는 HTML element 및 attribute를 변경하고 조작할 수 있는 강력한 기능들을 지원합니다. jQuery Dom 조작 jQuery의 매우 중요한 부분 중 하나는 DOM을 조작할 수 있다는 점입니다. jQuery에는 html element 및 attribute에 쉽게 접근하고 조작할 수 있는 다양한 DOM 관련 method가 제공됩니다. HTML element로 부터 값을 읽어오기 DOM 조작을 위해서 필요한 세가지 JQuery 메소드의 종류와 그 역할은 다음과 같습니다. 메소드(Method) 내용 text() 선택된 element의 텍스트 내용을 설정하거나 반환 html() 선택한 element의 내용을 설정하거나 반환(HTML 마크업 포함) val() form field의 값을 ..
jQuery - Effect
효과(Effect) jQuery는 Hide, Show, Toggle, Slide, Fade, and Animate와 같은 다양한 Effect를 지원합니다. 이는 JavaScript에 비해서 훨씬 간편하게 다양한 Effect 들을 제어할 수 있습니다. jQuery를 통해서 사용할 수 있는 효과들과 그 내용들을 다음과 같습니다. 메소드(Method) 효과(Effect) show() 해당 html 요소를 표시함 hide() 해당 html 요소를 숨김 show(speed, callback) speed - html요소가 나타나는 속도를 지정 (밀리초 단위를 사용하며 값이 클수록 효과가 진행되는 속도가 느려짐) (slow, fast를 사용하여 지정하는 것도 가능함) callback - 요소를 표시하고 나서 실행할 ..
jQuery - 개요
jQuery 개발자들은 항상 개발의 효율성을 극대화하기 위해서 항상 다음과 같은 내용들을 고민했습니다. 1. 어떻게 하면 코드의 가독성을 최대화 할 수 있도록, 코드를 깔끔하게 작성 할 수 있을까? 2. 어떻게 하면 코드를 재사용 할 수 있을까? 코드를 깔끔하고 단순할수록 코드의 가독성이 올라가고, 코드를 재사용할 수 있을수록 코드를 작성하는 데 들이는 시간이 절약되기 때문에 위의 고민들은 개발을 함에 있어서 굉장히 중요한 이슈이기도 합니다. 그래서 이전에 공부한 javascript에 대한 위의 고민을 해결한 것 중 하나가 바로 jQuery 입니다. jQuery는 자바스크립트의 라이브러리로서 오픈소스로 되어있고 배우기 굉장히 쉽다는 장점이 있습니다. 그리고 무엇보다도 자바스크립트에 비해서 코드가 굉장히 ..
라즈베리파이 - Wordpress Theme 설정 및 사용자화
테마설정 및 페이지 사용자화는 이전에 CMS 관련 실습에서 Batflat으로 어느정도 경험했었습니다. 하지만 Wordpress의 경우 전세계에서 가장 대표적으로 쓰이는 CMS인 만큼 가지고 있는 테마, 이와 관련된 사용자화 옵션이 굉장히 많습니다. 이번 실습에서는 Wordpress의 테마를 설정해보고 페이지를 사용자화하는 실습을 진행하도록 하겠습니다. 실습상황은 이전 글 Wordpress 설치 후부터 이어집니다. wordpress의 테마를 변경하고 설정하기 위해서는 몇가지 작업이 필요합니다. 테마 변경을 위해서는 테마를 다운로드하고 모듈을 설치해야하는데 이를 위해서는 Wordpress 관리를 위한 디렉토리 권한을 변경해줘야 합니다. 사실 해당 과정은 ftp / sftp 연결이 가능하다면 해당 과..
라즈베리파이 - Wordpress 설치 및 세팅
이번에는 라즈베리파이 서버에 "wordpress" CMS를 설치해서 웹서비스를 진행하는 실습을 진행하도록 하겠습니다. 이전에 CMS관련 실습을 진행하면서 wordpress에 대해서 언급했던 적이 있습니다. wordpress는 전세계에서 가장 대표적인 CMS로서 LAMP또는 LEMP에서 동작합니다. 여기서 말하는 LAMP, LEMP의 의미는 다음과 같습니다. LAMP = Linux + Apache + MySQL + PHP LEMP(=LNMP) = Linux + Nginx + MariaDB + PHP 다음과 같이 CMS가 동작하는 환경에 대한 내용입니다. 현재 우리가 실습을 진행하는 환경은 LEMP에 해당하는 환경이므로 별다른 추가적인 세팅이 필요없이 wordpress를 설치하여 사용할 수 있습니다. 이..