진쓰의 프로그래밍 지식저장소

- Overview

 웹 서비스의 성장은 무서울 기세로 상승 중입니다. Client의 Local 에서 저장하던 Data들은 점점 서버로 올라오면서 자연스레 Web 서버와 교류가 많아지고 있습니다. 예를 들면 저희가 자주 사용하는 Naver App, You tube 등의 앱들은 Web app으로 전부 웹서비스 기반의 어플리케이션입니다. 또한 동영상들과 같은 Contents들도 Web Service로 User들과 많은 교류를 하고 있는 추세입니다. 

 웹서비스에 접근할 수 있는 Device들은 스마트폰, 데스크탑, 노트북, 타블렛, 2 in 1 notebook 등 수많은 Device들이 있습니다. 이러한 Device들의 웹 접근을 과거에는 중앙 Server 하나가 전부 전담하였습니다. 하지만 점점 Main Server의 부하가 오게 되었고 많은 기업들은 공통된 Solution을 찾게되었는데요. 그것이 바로 프록시서버를 이용한 웹 캐싱 서비스입니다. 그러면 웹 캐싱 서비스를 알아보기 앞서 프록시 서버에 대해서 알아보도록 하겠습니다.

이미 프록시서버를 알고 계신다면 내려가셔서 웹 캐싱 서비스 부분부터 보셔도 무관합니다.

.

점점 웹서버가 Clients에게 제공하는 Data가 기하급수적으로 커지고있습니다. 이는 웹서버의 부담을 의미하게됩니다. 결국 다양한 접근성으로 인해 웹서버는 부하가 가게 되고 client에게 제공하는 속도가 느려지는 등 퀄리티가 낮아지게되는 문제가 생기게 됩니다. 이럴 해결하고자 웹 캐싱 시스템을 구성하게 됩니다.

웹 캐싱 서비스란, 다양한 컨텐츠들을 별도로 다른 웹서버에 저장해두고있다가 사용자의 웹브라우저에 가장 가까운 웹서버에 해당 웹서비스의 컨텐츠를 사용할 수 있게 만드는 기술입니다. 

캐싱이라는 기술자체가 데이터를 임시로 저장해두고있다가 필요할때 갖다 쓰게 만드는 기술입니다. 컴퓨터 과학 알고리즘에서도 캐시 기법이 많이 나오기도 합니다.  어쨌든, 캐싱된 컨텐츠들을 사용자가 빠르게 쓸수있도록 제공하는 서비스이며, 메인 웹 서버의 접속 부하를 줄여주는 서비스여서 퀄리티를 높이는 방법입니다.

앞에 프록시 서버에 대해 제가 설명하였습니다. 이런 웹 캐싱 기술은 이미 프록시 시스템에서 적용되고 있습니다. 왜 웹 캐싱 시스템에 프록시 서버가 많이 사용되냐하면, 프록시 서버가 간단한 웹서버 기능을 갖추고 있기 때문입니다. 시스템 규모가 작고 커스터마이징이 용이하며 유지보수가 용이한 프록시 서버가 웹 캐싱 시스템에서 웹 캐싱 서버로 이용되고있습니다.

보통 웹 캐싱을 사용한다면, 웹서비스이 메인이 되는 프로그램은 메인 웹서버가 그대로 제공합니다. 용량이 큰 미디어 컨텐츠(음악, 영상등)들은 웹 캐싱 시스템을 이용해서 제공됩니다. 

변경이 자주 일어나는 텍스트 위주 컨텐츠는 메인 웹서버가 저장하고 제공합니다. 자주 변한다는것은 그만큼 유저에게 제공하는 기능도 다양해야할텐데 프록시서버는 그렇지는 못하기때문에 메인이 처리하기 적합한것입니다.

변경이 자주 읺어나지 않고 덩치가 큰 동영상, 사진, 음악, 그림 등의 미디어 파일들은 웹 캐싱 서버에 저장해서 제공합니다. 웹캐싱 서버들은 주기적으로 메인 웹 서버와 통신하고 저장된 내용들을 최신내용으로 갱신합니다. 그래야 사용자들이 정확한 웹서비스의 내용을 받아볼 수 있기 때문입니다.

심지어 프록시 서버는 구축이 용이하고 저렴하기 때문에 웹 캐싱 시스템에 많이 쓰이는 편입니다. 

정리

대규모의 웹서비스를 제공하는 업체들은 점점 웹 캐싱 서비스를 많이 사용하고 있는 추세입니다. 우리나라 네이버, 미국의 구글등이 그렇죠.

웹 캐싱서비스에 대한 수요가 증가하면서 자연스레 프록시 서버가 점점 진보적으로 발전하고있습니다. 이제는 프록시서버의 기술이 결코 과소평가 받지않게 되고있습니다. 

포스팅에 앞서.

드디어 Git을 로컬뿐만 아니라 원격에서 사용해야할 차례입니다. 원래 Local에서만 git을 이용한다면 의미가 반감되는 정도입니다. 그러니 원격 저장소를 사용할 수 있도록 해야합니다.  github에 계정을 만들고 사용하는 방법을 포스팅 하도록 하겠습니다.

OverView.

Github 이용 이점은 다음과 같습니다.

 - 전세계에서 진행되는 오픈 소스프로젝트가 많이 모여있어 이에 참여하고 기여할 수 있는 기회가 있습니다.

 - 개발자는 Github를 이용해 자신이 작성했던 코드 그자체를 즉시적으로 제공할 수 있습니다.

 - IT개발자 뿐만 아니라 디자이너, 기획자등 모두 협업할 수 있습니다.

