영삼이의 전문 정보 발행처

CSS에서는 변수를 사용할 수 없습니다.

그래서 같은 코드를 여러번 입력해야 하는 불편이 있습니다.

이러한 단점을 보완해주는 것이 Less입니다.

변수와 여러 함수를 이용하여 CSS 코드를 만들 수 있습니다.

Less 문법으로 코드를 짠 후 컴파일을 하면 CSS 파일로 변환됩니다.

따라서 컴파일이 가능하도록 프로그램을 설치해야 합니다.

Ubuntu를 사용하고 있다면, 단 한줄의 코드로 관련 프로그램을 설치할 수 있습니다.

apt-get install node-less

설치를 했다면 테스트를 해봐야겠죠. 다음의 내용으로 style.less 파일을 만듭니다.

@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;
#header {
  color: @light-blue;
}

다음과 같이 명령합니다.

lessc style.less > style.css

style.less가 있는 폴더에 style.css가 만들어집니다. 내용은 다음과 같습니다.

#header {
  color: #6c94be;
}

CSS 코딩을 할 때 변수를 사용하거나 함수를 이용할 수 있다는 것은 상당히 매력적입니다. 하지만, 공부할 거리가 더 생기는군요.

프로그래머는 계속 새로운 기술이 나와서 평생 지루하지 않은(?) 직업 같습니다.

OS X의 웹 공유 기능은 OS X의 다른 기능들에 비해 비교적 까다로운 설정이 요구되기 때문에 OS X을 막 접하신 분들보다 고급 유저들이 주로 활용하는 기능으로 여겨져 왔습니다. 그러다 최근 들어 웹 공유 기능을 이용한 아이폰/아이패드 어플(예: 코믹글라스 등)이 많이 개발되었고, 이외 웹 공유 기능을 활용하는 다양한 방법들이 소개되어 이전에 비해 웹 공유 기능의 진입 장벽이 많이 낮아지고 있는 것 같습니다.

OS X 마운틴 라이언에도 기존 OS X 시리즈에 늘상 포함되어 온 아파치 웹 서버 (Apache HTTP Server)가 기본적으로 포함되어 있습니다. 따라서 웹 공유 기능을 사용하기 위해 굳이 다른 웹 프로그램을 추가로 설치하거나, OS X을 서버 버전으로 업그레이드 할 필요는 없습니다.

하지만 OS X 라이언까지만 해도 시스템 환경설정의 공유 메뉴에서 웹 공유 기능을 켜고 끌 수 있었지만, OS X 마운틴 라이언부터는 더 이상 GUI를 제공하지 않고 오로지 터미널 명령어를 이용해 웹서버를 껴고 끌 수 있게 되었습니다. 

↑ OS X 라이언의 공유 설정. 웹 공유 옵션이 있음

↑ OS X 마운틴 라이언의 공유 설정. 웹 공유 옵션 없음. 그러고 보니 없어진게 한두개가 아님

간편하게 웹 공유 기능에 접근할 수 있었던 옵션이 마운틴 라이언에서 누락된 것은 아무래도 OS X 일반 버전과 서버 버전과 차별화 하려는 마케팅상의 이유가 아닌가 추측됩니다만 최근 OS X의 개발 방향을 보건데 이런 고급 기능이 완전히 제거되지 않은 것을 그나마 다행으로 생각해야 할지도 모르겠습니다. 

아무쪼록 초보자분들도 웹 서버를 쉽게 사용하실 수 있도록 최대한 자세하게 사용 방법을 정리해 보았습니다.

OS X 마운틴 라이언 웹 공유 기능을 설정하고 테스트하기

1. 웹 공유 활성화 하기

기본적으로 OS X 마운틴 라이언의 웹 공유 기능을 켜고 끌 때 아래와 같은 터미널 명령어가 사용됩니다.

웹 공유 켜기:

sudo apachectl start

웹 공유 끄기:

sudo apachectl stop

웹 공유 재시작하기:

sudo apachectl restart

* 터미널을 이용해 웹 공유를 켜거나 끄는 것이 어렵게 느껴지시는 분들은 여기서 배포하고 있는 preferencePane 방식의 프로그램을 이용해 웹 공유를 아주 쉽게 켜고 끄실 수 있습니다.

2. 공유 폴더 생성

일단 웹 공유를 시작 하기 전에 공유할 폴더를 생성해야 합니다.사용자 홈폴더에 'Sites' 폴더를 새로 만들어 줍니다. 

* 한가지 특이한 점은 이렇게 사용자가 임의로 만든 폴더임에도 불구하고 OS X 라이언에서 보던 나침반 문양이 폴더 안에 고스란히 나타나고 있습니다. 즉, 사용자가 Sites 폴더를 만들 것을 애플이 애초에 대비하고 있었거나, 라이언의 잔재가 마운틴 라이언에 고스란히 남아 있다고 볼 수 있습니다.

