본문 바로가기
홍콩여행 1일째 보호되어 있는 글입니다. 더보기
PHP 디자인 패턴 MVC 사용방법 PHP에서 디자인 패턴 MVC 사용하 1. 개요 MVC 모델은 객체지향 설계방법이다. 각각의 컴포넌트에 대한 역할을 기능에 맞게 독립적으로 나눔으로써 차후에 최소 비용으로 유연하게 대처할 수 있도록 한다. C 나 JAVA와 같이 컴파일 방식으로 결과물을 만드는 프로그래밍 언어와 달리 PHP는 인터프리터 방식의 기계어로 변환되어 실행되기 때문에 속도저하가 있을 수 있다고 한다. 하지만 이 글의 목적은 PHP에서도 클래스를 사용할 수 있고, MVC패턴을 구현하는 방법을 알아보는데 있다. 2. 구현 //---- mvc.php 파일 더보기
하이브리드 앱 센차터치2.0 - XTemplate 화면구성 1. 개요 XTemplate는 복잡하고 반복적인 데이터 구조를 이용해서 화면 UI를 구성할 때 주로 많이 사용된다. XTemplate의 특징은 자체 연사작와 조건 처리 기능을 가지고 있다는 것이다. 템플릿에 반복문을 처리하기 위한 데이터를 지정하기 위해서는 JSON배열에게 key값을 부여해 주어야 한다. 2. 구성 - JSON 데이터 var someData = { array_key: [ {sub_key1: "value1", sub_key2: "value2"}, {sub_key1: "value1", sub_key2: "value2"} ] }; - 사용 예제 var stpl = new Ext.XTemplate( "", // root 노드 부터 접근 // for문 시작 "", "{sub_key1} - {sub.. 더보기
CSS3 - 해상도에 대응하는 분기처리 방법 1. 개요 모바일 시대가 도래하면서 다양한 디바이스와 브라우저에 대응할 수 있는 기술이 필요했다. 이러한 트랜드에 맞춰 CSS3에는 미디어쿼리를 지워하고 있는데, 사용자가 웹페이지에 접속했을 때 해상도와 같은 장치 특성을 해석해서 하나의 HTML 페이지가 여러 패턴의 CSS뷰를 갖도록 만들어 준다. 이렇게 되면 모든 장치의 해상도를 일일이 파악할 필요가 없다. 즉 새로운 장치가 나올 때 마다 서버 측 개발자가 해야 했던 일들을 이제는 클라이언트 개발자가 할 수 있게 된 것이다. 2. 구현 // CSS 코드 안쪽에 아래와 같이 미디어쿼리 구문 처리@media all and ( min-width:768px ) { /* 768px 이상 해상도에서 실행할 CSS 코드를 여기에 작성 */ } @media all .. 더보기
하이브리드 앱 센차터치 2.0 - 데이터 관리 : JsonP 객체 1. 개요 웹 어플리케이션에서 데이터를 요청할 때 주로 같은 도메인에 있는 파일을 호출한다. 그런데 상황에 따라서 도메인이 다르거나 서버가 다른 곳에 데이터를 요청해야 할 때가 있다. 이 때 주로 발생하는 문제가 바로 크로스 도메인 보안 문제이다. 센차터치에서는 이러한 보안 문제를 해결하기 위해 JsonP 객체를 지원한다. 특히 네이티브앱(하이브리드앱)에서 외부 데이터를 Json으로 받기 위해서 지원되는객체이다. 2. 구현 Ext.Loader.setConfig({enabled:true}); Ext.require("Ext.data.JsonP"); Ext.application({ name:"JsonP", launch:function(){ var eventHandler = function(btn,event){.. 더보기
하이브리드 앱 센차터치 2.0 - 데이터 관리 : Store 객체 1. 개요 웹앱은 네트워크의 영향을 많이 받기 때문에 속도에 민감할 수 밖에 없다. 그래서 서버에서 받은 데이터를 클라이언트 측에서 저장하고 관리해야 한다. 또한 웹앱에서 동일한 데이터를 서버에서 재요청하게 되면, 불필요한 트래픽이 발생하기 때문에 캐쉬에 저장되어 있는 데이터를 활용해야 하는데 'Ext.data.Store' 에서 그러한 메커니즘을 제공해 준다. 2. 구현 Ext.require("Ext.data.Store"); Ext.require("Ext.List"); Ext.application({ name:"MyStore", launch: function(){ // 모델에서 관리할 필드정의 Ext.define("User",{ extend: "Ext.data.Model" , config:{ fields.. 더보기
PHP에서 JSONP 출력하기 1. 개요 JSONP란 외부서버에 있는 정보를 자바스크립트로 통신하기 위한 기술이다. 일반적으로 웹상에서 다른 도메인간 통신을 할 때 크로스 도메인 보안 정책 제약 때문에 다른 도메인간 통신이 불가능 하지만 JSONP를 이용하면 통신이 가능하다. 2. 구현방법 //----- jsondata.php //----- output ({"users":[ {"no":"Brett","name":"김길동","image":"도메인주소/senchaTouch2/img/img1.jpg"}, {"no":"Jason","name":"Hunter","image":"도메인주소/senchaTouch2/img/img2.jpg"}, {"no":"Elliotte","name":"Harold","image":"도메인주소/senchaTouch.. 더보기
하이브리드 앱 센차터치 2.0 - Object의 xtype 속성 1. 개요 객체를 생성할 때 이미 정의된 객체타입을 "Ext.create()" 메서드를 이용하거나, new 연산자를 이용해서 만드는 방법을 제공하고 있는데, 센차터치에서는 {} 리터럴표기법에 xtype 속성을 이용해서 객체를 생성하는 방법도 제공하고 있다. 2. 구현 Ext.Loader.setConfig({ enabled:true }); Ext.application({ name: "MyXtype", launch: functoin() { var toolBar = { xtype: "toolbar", docked: "top", items:[ { xtype: "button", text: "버튼 1" }, { xtype: "button", text: "버튼 2" }, { xtype: "button", text: .. 더보기
하이브리드 앱 센차터치 2.0 - 슬라이드 애니메이션 1. 개요 이미지 레이아웃을 카드형태 처럼 겹쳐보이게 구성하고, 각 패널과 연관된 버튼을 클릭해서 슬라이드 형태의 애니메이션을 구현 할 수 있다. 2. 구현 Ext.Loader.setConfig({ enabled: true }); Ext.require("Ext.Panel"); Ext..application({ name:"MyAnimation", launch: function(){ var pContainer = Ext.create("Ext.Panel",{ fullScreen: true, layout: { type: "card" }, items: [ // 툴바 버튼 { xtype: "toolbar", docked: "top", defaults: { handler : functoin(){ var num = p.. 더보기
하이브리드 앱 센차터치 2.0 - 탭 패널의 이해 1. 개요 이미지를 배치할 때 각 이미지를 제어할 수 있는 탭을 구성해주는 기능을 제공해준다. 2. 구현 Ext.Loader.setConfig({enabled:true}); Ext.require("Ext.Panel"); Ext.require("Ext.tab.Panel"); Ext.application({ name:"MyApp_tapPanel", launch:function(){ // HomeView 페이지 정의 Ext.define("HomeView",{ extend:"Ext.panel, config:{ title:"HomeView", style:"background-image:url( 'bgimg/bg1.jpg' );", html:"홈 뷰 영역" } }); // LoginView 페이지 정의 Ext.de.. 더보기

티스토리툴바