- GitHub 가입하기.

https://github.com

sign up for github 선택하여 회원가입합니다. 음 모두 free로 선택해서 가입하시면 되겠습니다.

모든 이메일 인증과 절차를 끝내고 sign in 한 화면입니다. 

- 원격 저장소 생성.

원격저장소는 외부에서 접속하여 저장하는 저장소입니다. 앞선 포스팅에서는 로컬에서 git으로 작업했다면 이제는 원격 저장소에도 저장하여 다수 개발자들과 협업을 해야합니다.

Github의 기능 소개입니다.

사용자들끼리, 서로의 원격 저장소를 읽거나 쓸 수 있어서, 깃허브에서 오픈소스 프로젝트가 활발하게 이루어진답니다.

그러면 실습에 쓰이는 새로운 원격 저장소를 github에서 생성해보도록 하겠습니다.

[New repository]를 선택합니다.

Owner: 사용자 아이디가 표시됩니다.

Repository name: 저장소 이름입니다.

Description: 원격저장소 역할을 설명합니다.

public/private: 저장소 공개 비공개 설정입니다.

Add .gitignore: 프로젝트에 포함되지않을 파일목록을 만들 때 사용합니다.

Add a license: 어떤 라이센스에 속할지 선택합니다.

다음과 같이 설정하고 생성했습니다.

- GitHub 원격 저장소의 구조.

오른쪽 상단의 메뉴들에 대한 설명입니다.

Watch: 원격저장ㅅ의 활동내역을 사용자에게 알려줍니다.

Star: 즐겨찾기 기능이라 생각하시면됩니다.

Fork: 해당 원격저장소를 fork 합니다. 얼마나 많은 사람들이 fork했는지 수가 나타납니다.

저장소 메뉴들을 살펴보겠습니다. 

Code: 해당 원격저장소의 루트 디렉토리로 이동합니다.

issues: 주요 이슈사항을 기재한후 관리합니다.

Pull Requests: 전체 목록을 모아서 보여줍니다. 목록마다 댓글 형태로 토론할 수 있습니다. 왼쪽에있는 숫자는 현재 요청이 온 리퀘스트를 받아들일것인지에 대한 논의가 몇개인지 알려주는것입니다.

Wiki: 공유할 정보나 개발문서, 참고자료등을 작성하기 위한 기능입니다. 

pulse: 해당 원격저장소의 최근 변경 내역을 확인할 수 있습니다. 

Graphs: 공헌자의 공헌내역, 커밋 반영 수 등 활동내역을 그래프화해서 확인할 수 있습니다.

Setting: 해당 저장소 관리자면, 각종 설정을 변경 할 수 있습니다.

HTTPS Clone URL: 원격 저장소를 clone할 때 사용하는 주소정보를 알려줍니다. 

Clone Desktop: 깃허브 전용 클라이엍느 프로그램을 사용할 때 클론할 떄 클릭하면 됩니다.

Download ZIP: 원격 저장소의 전체파일을 하나의 압축 파일형태로 다운로드 받을 수 있습니다.

- GitHub 사용자 유형.

다음 포스팅엔 직접 원격 저장소에 접근하여 올려보고 수정해보록 하는 실습을 가지도록 하겠습니다. 

감사합니다.

로컬환경에서 혼자 Git을 사용한다는 가정아래 git의 명령어를 보도록 하겠습니다. 일단 로컬에서 기초를 먼저 다지시면 원격저장소에 저장하는것은 크게 어렵지않게 느끼시게 될것입니다. 기본을 다지다 생각하시고 해당 포스팅 보시면 되겠습니다.

하기와 같은 시나리오 대로 진해앱도록 하겠습니다.

- 로컬 저장소 생성

- 저장소에 파일 생성 및 추가

- 추가된 파일의 수정

- 기본 브랜치에 영향을 끼치지않는 브랜치 생성

- 브랜치 병합

- 충돌 해결

- 저장소 기록 보기

시나리오를 살펴보니, 브랜치간의 병합하고 충돌과정을 해결하는게 딱봐도 어려워 보이네요. 차근차근 풀어가보도록 하겠습니다.

용어정리를 먼저하겟습니다.

앞서 포스팅했던, 글을 참고하여 git bash를 실행하도록 합니다.

1. git init 저장소 생성

Git저장소로 사용할 디렉터리를 만들어봅니다.

> mkdir my_work   //디렉토리를 새로 생성합니다.

> cd my_work        // 디렉토리 이동을 합니다.

> git init               //  저장소 초기화를 진행합니다.

현재 작업중인 브랜치가 master가 된것도 확인하실 수 잇습니다.

2. git add, git commit

파이썬 파일 Hello world를 출력하는 프로그램을 작성하도록 하겠습니다. 파이썬이 설치안되어있으시다면 일반 텍스트파일로 진행하셔도 무난합니다. 실전과 같은 느낌으로하려고 파이썬 을 선택했기 때문입니다. 정말 윈도우에서 파이썬을 설치하고싶으시다면, 해당링크 선택하여 설치하시고 오시면 되겠습니다. 

저는 hello.py 파일을 생성해서 print("hello world") 라고 코드를 작성하여 저장했습니다.

hello world가 출력되는것을 확인하실 수 있습니다.

자 이제 저장소 상태를 확인해봅시다.

> git stauts

아래과 같은 메세지가 출력됩니다.

