2. 강사 소개
김학길
현) 널리소프트 CTO, 수석개발자
- 테스트 도구 “시그널파이어” 개발
- 프레임워크 “제이넛” 개발
전) 웹케시 프레임워크팀
- JexFrame Core 개발
- 기업은행 기업스마트뱅킹 프레임워크 지원
- 우리은행 스마트오피스 프레임워크 지원
- 대구은행 스마트 뱅킹 프레임워크 지원
- 전북은행 차세대 인터넷뱅킹 프레임워크 지원
- 새마을금고중앙회 스마트뱅킹 프레임워크 지원
- 씨티은행 통합 인터넷뱅킹 프레임워크 지원
- 신협중앙회 스마트 뱅킹 프레임워크 지원
3. 진행 순서
1.모바일 앱의 개념
2. 네이티브 앱 개발 상세
3. 웹 앱 개발 상세
4. 하이브리드 앱 개발 상세
5. 모바일 앱 개발시 특이점
5. 모바일 앱 개발 방식의 종류
네이티브 앱 (NativeApp)
웹 앱 (WebApp)
하이브리드 앱 (HybridApp)
6. 네이티브 앱 - 정의
순수하게 iOS /Android OS에서 제공하는 SDK를 이용하여 제작
iOS는 xcode를 활용하여 Objective-C, swift로 제작
Android는ADT(Android Developer Tools)를 활용하여 java로 제작
Native Code
Device API
7. 네이티브 앱 - 장점
빠른 성능 (실행 속도)
OS 별 최적화
조작감
스마트폰의 모든 기능을 활용
(Push, GPS, 카메라 등)
섬세한 UI 표현이 가능
Native Code
Device API
8. 네이티브 앱 - 단점
비싼 개발 비용- iOS,Android 개발자 각각 필요
개발자 스킬에 따라 앱의 품질이 좌우됨
OS별로 소스코드를 이중 관리
소스 변경시 반영의 어려움
- 사소한 수정도 마켓플레이스 이용
- iOS와Android의 반영 시간 차이로 인해
서버 반영 의 부담 증가
Native Code
Device API
9. 웹 앱 - 정의
웹 기술을 이용하여 제작한APP
웹 페이지를 모바일에 최적화하여 제작
HTML, CSS, javascript 기술을 활용
Mobile Browser
Web Code
10. 웹 앱 - 장점
저렴한 개발 단가 (웹개발자만 있으면 됨)
빠른 배포 (수정시 바로 적용)
이중 관리 문제 없음(One Source Multi-use)
개발자 수급이 비교적 용이
많은 오픈 라이브러리 활용 가능
Mobile Browser
Web Code
11. 웹 앱 - 단점
디바이스의 고유 기능을 활용하기가 어려움
(카메라, GPS, PUSH 등)
네트워크 트래픽 비용의 증가
(Html, Javascript 등의 다운로드)
성능 이슈
(다운로드 시간 + Javascript 엔진 성능)
불편한 조작감, 느린 반응속도(0.3초 이슈)
복잡한 UX 개발이 어려움
Mobile Browser
Web Code
13. 하이브리드 앱 - 정의
네이티브 기술과 웹 기술을 혼합하여 제작
기본이 되는 컨테이너 앱은 네이티브로 제작하고, 사용자가 조작
하게 될 앱은 웹 기술로 제작
네이티브는 필요한API를 만들고, 웹에서는 Javascript로 디바이스
API를 호출 Native Container
Web Code
Device API
14. 하이브리드 앱 - 장점
네이티브 보단 저렴한 개발 단가
웹 앱의 장점을 대부분 수용
빠른 배포, One Source Multi-use, 개발자 수급, 오픈 라이브러리 활용
디바이스API 사용 가능
정적 파일의 캐시 - 웹 앱보다 빠른 성능
잘하면 네이티브 수준의 퀄러티 가능
Native Container
Web Code
Device API
16. 모바일 앱 개발 방식 정리
Native Code
Device API
Mobile Browser
Web Code
Native Container
Web Code
Device API
네이티브 앱 웹 앱 하이브리드 앱
게임 앱에 적합 금융권 앱에 적합홈페이지 앱에 적합
17. 안드로이드 어플리케이션
• 리눅스 커널 기반의 모바일용 OS
• 구글에서 안드로이드사를 인수하여 개발
• 2007년 11월 안드로이드 1.0 VersionAlpha 출시
• 최신버전은 6.0 Version - Marshmallow
• 완전 개방형 플랫폼
• 안드로이드 마켓(Google Play Store) 에서 어플
리케이션을 거래
19. Application
안드로이드 앱 자체
앱 구동과 종료에 대한 이벤트를 활용하거나, 앱에
대한 정보에 접근하기 위해Application Conext를 활용
Application
Activity
View
View
View
Service
Content Provider
BroadCast
Receiver
20. Activity
하나의 화면을 구성하는 단위
안드로이드 앱을 개발한다는 것은Activity를 만드는 일
Activity에 View라는 컴포넌트를 그려서 화면을 구성
Application
Activity
View
View
View
Service
Content Provider
BroadCast
Receiver
21. View
화면을 구성하는 Inputbox나 button 등의 단위를 View라고 함
View는 View Group으로 묶을 수도 있음
하이브리드 앱의 경우에는 WebView를 사용
Application
Activity
View
View
View
Service
Content Provider
BroadCast
Receiver
22. Service
안드로이드 백그라운드에서 작동
예) 뮤직플레이어
디바이스의 리소스 점유
Application
Activity
View
View
View
Service
Content Provider
BroadCast
Receiver
23. Content Provider
앱들 간에 데이터를 공유할때 사용
Application
Activity
View
View
View
Service
Content Provider
BroadCast
Receiver
24. Broadcast Receiver
PUSH, SMS, NFC 등의 이벤트를 수신
Application
Activity
View
View
View
Service
Content Provider
BroadCast
Receiver
34. Android 개발 시연
1. Android 어플리케이션 생성
2. Eclipse에서Application생성
3. Activity 그리기
4. Activity 관리자에서 화면 그리기
5. 이벤트 정의 및 개발
6. Activity에 이벤트를 구현하여 앱을 구동
35. iOS 개발 시연
1. iOS 어플리케이션 생성
2. Xcode에서 SingleViewApplication 생성
3. Story Board로 그리기
4. Story Board에 버튼, 이미지 등을 올려서 앱을 개발
5. 이벤트 정의 및 구현
6. Story Board로 그린 UI에 이벤트 등을 구현하여, 앱을
구동
38. 웹 앱 개발 시연
1. HTML로 모바일 화면 그리기
2. javascript Library 활용(jquery,Angular js,…)
3. ajax
4. 모바일 웹 디버깅
5. iOS 는 사파리를 활용하여 디버깅한다.
6. android는 chrome을 활용하여 디버깅 한다.
51. iOS 특이사항
javascript - Native 간 통신은 브라우저의 URL 호출과 동일하게
Scheme을 활용하기때문에 동시접근 문제 발생
Native 호출이 동시에 2개가 실행되면 1개는 무시될 수 있음
순차적으로 실행하는 로직구현 필요
52. 모바일 앱 테스트
디바이스 별로 특이 사항이 많이 발생함
(특히, WebView에서 제공하는 컴포넌트)
안드로이드는 파편화가 심함
53. 모바일 앱 테스트
오류
확인
화면
캡처
인터넷
PC전송
업무용
PC전송
오류 내용 +
화면 기재
개발PM
/QA 전달
등록내용
확인
개발자
전달
오류수정 수정통보
개발완료
검증
테스터 PM / QA 개발자 PM
• 모바일 앱의 경우 오류 사항 전달이 어려움
• 금융기관의 경우 보안 정책상 USB 가 금지되어 더욱 어려움
54. 모바일 앱 테스트
앱 개발 단계에서 수행하는 개발 검증 및 테스트 업무에 대해
버튼 하나로 결함 및 이슈를 등록하고 조치사항을 관리할 수 있는
화면기반의 결함 관리 솔루션
시그널파이어 : Visual Bug Tracking Solution
56. 모바일 앱 보안
<대한민국 모바일 앱 보안 4종세트>
1. 보안 키패드
2. 위변조 방지
3. 공인인증서
4. 백신(안드로이드)
“대한민국은 내가 지킨다”
57. 모바일 앱 보안
• 안드로이드는 디컴파일이 가능함
• 주요한 데이터는 Client로 안보내기
• 화면에 노출되지 않는 데이터는 Client로 안보내기
• 암호화 사용시 Client에서 복호화를 불가능 하도록
처리 (공개키 암호화 활용)
• 웹앱, 하이브리드 앱의 경우 XSS등 알려진 보안 취
약점 고려
58. 시큐어코딩
XSS(크로스 사이트 인젝션)
SQL injection (얼마전에 이 방법으로 뿜뿌라는 사이트가 털렸습니다...ㅠ)
BufferOverflow 공격. (서버 공격)
디렉토리 경로 조작으로 인한 접근
운영체제 명령 삽입
파일 업로드 취약성 대응(웹쉘)
쿠키 하이재킹 (XSS와 혼용시 더욱 위험)
오류코드 출력
개발시 하드코딩
59. 시큐어코딩
Static Member필드의 사용. 특히, Servlet은 Singleton처럼 작동하므로, 전역변수 사용
시 로그인 사용자가 뒤바뀌는 사태가 발생 가능
친절한 오류코드.
조금은 까칠하게 대응해주는게 보안에 좋아요.
로그인 실패시 잠금 기능 구현! (IP잠금 기능 또한 필요)
java Equals사용시 주의 NullpointerException이 발생하며, 소스코드의 일부가 노출되
어 보안성 위험 할 수 있음.
암복호화의 생활화, 코드에서 사용되는 주요 상수값등은 암호화 하여 사용
(특히 DB접속 정보. 실수 또는 불의 사고로 코드 노출시 문제)