3. 웹 공유 작동 확인

터미널에서 아래 명령어를 입력하거나, 

sudo apachectl start

별도로 설치한 웹 공유(Web Sharing) prefPane에서 스위치를 ON으로 놓아 웹 공유를 시작합니다. 

그리고 사파리나 다른 웹 브라우저를 실행해 http://127.0.0.1 를 주소창에 넣었을 때, It works! 라는 텍스트가 나타나면 시스템 상에서 웹 서버를 작동하는데 아무런 문제가 없다는 것을 의미합니다. 

4. 웹 공유를 위한 계정 프로필 만들기

이제 앞서 만들어준 공유 폴더를 웹 서버 기본 폴더로 만들어 주는 작업이 필요합니다.

일단 사용자계정명을 알아야 합니다.

↑ 시스템 환경 설정 > 사용자 및 그룹에 들어가 1) 자물쇠를 풀고 2) 현재 사용자를 우클릭해 고급옵션으로 들어갑니다.

↑ 사용자계정명을 확인 합니다.

그리고 응용 프로그램/유틸리티 폴더에 있는 터미널 프로그램을 실행한 후 아래 명령어를 차례대로 입력해 줍니다.

sudo su -

cd /etc/apache2/users

cp Guest.conf 사용자계정명.conf

sudo nano 사용자계정명.conf

아래와 같이 Geust 폴더 경로를 사용자계정명으로 변경해 줍니다.

control + O를 눌러 작업 내역을 저장하신 후, contrl + X 단축키로 에디터를 빠져 나옵니다.

5. 웹서버 재가동

변경 내역을 적용하기 위해 웹 공유를 재시작합니다. 터미널에 아래 명령어를 입력하거나

apachectl restart 

앞서 설치한 웹 공유(Web Sharing) prefPane를 열고 서버 작동 스위치를 OFF로 놓았다 다시 ON으로 전환합니다.

6. index.html 파일을 생성해 웹 공유 기능 테스트

아래 제가 임의로 만든 index.zip 파일을 내려받은 후 압축을 풀면 index.html과 images 폴더가 나오는데 이 둘을 앞서 만들어준 Sites 폴더로 이동시킵니다. (혹은 직접 index.html 파일을 만드셔도 됩니다.) 

 index.zip

↑ Sites 폴더 위 두 파일이 잘 들어갔는지 확인

7. 최종 확인

마지막으로 사파리나 기타 웹 브라우저에서 아래 주소를 입력합니다.

http://127.0.0.1/~사용자계정명/

위 이미지처럼 나오면 성공입니다! 

이후부터는 애초 OS X의 웹 공유 기능이 필요했던 목적을 달성하시면 되겠습니다. ^^

기본적으로 Mac OS X에는 Subversion 프로그램이 있다.

1.터미널에서 SVN 서버와 클라이언트 버젼을 확인해 보자

디렉토리 생성

프로젝트 Import 

프로젝트 export

FTP 서버


설치 ::

1. 우분투에서는 vsftp라는 패키지를 설치하면 간단하게 외부에서도 FTP로 접속할 수 있다.
$ sudo apt-get install vsftpd


2. 설치가 끝나면 환경설정을 해줘야한다. vsftpd.conf 파일을 열어 설정사항을 수정한다.
$ sudo vi /etc/vsftpd.conf


3. 아래 항목을 찾아 주석을 제거하고 아래와 같이 옵션을 수정한다.

기본적으로 Mac OS X에는 Subversion 프로그램이 있다.

1.터미널에서 SVN 서버와 클라이언트 버젼을 확인해 보자

디렉토리 생성

프로젝트 Import 

프로젝트 export

[프로그램 소개]

1. 프로그램명 : XAMPP

2. 홈페이지 : http://www.apachefriends.org/en/xampp.html

3. 다운로드 : http://sourceforge.net/projects/xampp/files/

4. 개요

XAMPP is an easy to install Apache distribution containing MySQL, PHP and Perl.

간단히 설치하고 간단히 제거할 수 있는 아파치 웹서버이다.

*실행 : 압축 풀고 설정하고 서버 시작

*삭제 : 맘에 안들면 서버중지 후 프로그램 폴더 삭제.

*다른 버전 설치 : 압축 풀고 설정하고 서버 시작

결국 (설치 = 압축풀기)로 끝나는 웹서버이다.

윈도우, 리눅스, 맥 OS-X, 솔라리스 등 각종 OS에 맞게 포팅이 되어 있으며,

MySQL, PHP & PEAR, FTP Server 등 개발에 필요한 거의 모든  모듈이 포함되어 있다.

5. 사족

리눅스서버에서 윈도우서버로 마이그레이션하는 작업이 상당히 까다롭다는 것을 실감하게 되었다.

앞의 글에서도 밝혔듯이 큰 에러가 아닌 미묘하게 살짝 다른 부분들 때문에..

링크 :