추적하지 않은 파일이 저장소에 있다고 알려줍니다. 이를 추적하려면 git add를 사용하며 된다고 하네요. 소원대로 사용해줍시다.

> git add hello.py

그이후에 다시 쳐봅니다.

> git status

새로운 파일 hello.py가 추가되었다고 뜨는것을 확인하실 수 있습니다.

이제 commit을 해보겠습니다.

> git commit

앗 유져 이메일과 사용자이름을 먼저 설정하고 진행하라고 하는군요. 저처럼 설정안하신분은 설정하고 다시 진행하도록 합니다.

> git config --global user.email "이메일"

> git config --global user.name "이름"

다시 깃 커밋을 날려줍니다.

> git commit

커밋 메세지를 작성하는 화면이 나옵니다. 아마 VIM이 실행되었을 것입니다. I키를 눌러 첫번째 줄에 여러분들의 커맨트를 다시면 되겠습니다.

그이후 ESC를 누르고 :wq룰 입력후 enter를 쳐서 빠져나옵니다. 그러면 커밋이 완료된것입니다.

화면을 빠져나오면, 마스터 브랜치에 어떠한 변화가 생겼는지 출력되는 커멘트들을 확인하실 수 있습니다.

.

3. git branch, git checkout

현재 작업하고있는 브랜치를 확인하는 커맨드는 다음과 같습니다.

> git branch

master 브랜치를 확인하실 수 있습니다.

브랜치 생성은 다음과 같습니다.

> git branch myBranch 

>git branch

master 브랜치, myBranch 를 확인하실수있습니다. 또한 *글자가있는데, 이는 지금 작업중인 브랜치를 표시합니다.

이제 브랜치를 이동해보겠습니다.

>git checkout myBranch

> git branch

해당 브랜치에서 hello.py를 수정해보겠습니다.

>vim hello.py

printf("Hello world") 코드아래, print("Tell me hello") 코드 작성합니다. 저장후 나옵시다. 여기까지가, myBranch에서 hello.py파일을 수정한 상태입니다.

4. git commit -a

현재의 상태를 보겠습니다.

>git status

hello.py 가 수정되었다고 하네요.

이제는 git add 혹은 git commit -a 를 커멘드를 날려라고 하네요. -a옵션은 변경된 저장소 파일모두를 커밋하는 옵션입니다.

> git commit -a 

역시, vim 이뜨면서 커멘트를 달아라고합니다. 적당한 커멘트를 달고 나옵니다. 

그리고 다시 상태를 확인해봅니다.

> git status

myBranch 에 커밋할게 없다고 뜨는것을 확인하실 수 있습니다.

커밋할때 vim이 열려서 따로 추가하고 나오는게 번거로울 수 있는데 그럴때는 아래와 같이 명령어를 치면 되겠습니다.

> git commit -m "커밋할 메세지를 여기에 작성"

5. git merge: master 브랜치와 병합

그럼 이제 다시 master 브랜치로 체크아웃 하겠습니다.

> git checkout master

> python hello.py 

헬로 월드만 뜨는것을 확인하실 수 있습니다.

그리고 이제 브랜치 병합을 실시하겠습니다.

>git merge myBranch

myBranch에 추가한 print("Tell me hello")가 제대로 뜨는지 확인해보겠습니다.

>python hello.py

제대로 출력되는것을 확인하실 수 있습니다. 혹은, cat hello.py 를 입력하시면, myBranch에서 추가한 구문이 병합되어 master 브랜치의 hello.py에 반영된것을 확인하실 수 있습니다. 

6. 각 브랜치의 독립성 확인

병합전 독립성을 확인해보겠습니다.

현재 master 브랜치에서 hello.py마지막에 print("tell his world") 를 추가합니다.

그리고 커밋을 합니다.

>git commit -a    //a옵션은 수정된 파일 모두 커밋입니다.

마스터 브랜치에 커밋 완료했으면 다시 브랜치를 이동하겠습니다.

>git checkout myBranch

>vim hello.py

여기까지 실행했으면 hello.py에는 master 브랜치에서 반영했던 내용이 반영안된것을 확인하실 수 있습니다.

여기선 print("Tell Her world") 를 추가하고 저장하겠습니다.

그리고 해당 브랜치에서 커밋하겠습니다.

>git commit -a 

자 그럼 hello.py가 master 브랜치와 myBranch에서 독립적으로 작성된것을 확인하실 수 있습니다.

7. .gitignore 불필요한 파일 및 폴더 무시

보통 개발을할때 빌드파일 로그파일 기타 잡파일들이 프로젝트 폴더에 포함되는경우가 있습니다. 이런파일들을 commit하게되면 브랜치에는 쓸데없는 파일들이 차고 넘치겠지요. 이런것들을 방지하고자 commit할때 제외시켜주도록 도와주는 파일이 .gitignore파일이 되겠습니다.

>touch .gitignore

빈파일의 .gitignore 파일을 생성합니다.

직접 작성하기엔 저희에겐 시간이없습니다. 그래서 해당사이트에서 도움을 받도록 하겠습니다.

https://www.gitignore.io/

파이썬과 사용중인 운영체제 윈도우스를 선택했습니다. IDE도 입력하시면 됩니다. 아무튼 create하면 파일을 생성해주는데 이걸 .gitignore 파일에 넣으시면 되겠습니다. 저는 메모장으로 그냥 넣었어요.

그리고 다시 

> git status

