Devlopment
Eclipse에서 안드로이드 개발시 Device가 안 잡힐 경우
1. 올바른 드라이버 설치 - 해당 제조사 홈페이지에서 올바른 드라이버를 설치. 2. 안드로이드폰 설정 (이 설정시 잭을 분리하고 해야 함) - 메인메뉴 >> 환경설정 >> 응용프로그램 >> 개발 >> USB 디버깅 킴 3 작업관리자 adb종료 - 작업관리자 >> 프로세스 >> adb 프로세스 종료 ps : 기기가 연결이 안되서 고생하다가 위와 같이 하고 잭을 분리하고 연결하니 되었다.
Mobile UI Framework
Mobile UI Framework 웹 어플리케이션을 실제 모바일 디바이스의 Native 어플리케이션처럼 보여주도록 함 다양한 운영체제에 따라 별도로 개발하는 수고를 줄여줌 JQueryMobile이 배우기도 쉽고 많이 쓰인다고 하는데 아직 알파 버전이고 손으로 화면을 넘기는 효과같은 부분은 돼긴 하지만 힘들다고 한다. 장기적으로 볼 때는 Sencha Touch가 좋지 않을까 한다. Mobile UI Framework의 대표적인 종류 JQTouch - 2010년에 대세였지만 하락세 JQuery Mobile - 2011년에 많이 떠오름, 그러나 버그 투성 Sencha Touch - 상당히 좋음 Jo HTML Markup 기반 Javascript 기반 * 기존 웹 개발과 유사하며 직관적 * HTML Marku..
Mobile Browser Header 분석
* Server Side에서 HTTP Request Header중 User Agent값을 이용하여 사용자가 현재 접속한 단말기가 어떤 것인지 구분이 가능함 Device HTTP User Agent Header Sample iPhone Mozilla/5.0 (iPhone; U; CPU iPhone OS 2_0 likeMac OS X; ja-jp) AppleWebKit/525.18.1 (KHTML, like Gecko) Version/3.1.1Mobile/5A345 Safari/525.20 iPad ... Android ... BackBerry ... Windows Phone 7 ... Bada ... 요 위의 샘플은 아래 사이트를 참고하자. Reference [1] http://user-agents.my-..
jQuery Mobile 기본 코딩
JQueryMobile은 우선 SPI(Single Page Interface)를 중점으로 설계되었다. SPI가 무엇이냐? html페이지 하나에 여러 페이지를 다 작성하겠다는 것이다. html4의 #을 통한 즐겨찾기와 유사한데 틀린 점은 각 내부 페이지가 별개의 페이지로 보여진다는 것이다. ... ... [source 1] 초기 로드 ... 소스 작성 ... [Source 2] SPI형태의 페이지 작성 slide [Source 3] 버튼 [그림 1] 버튼 about [Source 4] 삭제 버튼 [그림 2] 삭제 버튼 YES NO AAA [Source 5]
Hybrid App
Application iPhone Android WinMobile7 Bada Web HTML4 JavaScript CSS 장점 : 유지보수 용이 단점 : 속도 (Html Parsing, Network), Network Traffic Web App 모바일 브라우저에서 수행되는 App급의 사이트 Server 연동 realtime, Graphic의 문제를 해결하기 위해 HTML5 사용 (그러나 HTML 5는 정식버전이 아니다. HTML5를 국내시장에서 부정적으로 보는 사람도 많지만, Mobile환경에서 성공 가능성을 봄.) 그러나 HTML5도 기존의 App의 기능적인 측면을 못 따라감 그래서 Hybrid App가 나옴 Hybrid App Native App Web App Hybrid App 장점 * 화려하고 ..
iPhone Web App 만들기
iPhone은 기본적으로 Web App에 대해 설계되어있고, 사파리 모바일을 통해 인터넷을 하다가 Web App을 추가할 수 있다. 이 때, 기본 이름은 html의 이 되고, 아래 소스를 쓰면, 아이콘 이미지 및 Web App를 시작할 때 이미지를 보여줄 수 있다. 이것에 대해 찾아보다가 이미 너무 자세하게 설명해준 블로그를 발견했다. 배드걸s님[1]의 블로그를 참조하자. 매우 설명이 잘 되어있다. Reference [1] 배드걸s 블로그, http://blog.naver.com/bad0242?Redirect=Log&logNo=130100718142
Mobile용 Meta Tag
MobileOptimized Meta Tag Microsoft에서 모바일을 위해 Layout의 가로 크기를 조정하기 위해 고안한 태그 ex) Smartphone : content = "176" pocket pc : content="240" or content="480" HandheldFriendly Meta Tag Palm의 AvantGo mobile browser를 위한 태그 모바일 화면 크기 조정관련 설정 ex) * true : 모바일용(화면 크기 조정 기능) * false : Desktop에 최적화된 html 사용 Viewport Meta Tag 대부분의 스마트폰 브라우저에서 화면의 크기를 조정하기 위해 사용 기존 width값은 980px ex) Viewport META Example Value D..
Mobile UI/UX Guideline
Mobile UI/UX Guideline ([1][2]참고) 1. 하나의 웹을 위한 설계 다양한 장비를 고려하여 설계한 컨텐츠는 비용을 절감시키고, 유연성을 증대하며, 더 많은 사람들의 필요를 충족시킬 수 있다. 주제의 일관성: 다양한 장비에서 동일 URI에 접속했을 때 제공되는 정보와 기능은 일관성이 있어야 함 성능: 사용자에게 향상된 기능을 제공하기위해 장비 성능을 상세히 확인 오작동: 다양한 장비가 각각 다르게 해석하여 발생할 수 있는 오작동을 염두에 두고 설계 테스팅: 실제 장비와 에뮬레이터 상에서 테스트를 수행 2. 웹 표준 준수 세계 곳곳의 제각기 다른 장비와 브라우저의 호환을 위해서는 표준을 준수해야한다. 유효한 MARKUP: 표준 문법에 유효한 문서를 작성 컨텐츠 포맷 지원: 장비가 지원하..
서버사이드 자바스크립트 기술
서버 사이드쪽을 자바스크립트로 구현하는 기술 정말 놀랍다. 시간이 날 때 조금 더 자세한 블로깅을 하겠다. http://nodejs.org/
크롬(Chrome) 개발자 도구
크롬이 기본으로 개발자 도구를 지원해주고 있었다. 구글은 정말 사랑할 수 밖에 없는 것 같다. 따로 추가 플로그인 같은걸 설치해주어야 할지 알았는데 크롬 설치시 기본적으로 내장되어 있다. 꾀 기능이 많아 보이는데 조금씩 알아가야 할 것 같다. (당장은 내가 웹 개발자가 아니니 쓸일은 없어보인다. -_-;) 단축키 : [CTRL] + [SHIFT] + J 위에는 HTML5에서 추가된 storage를 테스트하고 개발자 툴을 이용해서 저장된 storage를 확인한 것이다. 아래는 소스이다. LocalStorage Test remove key:- value: Add [Source 1] storage.html 아래는 HTML5에서 추가된 Indexed DB의 테스트 코드이다. Database Test remove..