정리하자면,

가. PHP3~4버전과 PHP5버전의 함수 및 변수처리의 미묘한 차이 (RESISTER_GLOBALS 등..)

나. MySQL의 기본 언어설정(euc_kr과 UTF-8)에 따른 DB이전문제

다. 웹서버의 권한 설정의 차이 (리눅스 APACHE 와 윈도우 IIS7)

라. 리눅스 전용으로 프로그래밍된 웹 프로그램들..

마. 방화벽 설정 - 서버단에서의 방화벽 및 서버내의 방화벽 설정

바. 기타.. 본인의 리눅스 및 윈도우 서버의 적응문제 등

사. 웹브라우저간 크로스브라우징 및 IE6 등 IE간 호환성 체크

6. 용도

- 리눅스용 웹서버 (카페24-리눅스 가상호스팅에서 실제 서비스 중..)

- 윈도우용 개발용 로컬 웹서버

- (윈도우용 서버는 IIS7+PHP+MySQL로 세팅 - 스마일서브에서 실제 서비스 중..)

7. 설정

* 수정문서명 및 위치

가. 윈도우

D:\xampplite\apache\conf\httpd.conf                // 기본 설정

D:\xampplite\apache\conf\extra\httpd-xampp.conf    // PHP관련 설정

D:\xampplite\apache\conf\extra\httpd-vhosts.conf   // 가상 호스트 설정

나. 리눅스

/opt/lampp/etc/httpd.conf

/opt/lampp/etc/extra/httpd-xampp.conf

/opt/lampp/etc/extra/httpd-vhosts.conf

* 설정 변경

[httpd.conf]

1. 서버 위치 설정

# 윈도우 기본설정 - 개발용으로 "xampp Lite"버전을 설치합

ServerRoot "/xampplite/apache"

# 리눅스의 경우

ServerRoot "/opt/lampp"

2. 포트 설정

# 유동IP등의 상황으로 80포트가 막혀 있을 경우 변경 해야함

Listen 80

3. 서버정보 설정

# 에러메세지 등에서 나타날 관리자의 메일주소

ServerAdmin admin@localhost

# 기본 서버이름 - 여러 상황에서 변경해야 할 수도 있음

ServerName localhost:80

4. 가상서버를 운용할 경우 문서(홈페이지)의 루트 설정)

# 기본설정은 윈도우/리눅스 모두 바꾸어야 함.

# 기본설정 DocumentRoot "/xampplite/htdocs"

DocumentRoot "/home"

# 윈도우의 경우 xampp 설치폴더와 홈페이지 루트폴더의 드라이브가 다른경우

DocumentRoot "e:/home"

5. 디렉토리 권한설정

# DocumentRoot을 바꾸었을 경우 필히 아래 디렉토리의 권한설정을 바꾸어야 한다.

# 추가항목

#  "LimitRequestBody 제한크기" 업로드 파일크기제한을 위해 추가

# 크기 예시 : 1MB=1048576 / 10MB=10485760 / 100MB=104857600 / 1GB=1073741824

#             200MB=209715200 / 500MB=524288000 [ 2GB-1=2147483647]

# 계산 공식 : 1024*1024 = 1메가 / 1024*1024*20 = 20메가 / 1024*1024*1024=1기가

# 기본설정 <Directory "/xampplite/htdocs"> 을 <Directory "/home">로 변경

<Directory "/home">

    Options Indexes FollowSymLinks Includes ExecCGI

    AllowOverride All

    Order allow,deny

    Allow from all

    LimitRequestBody 104857600

</Directory>

6. 기본문서명 지정

# domain.com/ 으로 접속할 경우 기본으로 보여지는 문서파일명

# index.php가 없을 경우 index.php4.... 왼쪽에서 오른쪽으로

# 경험상 "index.php"의 확장자가 제일 먼저 오는 것이 개발에 좋다.

<IfModule dir_module>

    DirectoryIndex index.php index.html index.htm index.php4 index.php3 index.cgi index.pl index.shtml index.phtml

</IfModule>

7. 로그파일 작성 조건 설정 (기본설정으로는 로그파일이 엄청나게 커진다.)

LogLevel crit // 치명적인 에러만 기록

8. HTML파일에서 PHP 사용을 위한 설정

[extra/httpd-xampp.conf]

#  .html .htm 추가 // html 파일에서 php 사용

AddType text/html .php .phps .php5 .php4 .php3 .phtml .phpt .html .htm

# |\.html$|\.htm$ // html, htm 추가

<FilesMatch "\.php$|\.php5$|\.php4$|\.php3$|\.phtml$|\.phpt$|\.html$|\.htm$">

  SetHandler application/x-httpd-php

</FilesMatch>

9. Virtual HOST 설정

링크 : [팁][리눅스] 네임서버 없이 IP로만 가상호스팅(Virtualhost) 설정시 주의점

10. PHP 설정은 다음 포스트에..