항상 파일을 새로생성했으면add를 먼저 해주시고 그이후부터 commit을 해주셔야 합니다. add를 통해서 추적을 시작하겠다는것을 전달하는 것이지요.

>git add .gitignore

>git commit -m "added ignorefile"

이제 윈도우, 파이썬으로 작업하실때 불필요한 파일이 저장소에 커밋되는것을 방지하실 수 있습니다.

8. 충돌해결

마스터 브랜치로 이동하여 myBranch와 병합을 시도해보록 하겠습니다.

>git checkout master

>git merge myBranch

cat hello.py

해당 master 브랜치가 merging 이라고 표시가 나오네요. 또한, hello.py 파일을 보면 myBranch에서 작성했던 내용이랑 달랐기때문에 충돌이 되었고 해당파일에 충돌 표시가 보이는것을 확인하실 수 있습니다.

충돌이 났으니 개발자가 직접 풀어야겠죠? 해당 hello.py를 열어서 충돌난 부분을 수정해서 적절하게 합쳐줍시다.

그리고 커밋해봅시다. 

참고로, 이번엔 add로 추적할 대상을 선택안했기때문에 git commit 이 아닌 git commit -a 를 쓰면됩니다.

> git commit -a -m "conflict resolved!"

충돌을 해결하니 master 브랜치도 merging이없어진것을 확인하실 수 있습니다.

충돌을 해결하였습니다.

9. git log 기록보기

> git log --graph

SHA값, 커밋한 사용자, 시각, 메세지등을 확인하실 수 있습니다. 브랜치가 생성되고, 분기되고 merge까지 되는것을 시각적으로 보실 수 도 있습니다.

> git log --stat

각 커밋에서 수정된 파일의 통계정보를 보여줍니다.

Gradle 개요

Gradle 블로그를 포스팅하기 앞서 왜 gradle에 관한 블로그를 포스팅하는지 이유를 말씀드리고싶네요. 현업에서 일하고 있는데, gradle을 항상 남이 짜놓은걸 그대로 받아서 빌드돌려서 개발만 하다가, 이제는 제대로 스터디해서 내기호에 맞게 수정하고싶은 마음이 생겼습니다. 또한, gradle이 강력한 빌드 툴이라는 말을 계속 들어서 언젠가는 해야겠다는 마음먹었는데 드디어 행동에 옮기게 되었습니다. 부디 저와 같이 스터디하여 gradle을 master하도록 합시다.

Gradle OverView

Gradle은 Gradle 사에서 만든 범용 빌드 도구중에 하나입니다. 안드로이드에서 빌드 뿐만 아니라, java, c/c++ 등의 모든 범용 언어를 지원합니다. 그러므로 엄청 강력한 툴이지요. 그래서 Gradle을 한번 배워두면 다른언어로 개발하더라도 빌드 스크립트를 처음부터 다시 작성할 필요없이 재사용하실 수 있습니다. 누차 강조하지만 꼭 gradle을 배워보도록 합시다.

다음은 gradle의 주요 특징 4가지 입니다.

1. Polyglot Build

Gradle은 각 언어를 플러그인으로 구별합니다. java는 java, java 웹 프로젝트는 war, 안드로이드 앱은 com.android.application 플로그인을 사용하면 됩니다.

2. 도구통합

gradle은 이클립스, 안드로이드 스튜디오 와 같은 IDE에서 정말 편리하게 사용할 수 있도록 창을 제공하고있습니다. 또한 젠킨스와 함께 활용할 수 도있습니다. 소스코드가 git에 업로드되면 서버에서 CheckStyle, FindBugs 등의 플러그인을 활용하여 소스코드가 잠재적으로 가진 문제를 검출하여 개발자에게 통보하거나 위험한 코 드를 merge할 수 없도록 강제적으로 할 수 있습니다.

3. 외부 라이브러리 관리 자동화

Gradle의 또다른 장점중 하나는 개발자가 더는 외부라이브러리를 관리하지 않아도 된다는 점입니다. 개인적으로 이점이 가장 마음에 듭니다. 이클립스에서 개발했던 과거의 경우에는 libs 폴더에 원하는 외부라이브러리 파일을 직접 복사하였지만, Gradle 에서는 단순히 외부 저장소 위치와 라이브러리의 그룹, 이름, 버전 등을 지정해주면 알아서 다운로드하고 빌드에 포함시키게 됩니다. 이얼마나 편하고 좋습니까.

4. 고성능 빌드

Gradle은 점진적 빌드, 빌드캐싱, 병렬 빌드 기능을 지원하는 고성능 빌드를 지향합니다. 하지만 실제로 우니도우 환경에서 안드로이드 앱을 빌드해보면 gradle 메모리 사용량이 많고 빌드시 CPU 점유율이 엄청 높게 잡힙니다. 실무에서 권장하는 사양은 메모리 8GB와 SSD 장착입니다. 메모리 4GB에서 모듈의 수가 늘어나면 Out of memery 현상이 발생합니다. 또한 heap이 부족하다고 난리치기도 한답니다.(진짜 경험)

안드로이드 스튜디오에서 Gradle의 특징을 살펴보겠습니다.

1. 멀티 프로젝트 구조

안드로이드 스튜디오에서 프로젝트를 생성하면 멀티 프로젝트로 생성됩니다. app이라는 폴더가 있는데 이를 Gradle에서는 모듈이라고 부릅니다. gradle에서는 app 모듈뿐만 아니라 새로운 모듈을 추가하여 모듈별로 src 폴더를 포함하게 됩니다.

