스터디 - 122

  1. 2016.11.27 버전 관리 시스템(VCS) Git 그리고 GitHub.
  2. 2015.03.02 자바스크립트를 통한 팝업창에서 부모창으로 데이터 주고받기
  3. 2015.02.15 천 단위 이상의 숫자에 자동으로 쉼표를 붙여주는 함수
  4. 2015.01.03 프리랜서 개발자들을 위한 웹/앱 개발 외주 관련(발주/수주) 사이트



최근 Git 을 이용해 온라인 스터디를 함께 하고 있는데 진행하면서 함께하는 내용을 공유할 예정입니다.





Git 과 같은 버전 관리 시스템은 예전에 다른 동료분들과 함께 프로젝트를 진행하면서 처음 사용을 했었다.

이론적인 부분을 공부하는 것도 좋아하는 편이라 한번 전반적인 부분에 대해서도 알아보는 것이 나쁘지 않은 시간이 될 듯 싶다.



 - 버전 관리 시스템(Version Control System; VCS)

말 그대로 파일의 변화를 저장하고 관리할 수 있는 시스템을 의미한다. 특히 변화가 자주 필요하고 각 변화간의 저장과 불러오기가 자주 필요해지는 개발 분야에서는 이 용도가 좀 더 의미있고 중요하게 사용된다.


시스템은 3가지 방식으로 이루어져 있다.

*로컬 버전 관리 (local Version Control System; LVCS)


*중앙 집중식 버전 관리 (Centralized Version Control System; CVCS)

 - `SVN(Subversion)` 은 여기에 속한다. 중앙 서버에 저장하고, 관리하고 내용을 보관한다. 중앙 서버에 100% 의존이기 때문에 중앙 서버에 문제가 생기면 관리 및 보관에도 문제가 생기며 원격으로 주고받던 모든 이용자들에게도 문제가 발생한다.


*분산 버전 관리 (Distributed Version Control System; DVCS)

 - `Git` 은 여기에 속한다. 중앙 시스템의 여러 단점을 커버하고 있다. 달리 분산되어 로컬과 원격 저장소를 가지고 있으며 다수의 사용자가 원격 저장소를 가지고 있다. 추가의 장점으로 스냅샷이라는 것이 존재하며 기존의 SVN 과 차원이 다른 브랜치를 활용하는 강력한 기능들이 많다. 그리고 이러한 원격 저장소로 우리는 Github, Bitbucket 등의 서비스를 이용하고 있다.


여기서 Git 은 리누스 토발즈가 기존의 버전 관리 시스템에 어려움을 겪고 리눅스 커널 관리를 위해 만든 오픈소스로 현재 모든 기업체가 Git 을 활용해 시스템 히스토리 등을 관리하고 있다.


*[작업] -> git add: [스테이지] -> git commit: [로컬 저장소] -> git push: [원격 저장소]

작업 내용이 업로드 되는 저장소는 위 과정과 같이 이루어진다.



 - 원격 저장소 서비스

처음 오픈소스를 이용하기 위해 Github 를 사용 했고, 스타트업 내에서 비공개 저장소를 위해 Bitbucket 을 사용했다. 그리고 현재는 GitLab 이라는 서비스를 사용하고 있다.


