작성일 댓글 남기기

만들면서 배우는 CodeIgniter 프레임워크 : PHP로 데스크톱과 모바일 웹을 한 번에 제작하는 초고속 개발 전략

PHP 대표 웹 프레임워크인 CodeIgniter를 기반으로 HTML5 웹 사이트와 모바일 웹 사이트를

동시에 개발하는 방법을 제시한다. 운영체제별 환경 구축, 할 일 관리, Todo 서비스 만들기,

단계별로 완성하는 게시판 프로젝트, 입력 폼 검증, SQL 삽입공격, XSS, CSRF 해킹에

대응하는 보안 기능, 사용자 인증, Ajax와 jQuery로 댓글 기능 구현하기,

사진 SNS 프로젝트로 배우는 트렌드 웹, jQuery Mobile로 만드는 모바일 웹 등을 다룬다.

사용자 삽입 이미지

작성일 댓글 남기기

[한빛미디어] 만들면서 배우는 CodeIgniter 프레임워크

작년 4월 한빛미디어 한동훈과장님과 첫 연락 후 1년 4개월만에 책이 나왔습니다.

오늘(16일)부터 한빛미디어 사이트에서 예약판매 시작을 했습니다.

http://www.hanb.co.kr/book/look.html?isbn=978-89-6848-026-3

만들면서 배우는 CodeIgniter 프레임워크

작성일 댓글 남기기

위지윅에디터 ckeditor 사용하기(CodeIgniter에 적용하기)

http://codeigniter-kr.org codeigniter 한국사용자포럼에 정리해서 올렸던 내용을 제 블로그로 꺼꾸로 가져옵니다.
ckeditor 3.X버전을 codeigniter에서 사용할 수 있도록 수정한 내용입니다.

원본 http://codeigniter-kr.org/source/view/322/page/1