2. src폴더 구조가 다름

androidTest, main, test 폴더를 확인하실 수 있습니다. Test 폴더는 Local Unit Test 를 지원합니다.

3. libs 폴더

이클립스 libs 폴더에는 빌드하는데 필요한 외부라이브러리를 직접 포함시켜야 했습니다. 하지만 gradle에서는 의존성 관리를 gradle이 담당하므로 libs 폴더를 사용하지 않아도됩니다. 필요한 스크립트 파일에서 외부라이브러리의 저장소와 버전등을 지정하면 빌드할 때 알아서 해당 버전을 다운로드하여 포함합니다. 또한, +옵션등을 적용하면 최신버전을 자동으로 다운로드 할 수 있습니다.

4. bin 폴더

gradle에서 빌드를하면 build/output/apk 폴더에 apk 파일이 위치하게됩니다. 혹은 AAR파일도 있게 됩니다.

정독 해주셔서 감사합니다.

안녕하세요 진쓰예요. 형상관리툴하면 가장먼저 생각나는툴은 역시 깃(GIT)이라고 할 수 있습니다.

깃은 리누스 토발스가 개발한 형상관리툴로서, 압도적인 처리속도로 인해서 전세계 개발자 대다수가 사용하는 아주 강력한 툴이라고 할 수 있습니다.

git 포스팅을 시작하는 이유는, 실제 제가 일하고 있는 현업에서 점점 git을 사용하는 추세로 바뀌고 있기 때문입니다. 그러면 그전엔 어떤 형상관리 툴을 썼느냐 하면 p4(perforce)라는 형상관리툴을 이용했습니다. 윈도우 Base의 gui환경을 제공했기 때문에 사용하기 편리했습니다. 그러나 대세에 따라가려면 git을 써야겠죠? 또한, 현업을하면서 퍼포스가 가지는 한계에 부딪혔기때문에 결국 git을 공식 사용하기로 선포하였다고합니다. 부서에서 진행한 git 세미나를 들었었는데요. 실습없이 진행하다보니 그냥 감만 잡은 상태입니다. 그래서 블로그를 진행해보면서 직접 실습도해보면서 개인적으로 공부도 해보고 여러분들에게 공유도하면 좋을 것 같아서 해당 git 포스팅을 하기로 마음먹었습니다.

보통 리눅스 환경에서 git을 많이 사용할텐데요.윈도우에서도 설치하고 이용해보도록 윈도우 git 설치 포스팅 시작하겠습니다.

먼저 공식사이트로 이동해서 git을 다운받도록 합시다.

https://git-scm.com

공식사이트로 이동하셨으면 아래화면중 Downloads를 선택합니다.

Downloads를 선택하시고 Windows를 선택하시면, 해당하는 PC에맞는 Bit의 인스톨러를 자동 다운로드하게 됩니다.

다운로드가 다되면 설치를 진행하시면 됩니다.

저같은경우는 전부 default로 설정된대로 설치를 진행하였습니다.

이렇게 하시면, git 환경변수도 설치과정중에 자동으로 할당되게됩니다.

설치를 다 끝내시면, 윈도우 시작에 git bash를 검색하면 다음과 같은 아이콘을 확인하실 수 있게 됩니다.

그리고 실행하시면 다음과 같은 bash 창이 열리는것을 확인하실수 있습니다.

설치되었으면  git이 제대로 설치되었는지 확인해봐야겠죠? 개발자들은 이런 확인과정을 꼼꼼히 해주셔야 합니다.

사용자 이름과 이메일을 입력하려면 다음 명령을 커멘드라인에 입력하고 실행합니다. git에서 커밋할때마다 기록하는 사용자 이름과

메일 주소를 설정하는 명령입니다.

명령을 실행해도 특별한 메세지가 출력되지는 않습니다. 하지만 이제 Git을 사용할 준비가 되었습니다.

혼자 개발이아닌 다수의 개발자들과 협업을 할 수도 있게 되었고, 또한 github사이트에 공유하여 open source 프로젝트도 진행하실 수 있는 환경을 구축하게 되었습니다.

감사합니다. 부디 Git을 잘 다루는 개발자가 되어 형상관리를 예쁘고 멋지게 해봐요.

다음 포스팅 부터 git을 이용한 실습 예제들을 소개하도록 하겠습니다.

<안드로이드 액션바 + 탭 구현>

 안드로이드에서 제공되는 Action Bar에서 Navigation Tab Mode로 변경하여 제작하는것이 금일 포스팅의 목표입니다. 안드로이드가 요즘 목표가 액션바에 네비게이션 탭을 둬서 유저에게 제공하는 UI를 제공하는거죠. 또한, 프래그먼트 사용을 적극 권장하고 있는 추세인것 같습니다. 다중의 액티비티를 만들어내는 것보다 프래그먼트를 도입하여 하나의 액티비티에서 여러기능들을 수행할 수 있도록 유도하고 있는것 같습니다.

 실제로 이러한 움직임은 불과 몇 년전의 web 에서와 비슷하다고 할 수 있는데요. web page 시장도 예전에는 frame이라는 태그가 있었고, 여러 html 파일들로 나뉘어 져있었어요. 그런데 w3c에서 frame 태그를 없애더니 하나의 페이지에서 여러 정보를 전개할 수 있는 ajax등을 권장하고 있는 추세이지요. 

