1. 워드프레스의 테마나 플러그인을 설치 또는 업그레이드할 때, 워드프레스가 설치된 서버에 FTP 또는 FTPS 접속이 가능하다면, 워드프레스는 브라우저상에서 바로 설치나 업그레이드가 가능하도록 하는 기능을 제공한다. 그러나 기본적으로 SFTP 접속은 지원되지 않기 때문에 이 프로토콜을 이용하려면 별도의 플러그인을 설치해야 한다. 이를 설치하기 위해 워드프레스 플러그인 주소(https://wordpress.org/plugins/)로 접속한 후 검색창에 ‘SFTP’를 입력하여 검색한다. 2. 검색결과에서 ‘SSH SFTP Updater Support’ 항목을… Read More »
NetBeans는 Oracle(과거 SUN Microsystems)에서 만든 Eclipse와 유사한 Java 기반의 통합개발환경(IDE)으로 Java는 물론 C/C++, HTML, PHP 등 많은 언어를 지원한다. 따라서 HTML과 PHP 프로젝트에 Netbeans를 이용하면 IDE의 장점을 충분히 활용하여 개발의 효율성을 극대화할 수 있다. 이 글은 NetBeans의 Remote Web Site(FTP, SFTP) 기능을 활용하여 원격 서버에서 직접 PHP/HTML 파일을 업로드하고 실행할 수 있도록 프로젝트를 구성하는 방법에 대해… Read More »
[목적] 홈페이지에 <a> 태그를 이용하여 하이퍼링크를 거는 방법을 익힌다. [이론] 다른 페이지로 이동을 위한 하이퍼링크는 <a> 태그를 사용하며 그 형식은 다음과 같다. <a href=”경로/파일명”>문자열</a> <a href=”프로토콜://서버이름/경로/파일명”>문자열</a> 위 형식에서 문자열은 브라우저상에 표시되는 내용으로 이 내용을 클릭하면 ‘<a>’ 태그의 ‘href’ 속성에 정의된 페이지로 이동한다. 첫 번째 형식은 현재 페이지와 동일한 서버에 존재하는 페이지로 이동할 경우 주로 사용하며,… Read More »
[목적] 브라우저에 ‘&’를 출력하는 방법을 배운다. [이론] 위 그림과 같은 결과를 얻기 위해 아래 코드를 입력한다. <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″/> <title>홈페이지</title> </head> <body> <<br/> ><br/> </body> </html> 그러면 이전 글에서 다루것과 같이 ‘<’, ‘>’는 각각 ‘<‘, ‘>’을 출력하므로 아래 그림의 결과가 출력된다. 올바른 결과를 위해서는 ‘&’ 출력을 위한 ‘&’를 응용하여HTML 코드에 ‘lt’와… Read More »
[목적] 브라우저에서 HTML 태그를 출력하는 방법을 배운다. [이론] <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″/> <title>홈페이지</title> </head> <body> <html><br/> <head><br/> <body><br/> </body> </html> 위 그림의 내용을 출력하기 위해 위와 같이 HTML 코드를 작성하면 브라우저는 ‘<‘ ~ ‘>’ 사이의 내용도 하나의 태그로 인식하므로 아래 그림과 같이 아무 것도 출력하지 않는다. 모든 HTML 태그는 ‘<‘과 ‘>’으로… Read More »
[목적] 브라우저에서 연속된 두 개 이상의 공백 출력하는 방법을 배운다. [이론] 이전 실습 ‘줄 바꾸기‘의 과제를 살펴보면 출력 결과가 위와 같으므로 ‘<body>’ ~ ‘</body>’ 태그 사이의 단어에 여러개의 공백을 삽입하여 다음과 같은 HTML 코드를 생각했을 것이다. <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″/> <title>홈페이지</title> </head> <body> 안산대학교 인터넷정보과 홈페이지제작 </body> </html> 그러나 위와 같이… Read More »
[목적] 브라우저에서 여러 줄에 걸쳐 문자열을 출력하는 방법을 배운다. [이론] 이전 실습 ‘한글 인코딩‘의 과제를 살펴보면 출력 결과가 위와 같으므로 ‘<body>’ ~ ‘</body>’ 태그 사이를 아래와 같이 작성한 HTML 코드를 생각할 수 있다. <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″/> <title>홈페이지</title> </head> <body> 안산대학교 인터넷정보과 홈페이지제작 </body> </html> 그러나 위와 같이 작성해 브라우저로 확인한다면… Read More »
[목적] 홈페이지에 한글을 사용할 경우 인코딩과 관련된 주의사항을 살펴본다. [이론] 이전 실습 ‘HTML 기본 구조‘에서 주어진 과제의 답은 아래와 같다. <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″/> <title>홈페이지</title> </head> <body> HTML5로 홈페이지를 만들자. </body> </html> 그러나 Windows 환경에서 Eclipse, Netbeans, Dreamweaver 등과 같은 전용 개발환경이 아닌 메모장과 같은 간단한 편집기를 이용해 작성한 경우라면 많은… Read More »
[목적] HTML의 기본 구조에 대해 배운다. [이론] 일반적으로 홈페이지는 MSIE, FireFox, Chrome 등과 같은 브라우저를 통해 접속한다. 이 때 브라우저는 서버로 부터 HTML(Hyper Text Markup Language) 형식의 홈페이지 문서를 렌더링(해석)하여 사용자에게 보여준다. 따라서 홈페이지 작성의 가장 기본은 HTML이다. 이 글에서는 HTML의 기본형식에 대해 살펴보겠다. [HTML의 기본 형식] HTML은 태그(Tag)로 구성된 스크립트 언어다. 그러므로 HTML을 공부할… Read More »
[목적] 서버에 이미 저장된 html 파일을 EditPlus로 불러오는 방법을 배운다. [실습] 1. 앞의 실습에서 작성 서버에 저장된 ‘exam-01-01.html’ 파일을 EditPlus로 불러오기 위해 ‘파일’ 메뉴에서 ‘FTP’의 ‘원격 열기’ 항목을 클릭한다. 2. ‘원격 파일 열기’ 창이 뜨면 ‘계정’ 항목을 자신의 것으로 선택한 후 ‘표시’ 버튼을 클릭한다. 3. ‘Password’ 창이 뜨면 자신의 비밀번호를 입력하고 ‘확인’ 버튼을 클릭한다. 이… Read More »