fckeditor가 2.X대 버전으로 끝나고 3.X버전으로 오면서 ckeditor로 바뀌면서
상당히 많은 변화가 있었네요.
기능들을 코어와 플러그인으로 분리, 엄청난(?) 로딩속도 향상(http://hbuilder.kiissoft.com/admin/test), ajax 적용용이 등등..

파일, 이미지 업로드를 사용하기 위해서는(업로더가 2.X버전에서는 fckeditor안에 포함되어 있었음)
ckfinder도 같이 설치를 해야합니다.

ci forum에서 검색해보니 ckeditor용 헬퍼를 만들어놓은게 있어서 적용하여 사용중에 툴바선택할 수 있는
부분을 추가했습니다. (fckeditor는 라이브러리로 만들어 사용)

사용하기 위해서 ckeditor(http://ckeditor.com/download)와 ckfinder(http://ckfinder.com/download)(이미지 업로더를 따로 만든다면 필요가 없습니다)를 다운로드합니다.

1. 압축을 풀고 (저는 include 디렉토리 아래에 풀었습니다.)
   include – ckeditor
                 – ckfinder

2. 설정을 합니다.
 – ckeditor는 config.js 파일이 설정파일인데 헬퍼에서 설정을 해서 따로 설정할 것이 없습니다.
 – ckfinder는 config.php 파일을 수정해야 합니다.




 


01.function CheckAuthentication()

02.{

03.    return true;

04.}

05.//true로 수정

06.//권한체크용으로 만들어진 함수인데 수정하지 않으면 파일업로드가 안됩니다.

07.  

08.$baseUrl = ‘/data/upload’

09.//업로드된 파일이 저장될 디렉토리

10.//upload 디렉토리 하위에 파일형식에 따라서 이미지(images), 파일(files), 플래시(flash) 디렉토리가 자동생성됩니다.

11.//쓰기권한 필수

12.  

13.$config[‘ResourceType’][] = Array(

14.        ‘name’ => ‘Images’,

15.        ‘url’ => $baseUrl . ‘ck_images’,

16.        ‘directory’ => $baseDir . ‘ck_images’,

17.        ‘maxSize’ => ‘2M’,

18.        ‘allowedExtensions’ => ‘bmp,gif,jpeg,jpg,png’,

19.        ‘deniedExtensions’ => );

20.// maxSize가 처음에는 0으로 되어있는데 제한사이즈로 수정

21.// $config[‘ResourceType’][] 3군데 모두 수정

22.  

23.// 그외에는 각자 입맛(?)에 맞게 수정하시면 됩니다.
3. ckeditor_helper.php 파일을 생성합니다.(헬퍼 디렉토리)



 


01.<?php

02.if(!defined(‘BASEPATH’)) exit(‘No direct script access allowed’);

03.  

04.function form_ckeditor($data)

05.{

06.    //툴바 선택사용

07.    switch($data[‘toolbar’]){

08.        case (‘reply’):

09.        $tool_bar = ‘

10.            [

11.                [“Font”,“FontSize”], [“TextColor”,“BGColor”],

12.                [“Bold”,“Italic”,“Underline”],

13.                [“JustifyLeft”,“JustifyCenter”,“JustifyRight”,“JustifyBlock”],

14.                [“Link”,“Unlink”],

15.                [“Image”,“Flash”,“Table”,“HorizontalRule”,“Smiley”,“SpecialChar”],

16.                [“Preview”,“Source”,“Maximize”]

17.            ]

18.        ‘;

19.        break;

20.        case (‘basic’):

21.        $tool_bar = ‘

22.            [

23.                [“Source”,“-“,“Preview”],

24.                [“Bold”,“Italic”,“Underline”],

25.                [“Link”,“Unlink”]

26.            ]

27.        ‘;

28.        break;

29.        //디폴트는 FUll입니다.

30.        default:

31.        $tool_bar = ‘

32.            [

33.                [“Source”,“-“,“Save”,“NewPage”,“Preview”,“-“,“Templates”],

34.                [“Cut”,“Copy”,“Paste”,“PasteText”,“PasteFromWord”,“-“,“Print”, “SpellChecker”, “Scayt”],

35.                [“Undo”,“Redo”,“-“,“Find”,“Replace”,“-“,“SelectAll”,“RemoveFormat”],

36.                [“Form”, “Checkbox”, “Radio”, “TextField”, “Textarea”, “Select”, “Button”, “ImageButton”, “HiddenField”],

37.                “/”,

38.                [“Bold”,“Italic”,“Underline”,“Strike”,“-“,“Subscript”,“Superscript”],

39.                [“NumberedList”,“BulletedList”,“-“,“Outdent”,“Indent”,“Blockquote”],

40.                [“JustifyLeft”,“JustifyCenter”,“JustifyRight”,“JustifyBlock”],

41.                [“Link”,“Unlink”,“Anchor”],

42.                [“Image”,“Flash”,“Table”,“HorizontalRule”,“Smiley”,“SpecialChar”,“PageBreak”],

43.                “/”,

44.                [“Styles”,“Format”,“Font”,“FontSize”],

45.                [“TextColor”,“BGColor”],

46.                [“Maximize”, “ShowBlocks”,“-“,“About”]

47.            ]

48.        ‘;

49.        break;

50.    }

51.  

52.  

53.    $data[‘language’] = isset($data[‘language’]) ? $data[‘language’] : ‘ko’;

54.  

55.    $size    = isset($data[‘width’]) ? ‘width: “‘.$data[‘width’].‘”, ‘ : ;

56.    $size  .= isset($data[‘height’]) ? ‘height: “‘.$data[‘height’].‘”, ‘ : ;

57.  

58.    $options = ‘{‘.

59.            $size.

60.            ‘language: “‘.$data[‘language’].'”,

61.            //각종 설정값 (자세한내용은 ckeditor 레퍼런스참고)

62.            startupOutlineBlocks: false,

63.            entities: false,

64.            entities_latin: false,

65.            entities_greek: false,

66.            forcePasteAsPlainText: false,

67.  

68.//파일업로드 프로그램의 주소입니다.

69.//ckfinder의 주소를 적으면 됩니다. 

70.//사용자 업로더를 사용한다면 그 주소를 써주면 됩니다.            filebrowserUploadUrl : “/include/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files”,

71.            filebrowserImageUploadUrl : “/include/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images”,

72.            filebrowserFlashUploadUrl : “/include/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash”,

73.  

74.            toolbar : ‘.$tool_bar.’

75.  

76.        }’;

77.    //ckeditor 선언부

78.    return

79.    // fix: move to <HEAD…

80.    ‘<script type=”text/javascript” src=”‘.INCLUDE_DIR.‘/ckeditor/ckeditor.js”></script>’ .

81.  

82.    // put the CKEditor

83.     ‘<script type=”text/javascript”>CKEDITOR.replace(“‘.$data[‘id’].‘”, ‘ . $options . ‘);</script>’;

84.}

85.?>

4. 사용
– 컨트롤러



 


01.<?php

02.  

03.class Test extends Controller {

04.  

05.    function Test()

06.    {

07.        parent::Controller();

08.    }

09.  

10.    function index() {

11.        //헬퍼 선언

12.        $this->load->helper(‘ckeditor’);

13.        if (@$_POST[‘mode’] == ‘edit’) {

14.            $data[‘textarea_value’] = stripcslashes($_POST[‘textarea_id’]);

15.        } else {

16.            $data[‘textarea_value’] = ;

17.        }

18.        $this->load->view(‘admin/test’, $data);

19.    }

20.}

21.?>

– 뷰



 


01.<input onclick=“ExecuteCommand(‘image’);” type=“button” value=“파일업로드”/>

02.<form action=“” method=“post”>

03.<input type=“hidden” name=“mode” value=“edit” />

04.<!–

05.textarea name과 하단 form_ckeditor의 id변수 동일해야

06.textarea를 ckeditor로 대체해줍니다.

07.기존값이 있다면 <textarea></textarea>사이에 선언

08.–>

09.<textarea name=“textarea_id”><?=(@$textarea_value)?@$textarea_value:?></textarea>

10.<input type=“submit” value=“등록” />

11.</form>

12.<?

13.//툴바, textarea name, 에디터 폭, 에디터 높이

14.//툴바를 빈칸으로 하면 FULL 툴바가 나옵니다.

15.//현재 선언해놓은 것은 reply와 basic인데 입맛에 맞게 선언하여 사용하면 됩니다.

16.echo form_ckeditor(array(

17.    ‘toolbar’        => ‘reply’,

18.    ‘id’              => ‘textarea_id’,

19.    ‘width’           => ‘500’,

20.    ‘height’          => ‘300’

21.));

22.?>

23.<!–

24.툴바의 버튼을 외부로 뺄수도 있습니다. 

25.맨 윗라인의 이미지 업로더를 버튼을 에디터 외부에 위치시키는 팁입니다.

26.–>

27.<script>

28.function ExecuteCommand( commandName )

29.{

30.    // Get the editor instance that we want to interact with.

31.    var oEditor = CKEDITOR.instances.textarea_id ;

32.  

33.    // Check the active editing mode.

34.    if (oEditor.mode == ‘wysiwyg’ )

35.    {

36.        // Execute the command.

37.        oEditor.execCommand( commandName ) ;

38.    }

39.    else

40.        alert( ‘You must be on WYSIWYG mode!’ ) ;

41.}

42.</script>

5. 끝
위 내용 데모는 http://hbuilder.kiissoft.com/admin/test 에서 보실 수 있습니다.

작성일 댓글 남기기

controller를 model안에서 사용하기(혹은 불러오기?)

제목 붙이기가 좀 어렵네요
CI로 CMS를 개발하다보니 CI코어와 플러그인, 위젯, 레이아웃 등을 분리해야할 필요성이 생겼습니다.
그리고 플러그인의 특성상 자기 자신만으로도 웹에서 보일 수 있어야 해서 주소체계를 CI의 주소체계로 동일하게 사용해야 했습니다.(변수 전달도 포함)


application/
plugins/
widgets/
layouts/
system/

http://localhost/plugins/control/board/main    <- 이렇게 주소를 쓰는데 플러그인중 게시판(board)의 main.tpl.php(템플릿) 파일을 불러옵니다.
위 주소는 application/controllers/plugins.php 에 연결되어있고 그 내용은 다음과 같습니다.


function control (){
$this->load->model(PLUGPATH.’/’.$this->uri->segment(3).’/Functions’);
// $this->uri->segment(3)=> board 플러그인의 Functions.php 모델을 불러옵니다.
// 플러그인 규칙으로 모델은 Functions.php로 정합니다.
$data=$this->Functions->default_control(); // Functions 모델의 default_control 함수를 호출하는데 그 안에 컨트롤 파일이 들어있습니다.
$this->load->parser(PLUGPATH.’/’.$this->uri->segment(3).’/default/’.$this->uri->segment(4).’tpl.php’, $data);
}

plugins/board/Functions.php

function blist (){
  게시판 리스트 가져오는 함수
  return $query->result_array(); // result_array()-> CI의 DB함수
}
function default_control (){   
  $ll = $this->blist(‘test’); //게시판 리스트를 배열로 가져옵니다.
  return $ll;
}

└– default_control 부분이 핵심입니다. 컨트롤러에 있어야할 내용이 모델안에 함수로 정의되어 있습니다.
그리고 plusins라는 컨트롤에서 default_control 함수가 처리한 내용을 받아서
CI 템플릿 형태의 파일인 main.tpl.php로 보내줍니다.

위와 같은 작업을 함으로써 application 디렉토리 이외의 외부 디렉토리에서도 MVC 패턴(엄밀히 말하면 아니지만, 모델안에 컨트롤러가 구현되어 있으므로)을
그대로 구현할 수 있습니다. 특히나 다른 개발자가 만든 플러그인 같은 경우 정해진 규약대로만 만들면(Functions.php main.tpl.php 등)
CI의 주소체계를 이용하고 CI 내장함수도 그대로 이용을 할 수가 있습니다.

평상시 개발에서는 구현할 필요가 없지만 외부 개발자들이 만든 플러그인을 사용하는 구조라면 필요합니다.

이 내용을 올리는 가장 큰 목적은 CI의 유연성을 말하고 싶어서 입니다.
이번에 CI로 CMS 작업을 하면서 느낀 것은 CI의 확장성, 유연성입니다. 어느 정도 프레임워크로서의 틀을 가지고 있지만 그 틀을 넘나들 수 있는 유연성을 가지고 있다는 것.
다시 말해 개발자들이 어떻게 구현하느냐에 따라 정말 어떤 구조던지 가능하다는 것입니다.
프레임워크의 편리함(내장함수들의 편리함, 구조화, mvc패턴 등등)을 사용하면서 동시에 개발자의 재량에 따라 얼마든지 기존 구조이외에 것을 이용할 수 있다는 점이 큰 장점이라고 할 수 있겠습니다.