아무쪼록 액션바에 네비게이션 탭모드로 설정하고 프래그먼트와 연동하는 안드로이드 실습 포스팅 진행하도록 하겠습니다.

금일 실습해볼 과제의 최종결과물 먼저 보도록 하겠습니다.

두번째 그림은, 첫번쨰 프래그먼트 상태인데 중복으로 눌렀을 경우, 다시한번 선택되었다는 토스트가 뜨도록 구현한 사항입니다. 구현사항이 궁금하시면, MainActivity.java 의 onTabReselected 오버라이드 메서드를 참고하시면 되겠습니다. 

먼저 탭이동에 따른 프래그먼트 먼저 생성하겠습니다.

Fragment1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">


    <TextView
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:text="First Fragment"
     android:textColor="#ff000000"
     android:gravity="center" />
</LinearLayout>

첫번째 프래그먼트가 생성되었을때, inflate를 전개하는 코드입니다. inflater를 통해서, 전개하는 과정의 코드가 있습니다.

FragmentOne.java

package com.android.jinss.dando;

import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by PARK on 2017-07-08.
 */
public class FragmentTwo extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment1, container, false);
    }
}

2번째 프래그먼트 xml파일입니다.

Fragment2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:text="Second Fragment"
        android:textColor="#ff000000"
        android:gravity="center" />


</LinearLayout>

두번째 프래그먼트가 생성되었을때, inflate를 전개하는 코드입니다.

FragmentTwo.java

package com.android.jinss.dando;

import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by PARK on 2017-07-08.
 */
public class FragmentTwo extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment2, container, false);
    }
}

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.android.jinss.dando.MainActivity"
    >

    <LinearLayout
     android:id="@+id/fragment"
     android:orientation="vertical"
     android:layout_width="match_parent"
     android:layout_height="match_parent" />

마지막으로 Actionbar.TabListner를 implements하는 MainActivty를 살펴보시겠습니다. Fragment전개 역시 Main에서 합니다.

MainActivtiy.java

import android.app.ActionBar;
import android.app.Activity;

import android.app.Fragment;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.widget.Toast;

public class MainActivity  extends Activity implements ActionBar.TabListener {
    Fragment frag1, frag2;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ActionBar ab = getActionBar();
        ab.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

        //타이틀바는빼고 탭만 보여주기위해 작성.
        ab.setDisplayShowTitleEnabled(false);
        ab.setDisplayShowHomeEnabled(false);


        frag1 = new FragmentOne();
        frag2 = new FragmentTwo();
        ab.addTab(ab.newTab().setText("Text Fragment")
         .setTabListener(this));
        ab.addTab(ab.newTab().setText("Image Fragment")
               .setTabListener(this));
    }

    @Override
    public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
        ft.replace(R.id.fragment, tab.getPosition() == 0 ? frag1 : frag2);
    }

    @Override
    public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {
        ft.remove(tab.getPosition() == 0 ? frag1 : frag2);
    }

    @Override
    public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {
        Toast.makeText(this, "Reselected!", Toast.LENGTH_LONG).show();
    }
}

액션바에 네비게이션 탭을 add하여 전개하는 코드들을 살펴보았습니다. 근데 하면서, 탭의 height을 늘리고싶었는데 도무지 방법을 모르겠더라구요.

그럴때는 개발자가 직접 custom theme style.xml을 직접 작성하여서 해야하는 것같던데 자세한 방법을 찾아보다가 지쳐서 일단 pending 상태입니다.

혹시 아시는 아이디어가 있으시다면 댓글로 달아주시면 고맙겠습니다. 이상으로 안드로이드 액션바에 네비게이션 tab mode와 fragment 동시 구현에 대한 포스팅을 마치도록 하겠습니다. 감사합니다.

안녕하세요. AI를 실습하기 앞서 파이썬을 설치하려고 합니다.저는 파이썬 3버전으로 할거기때문에 아나콘다 역시 3버전을 받을 것입니다.

참고로 파이썬은 제공되는 라이브러리들이 너무 강력해서 비전공자들도 애용하는 컴퓨터 언어입니다. GUI tool을 제공하여 그래프 분석이라든지, AI 라이브러리, 웹페이지 크롤링, 윈도우 시스템 프로그래밍등 지원하지않는 분야가 없을 정도로 막강한 언어라고 할 수 있습니다. 그런데도 안쓰는 이유가 있다면 그것은 아마 무겁기 때문일 것입니다. 원래 JAVA도 90년도에 나왔을때는 무겁고 느리다는 평을 받으면서 등한시 되었었는데요. 파이썬도 곧 하드웨어가 점점점 좋아진다면 더욱 대중화가 되지않을까요?

이제 본격적인 AI 실습에 앞서, 아래 싸이트 들어가셔서 윈도우 아이콘 클릭하세요. (윈도우 운영체제인 분들은 윈도우를 선택하시면 됩니다.)

http://www.continuum.io/downloads

아마도 똑똑한 웹사이트는 지금 여러분의 컴퓨터 사양에 맞는 파이썬 인스톨러를 자동으로 뛰워 줄겁니다.

저는 64비트 PC였기때문에 해당 인스톨러 화면이 나왔습니다. 선택하여 파일을 다운로드 받습니다.

이제 파이썬이 제대로 설치되었는지 파이썬 프로그래밍을 통한 확인이 필요합니다.

윈도 실행창: cmd 엔터를 칩니다. 윈도우 커맨드 창이 열리게 됩니다.

> python --version 엔터를 칩니다.