1. Github (https://github.com)

 - 가장 인기가 많은 원격 저장소이며 많은 연결되어진 서비스가 많다. UI 는 평범한 수준이며 개인적으로는 이용하기 편하다.


2. Bitbucket (https://bitbucket.org)

 - 비공개를 무료로 사용할 수 있다. (물론 제한적인 부분이 있음) 이거 아니였으면 안 썼다. UI 정말 별로.


3. GitLab (https://about.gitlab.com)

 - Lab 이라는 이름을 가지고 있는 것과 걸맞게 애초부터 UI/UX 와 내부 기술들이 단체를 위하여 만들어진 것 같은 느낌이 많이 든다. 여러 프로젝트와 저장소를 관리하기에도 편하다. 최근에는 투두리스트, 스케줄과 연결된 등등의 기능과 함께 새로운 것들이 계속해서 추가되고 있어 점점 맘에 들고 있다.



 - Git 과 함께 할 수 있는 것.

아무래도 이번 스터디는 Git-Github 를 활용하는 것이기에 Github 와 연관되어진 것들을 주로 확인해보겠다. 


1. GitHub

현재 여러 원격 저장소 상용 서비스 중 가장 활발하게 사용되고 있는 서비스 이다. 커뮤니티 서비스라고 봐도 될 정도로 여러 부분에서 가장 강력한 면모를 가지고 있으며 사용자들에게 제공되고 있는 컨텐츠 또한 가장 많다. 아쉬운 점은 비공개는 유료 정책으로 운영이 되고 있다는 점 밖에 없다. (대학생이라면 크레딧을 받아 사용할 수 있는 것으로 알고있다.)


나도 아직 GitHub 서비스 자체 (Bitbucket 과 GitLab 을 주로 사용.) 본격적으로 사용해본 적은 없다. 기타 오픈소스 또는 라이브러리 필요해 확인해본 적 말고는, 이번 시간을 통해 많은 이해를 높이고 싶다.

 

2. 데스크탑 용 프로그램. (https://desktop.github.com/)

Github 계정을 이용하여 연동되어진 프로젝트를 PC 프로그램에서 관리할 수 있다. 깃은 항상 터미널 환경에서만 사용해보고 PC 프로그램을 직접 사용해본 적은 없었다. 명령어에 익숙해지고난 이후로는 굳이 프로그램의 필요성을 느껴보지 못 했었다. 확실히 사용해보면 편하다는 말이 많다. 간단하게 둘러봤을 때는 가장 끌리는 점은 커밋 간의 차이를 보기가 좋다는 점이될 것 같다. (터미널에서는 `git diff` 를 이용한다.)


3. Git Book (https://www.gitbook.com)

GitBook 은 Git 과 마크다운을 이용해 말 그대로 책을 구축할 수 있는 서비ㅡ 이다. Node.js 로 만들어진 라이브러리로 GitHub 와 연동되어 구축해 사용할 수 있다. 이전부터 Git 과 연관된 페이지인데 상당히 문서를 보기 편하고 책과 같은 프레임으로 만들어져 매력이 느껴진 페이지가 많았다. 평소의 귀찮음으로 해당 부분에 대해서 별로 알아보지 못 했는데 이번 기회에 해당 스터디에서의 글과 함께 연재할 예정이다.


GitBook 에서 제공하는 템플릿으로는 일반 책, API 명세서, 지식 기반 등의 템플릿을 기본 제공하며 선택하면 무료로 구축할 수 있다. API 명세로 해보고 싶었지만 역시나 비공개는 유료 정책이기에 일반 책(BOOK & MANUAL) 템플릿으로 작성을 시작해볼 예정이다.


4. Git Blog (https://pages.github.com/)

GitHub Pages 라는 서비스를 활용해 말 그대로 블로그를 구축할 수 있는 서비스 이다. 직접 글을 올리고 관리할 수 있으며 GitHub 에서 무료로 호스팅을 도와주어 손쉽게 공개 웹페이지로 사용할 수 있다. GitHub 에서 제공하는 제작 도구로 쉽게 페이지를 만들어 공개하고 관리할 수 있다. 해당 기능을 이용하여 많은 사람들이 블로그로 운영하고 있다.


Git 은 기본 HTML 컨텐츠만 지원하지만 추가로 Jekyll 이라는 것을 이용하여 여러 블로그 기능과 템플릿을 사용하여 블로그를 꾸밀 수 있어 사용하는 추세가 늘고 있다.


이번에는 Git Book 과 Git Blog 를 직접 구축하지는 않았지만 바로 다음주에 걸쳐 구축 작업까지 해보고 게시글을 함께 게시할 예정이다.



 - 참고 스터디 링크.

*버전 관리란? (https://git-scm.com/book/ko/v1/시작하기-버전-관리란%3F)

*위키의 버전 관리 (https://ko.wikipedia.org/wiki/버전_관리)

*SVN 능력자를 위한 Git 개념 가이드 (http://www.slideshare.net/einsub/svn-git-17386752)

*버전관리를 들어본적 없는 사람들을 위한 DVCS - Git (http://www.slideshare.net/ibare/dvcs-git)

*GitHub, Bitbucket Pull Request 활용기 (http://readme.skplanet.com/?p=13300)

*GitBook Toolchain Documentation for Multi-Languages. (https://tinydew4.gitbooks.io/gitbook/content/ko/)




'스터디 > gIt' 카테고리의 다른 글

버전 관리 시스템(VCS) Git 그리고 GitHub.  (0) 2016.11.27
2016.11.27 04:26. RSS feed. Trackback 0 came from other blogs. Leave a Response.
Posted in 스터디/gIt. Top

댓글을 달아 주세요


최근 들어 자바스크립트와 제이쿼리를 사용을 요구하는 일이 처음부터 제대로 공부를 필요로 할 정도로(약간 짜증날 정도로...ㅎ..) 많아졌습니다. 백엔드에 주력을 함으로 HTML과 CSS에만 집중을 하고 그 외의 언어는 별로 공부를 하지 못 했었는데 Node.js 도 손을 건들어보면서 최근 관심을 가지기 시작했습니다.

그리고 무엇보다 자바스크립트가 언어의 최고봉으로서 자리를 만들어가고 있는 순간 공부하지 않으면 안되겠다 싶어 공부를 시작했습니다. 그리고 부모창과 팝업창 간의 데이터를 주고 받는 놈을 만들다가 자바스크립트를 사용했는데 애먹은 부분이 있었습니다.

일단 제 경우는 팝업창에서 부모창으로 데이터를 전달해줄 때 기본적으로 엘리먼트의 name, id을 중복 사용을 필요로 하는 방식의 PHP 환경이였습니다. (PHP-MySQL-mysql_fetch_array) 그러나 id 값은 중복으로 사용이 불가능하다는 점이 문제이기에 name 방식을 통해 배열값을 주고 받으려다가 모든 name이 값을 가지고 있다는 점 때문에 어떻게 해야할지 의문이였습니다.

더 찾아보다가 그냥 간단하게 인자를 전달해주는 방식으로 꼼수를 사용했습니다.
소스는 다음과 같습니다.

------------------------------------------------
-- test1.html ((부모))
<script>
var winObject = null;

(1)function popupWindow(){
var settings = 'toolbar=0,directories=0,status=no,menubar=0,scrollbars=yes,resizable=no,height=500,width=1000,left=0,top=0';
(1)winObject = window.open("test2.html", "test2", settings);
}

</script>


(2)<input type='text' id='charge' style='width:70px;' value='이름'/>

(1)<input type="button" value="조회" onclick="popupWindow();"/>

------------------------------------------------

-- test2.html ((자식))

<script>

(3)function submitCharge(val1){

(4)window.opener.document.getElementById("charge").value = val1;

(5)self.close();

}

</script>


(PHP 코드 부분은 간단하게 바꿔보았습니다)

$query = ...;

$result = ...;


while($row = mysql_fetch_array($result)){

echo "<input type='text' name='i_charge' value='$row[name]'/>

(6)<input type='button' value='선택' onclick='submitCharge('$row[name]');' />";

}

------------------------------------------------


(1). 부모에서 popupWindow() 함수를 통해 간단하게 팝업창을 열어주고 부모와 자식 관계를 만들어줍니다.

(2). 자식에서 데이터를 부모로 넘겨주면 작성이 되어질 부분을 만들어놓습니다.


(3). submitCharge() 라는 함수를 만들어놓고 인자를 하나 받아옵니다.

(4). 받아오는 인자는 부모에서 'charge' 라는 id 값을 가지고 있는 엘리먼트에 값을 전송합니다.

(5). 과정이 끝나고 자식창을 직접 셀프 종료합니다.

(6). 함수를 호출하며 인자로 해당 값을 보내줍니다.


위의 과정을 통해 자바스크립트를 이용해 배열도 작성이 되어 있는 부분에서 해당 값을 자식에서 부모로 전달해줍니다.

응용을 하면 마찬가지로 부모에서 자식으로 데이터를 전달해주는 부분도 쉽게 개발이 가능합니다.





window.opener.document.getElementById("charge").value 이 부분에서 혹여나 name 에 해당하는 값을 불러오고 싶으시다면

window.opener.document.getElementsByName("charge").value 왼쪽과 같이 사용하시면 됩니다!


이 부분에서 저만 애를 먹은건지, 다른 분들도 애를 먹으셨던건지...더 좋은 방법이 있으면 공유해주시면 감사하겠습니다!


js, jquery 'opener' 관련 함수 - http://wendy81.tistory.com/160

html 'id', 'name' 관련 내용 - http://lucetedaniel.tistory.com/69


열공 :)

2015.03.02 23:06. RSS feed. Trackback 0 came from other blogs. Leave a Response.
Posted in 스터디/javascript. Top

댓글을 달아 주세요


가끔 숫자를 계산하는 놈을 만들때 천 단위 이상의 숫자에 쉼표를 붙여주는 작업이 매우 귀찮았었는데

찾아보니 number_format() 함수가 있습니다. 사용법도 매우 간단합니다.


// num = 7503600

$num = number_format($num);

echo $num 

==> 7,503,600


반대로 천 단위 이상의 숫자에 쉼표가 있을때 쉼표를 지워줘야 하는 경우도 매우 간단하며,

이 경우에는 문자열 관련 함수를 이용할 수 있습니다.


$num = str_replace(',' '', $num); // 1. Target 2. Replace 3. Content

echo $num;


Number_format 함수에 대한 자세한 설명은 다음으로

1) http://php.net/number_format

2) http://www.w3schools.com/php/func_string_number_format.asp

2015.02.15 18:01. RSS feed. Trackback 0 came from other blogs. Leave a Response.
Posted in 스터디/php. Top

댓글을 달아 주세요


요새 여러가지 웹 관련 외주를 받아 프로젝트를 여러가지 진행하고 있습니다. 약간 너무 많이 혼잡하게 많이 하는게 아니냐 하시는 분들이 계실수도 있지만 에버노트를 통해 일정과 계획, 프로세스 정리만 깔끔하게 한다면 여러가지 진행하는데도 불구하고 문제없이 진행할 수 있습니다.


그와 관련된 일정 혹은 진행 관련해서 내용 정리를 하는 내용은 다음 기회에 포스팅 하도록 하겠습니다.


외주는 보통 대다수가 지인을 통해 프로젝트를 가져오고는 하는데 최근에는 외주를 원하는 프리랜서 개발자와 외주를 맡기고자 하는 업체 혹은 개인과 연결해주는 플랫폼 홈페이지를 운영하는 업체들이 인기입니다.


1. 위시켓 (http://www.wishket.com/)


2. 프리모아 (http://freemoa.net/)


3. 크몽 (http://kmong.com/)





위시켓이 가장 뜨고 있는 관련 플랫폼인것 같습니다, 실제로 저 또한 위시켓에서 가장 많이 의뢰를 받고 진행을 하고 있습니다. 크몽의 경우에는 약간 좀 더 개발자, 디자이너, 기획자들의 입장에서 만들어진 사이트로 무게감이 위시켓이나 프리모아에 비해 가벼우며 실제로도 가벼운 프로젝트들이 많습니다. 크몽 홈페이지에 접속해 '도와주세요' 메뉴에 접속하면 다른 사람들이 프로젝트를 맡기는 서비스를 실제로 이용할 수 있습니다.


위와 같은 서비스들은 '의뢰인' 들의 안전을 보장해주고자 하는 목적으로 만들어졌으며 (물론 100% 는 아니지만) 첫 프로젝트 미팅에 함께해 정상적인 협의점을 잡도록 도움을 주는 서비스가 주 서비스 입니다. 그 외에 파트너스라는 서비스를 이용하기는 하지만 그에 대한 내용은 뭐라고 설명을 해야할....홈페이지에서(업체에서) 정식으로 정보를 제공해주는 인증된 프리랜서(?) 정도로 이해하면 될 것 같습니다.


프리랜서들에게 단점은 개발금액이 프로젝트가 완성되어야지만 그 후에 개발자에게 처리가 된다는 건데 그 점을 제외하고는 만족스럽습니다. 또 위시켓의 경우는 수수료를 개발자가 지불해야된다는 점이 정말 큰 단점인데 프리모아, 크몽은 어떤식으로 처리 하는지 모르겠네요. 최근 많은 스타트업들이 점점 생겨나면서 외주 건이 더 많아지고 있는데 위와 같은 서비스들의 이용으로 양쪽 모두가 별탈없이 좋은 프로젝트들이 많이 진행되었으면 합니다.


(혹시나 그 외에 바로 프리랜서와 연결하고 싶으신 분들은 저에게 연락 주시면 됩니다~~~~

디자이너와 안드로이드 개발자가 추가로 함께 하고 있으니 웹 개발 외주, 앱 개발 외주 서슴치 말고 연락 주시면 됩니다.

xodnr631@gmail.com)



2015.01.03 03:50. RSS feed. Trackback 0 came from other blogs. Leave a Response.
Posted in 스터디/programming. Top

댓글을 달아 주세요