설치를 하면서 환경변수가 자동으로 설정되었기 때문에 python 명령이 먹히는것을 확인하실 수 있습니다. 제 PC에서는 파이썬 3.6.1 버전이 설치된것을 확인할 수 있습니다. 또한 아나콘다 4.4.0 버전이 설치된것을 확인할 수 있네요.

아까 위에서 파이썬 인스톨러를 설치받을때, 아나콘다 베이스의 파이썬 인스톨러를 받았기 때문에 같이 설치된것을 확인할 수 있습니다.

파이썬 인터프리터역시  설치확인해보겠습니다.

> python 엔터를 칩니다.

그 이후, 

> 1+ 2 엔터 쳐봅니다.

파이썬 인터프리터를 이용하면 대화식으로 프로그래밍 하실수 있습니다.

현재는 1+2를 쳐서 3으로 결과값이 출력된것을 확인하 실 수 있습니다.

원래 제대로 프로그래밍 하기위해서는 변수를 선언하고, 제어문(반복문, 조건문)이나 함수를 작성하여 할 수 있지만, 파이썬은 다음과 같이 인터프리터 방식으로 바로바로 결과가 출력되는 인터프리터 프로그래밍도 지원합니다.

간단하게 테스트를 해보고싶은경우 파이썬 인터프리터를 사용하기도 합니다.

해당 파이썬 인터프리터 창을 종료하시려면 ctrl+z 이후 엔터 치면 종료됩니다. 리눅스와도 같네요.

이상으로 윈도우에서 파이썬 설치 포스팅 마치도록하겠습니다. 감사합니다.

안녕하세요 진쓰입니다.

일본 오사카 여행 첫날 여행후기 포스팅하겠습니다.

크게 정리하자면

1. 간사이공항 -> 덴카차야   : 라피트로 이동 하였습니다.

2. 덴카차야 -> 닛폰바시역 : 지하철 이동 하였습니다.

3. 닛폰바시 -> 츠루동탄   : 일본 우동, 점심 식사 하였습니다.

4. 츠우동탄 -> 도미인 프리미엄 난바  : 호텔 체크인 (오후1시) 하였습니다.

5. 도미인 프리미엄 난바 -> 오사카성 : 지하철 타고 이동하였습니다.

6. 오사카성 -> 나타자키초 카페거리 : 지하철 타고 이동하였습니다.

7. 나타자키초 카페거리 -> 햅파이브 : 걸어서 갔습니다.

8. 햅파이브 -> 우메다 하늘정원 : 걸어서 갔습니다.

9. 우메다 하늘정원 -> 도미인 프리미엄 난바 : 지하철, 휴식 하였습니다.

10. 도미인 프리미엄난바 -> 도톤보리 : 음식먹으러 갔습니다.

일본의 지하철 타는방법?

가장 간단한 방법으로는 지금 현재역에서 가고자하는 역을 구글맵에서 길찾기기능으로 검색하세요.

그러면 금액이 뜹니다. 그 금액에 해당하는 표를 끊으시면됩니다. 160옌, 180옌, 230옌 등등 있습니다.

일본어를 모르시겠다면 English로 바꿔서 끊어보세요.

그리고 환승이란 개념이없습니다. 노선이 달라질때마다 돈을 내서 표를 끊으셔야 됩니다.

1. 간사이공항 -> 덴카차야   : 라피트로 이동 하였습니다.

간사이 공항에 내리셔서, 지하철을 타는곳이 보입니다.

그쪽으로 가셔서 라피트 어디서 교환할 수 있는지 역무원한테 물어보세요. 바로 직빵으로 알려드립니다.

헤메실수있으세요.

그리고 왕복으로 끊으셨다면, 교환권을 계속 가지고 계셔야합니다. 1번 더 교환해야하기 때문이죠. 저는 돌아올때 덴카차야에서 교환했습니다.

2. 덴카차야 -> 닛폰바시역 : 지하철 이동 하였습니다.

구글맵이 너무좋더군요. 얼마 내야할지 금액이 나오기때문에, 그거에 해당하는 열차 티켓을 끊고

지하철을 탔습니다.

3. 닛폰바시 -> 츠루동탄   : 일본 우동, 점심 식사 하였습니다.

유부우동, 새우덮밥같은거 먹었습니다.

유부우동은 맛있습니다. 일본 특유의 닮이있어요.

그리고 새우가 완전 탱탱해요.. 굿굿. 미니우동은 새우덮밥같은거 시켰을때 같이 나와용.

4. 츠우동탄 -> 도미인 프리미엄 난바  : 호텔 체크인 (오후1시)

호텔에가서 체크인하고, 잠시 쉬었습니다.

.

5. 도미인 프리미엄 난바 -> 오사카성 : 지하철

오사카성에 쳐들어왔습니다.

천수각에 입장하시려면 500옌인가 600예 내시고 입장하시면됩니다.

6. 오사카성 -> 나타자키초 카페거리 : 지하철 타고 이동하였습니다.

걸어서 카페거리도왔습니다. 관광객이 많이없어서 좋더군요.

일본 전통가옥들도 많이보이고, 일본같아서 좋았습니다. 사진찍을곳도 많구요.

근데 카페는 안들어가봤어요.

7. 나타자키초 카페거리 -> 햅파이브 : 걸어서 갔습니다.

햅파이브에 도착했습니다. 햅파이브라는 건물이 있어요. 거기 7층인가 관람차를 탈 수 있는 기구가 있습니다.

첨엔몰랐는데, 이거 엄청 높이올라가요!!!! 인당 600옌인가 그랬습니다.

8. 햅파이브 -> 우메다 하늘정원 : 걸어서 갔습니다.

우메다 하늘정원입니다. 입장료는 인당 1000옌입니다. 

남산타워보다 훨씬높습니다. 

9. 우메다 하늘정원 -> 도미인 프리미엄 난바 : 지하철, 휴식 하였습니다.

잠시 숙소에 와서 휴식을 취했습니다.

10. 도미인 프리미엄난바 -> 도톤보리 : 음식먹으러 갔습니다.

도톤보리에서 오꼬노미야끼와 타코야끼를 먹었습니다.

오꼬노미야끼먹을때는 홍만이형을 봤어요. 겁나 우락부락했어요.

포스에 눌려서 사진이나 싸인 요청을 못할정도로요.

실제로 다른분이 사진요청했는데 거절당하더군요. 연예인도 사생활이 중요하니깐 저는 이해할수있습니다!.

감사합니다. 좋은하루 보내세요 :)

안녕하세요. 일본여행 다녀온 진쓰입니다.

2박3일 오사카 여행 가기전 제가 준비했던 사항들에 대해 블로그 포스팅시작하겠습니다.

먼저 왜 아래의것들을 오사카 가기전 한국에서 미리 샀냐하면요, 무엇보다도 가격이 싸요.

또한, 심리적으로 미리 준비했기때문에 편하기도 하구요.

1. 심카드, 오사카 공항대비 7천원 쌈니다. 네이버 쇼핑에서 3기가 1만6천원 구입 하였습니다.

2. 라피트 (간사이->난바 특급열차), 3~4천원정도 더 싸요. 미리 라피트 타는방법 준비할 수 도 있구요.

3. 유니버셜 스튜디오 입장권 (유니버셜 현지에서 7200엔, 국내에서 65000원 주고 미리 구매했습니다.)

4. 유니버셜 스튜디오 익스프레스 4 티켓  (여행에서 시간은 금이니깐 익스프레스로 끊었습니다.)

5. 호텔예약 (이건 필수니깐요.)

1. 심카드

심카드는 네이버 쇼핑에서 가격비교해서 구매했습니다.

요즘은 14개국 지원 심카드, 이런식으로 팔더군요. 1만6천원정도에(택배비 별도) 구매했습니다.

LTE 3기가, 다쓰고 3g무료, 14일제한 이었습니다.

2. 라피트

간사이공항 -> 난바 로 가기위한 특급열차 티켓(왕복)을 구매하였습니다.

3~4천원정도 더 싸고, 열차로가나 라피트로가나 가격이 비슷하기 때문에 라피트를 끊어서 덴카차야 역까지 갔습니다.

이것 역시 네이버쇼핑몰, 관광업체를 통해 구매하였고, 간사이공항에서 티켓교환을 한 후 사용했습니다.

무척 쾌적하고 좋습니다.

3. 유니버셜 스튜디오 입장권

네이버 쇼핑몰에서 검색하여 가장 싼걸로 구매하였습니다.

오사카 유니버셜 현지에서 사는것보다 7천원정도 싸게 구매하였습니다.

6월 중순에갔을때 현지에서 7200옌에 팔고있었습니다.

4. 유니버셜 스튜디오 익스프레스 4티켓

빠른 놀이기구를 타기위해 익스프레스-4 티켓을 끊었습니다.

유니버셜 스튜디오 일본 공식홈페이지에 들어가셔서 구매하셔야 합니다. 

참고로 한국어 사이트에서는 여행사를 통해 구매하라고 되어있습니다. 

일본 사이트에서 구매하는 것 보다 좀더 비싸서 일본 공식홈페이지에서 구매했었습니다.

가격비교 잘해보시고 구매하세요.

5. 호텔예약

호텔스컴파인, 부킹닷컴에서 알아봤습니다.

아래와 같이 방모습을한 도미인 프리미엄 난바에서 묵었습니다.

가격은 2박3일 30만원(아침조식2회 포함) 정도 였었습니다.

2층에는 온천도 있고, 밤에 간식으로 라면도 먹을 수 있습니다.

조식도 맛있습니다. 단 하루 정도만 맛봐도 될것같습니다. 이틀째에는 약간 질렸습니다.

도톤보리와 가까워서, 왔다갔다하기 편하고, 오사카의 관광지와 가까워 위치상 좋습니다.

체크인은 오후3시, 체크아웃은 오전 11시였습니다.

저는 운이좋아서, 오후1시에 체크인하였습니다.(관광객이 체크아웃을 이른시간할 경우, 빠른 체크인 가능합니다.)

안녕하세요. 내일이면 일본여행가는 진쓰입니다.

자바스크립트 8장 내장객체 - String 객체의 속성과 메소드 포스팅 시작하겠습니다.

목차

1. string객체 특징

2. string객체 속성

3. string객체 메소드

1. string객체 특징

- 자바스크립트에서 문자열을 다루는 객체입니다.

문자열 객체 생성방법 2가지가 있습니다.

- 예)

 var str = new String(“Have a nice day!”)

 var str=“Have a nice day!”

2. string객체 속성

length : 문자열의 개수를 나타냅니다.

예)

- var str=“Nice to meet you!”

- cnt  = str.length

- document.write(cnt) == 17

3. string객체 메소드 들입니다.

.

감사합니다. 여러분도 어서 휴가가세요. :)