React app을 생성하기 위해서는 아래 커맨드만 입력하면 자동으로 생성을 해준다. 

프로젝트를 처음 시작할때 생성하면, 최근 javascript features, development environment를 쉽게 설정할 수 있다. 


$ npm install -g create-react-app

$ create-react-app hello-world

$ cd hello-world

$ npm start


을 실행하면 웹페이지가 열리면서 프로젝트가 시작된다. 

javascript에서 package의 dependencies를 관리하기 위해서는 npm이 필요하지만, 

최근에는 yarn 이라는 package manager를 더 많이 사용한다. 

yarn에 대해서는 아래를 참고하면 된다. 간단하게 설명하면 npm보다 빠른게 장점이고, 설치하는 인터페이스가 잘되있다. 

npm이 답답해서 만든거라니까, 더 좋지 않을까 

https://code.facebook.com/posts/1840075619545360

yarn 설치하기 위해서는 아래와 같이 명령어를 입력하면 된다.


$ npm install -g yarn 



[참고]

https://facebook.github.io/react/docs/installation.html

https://code.facebook.com/posts/1840075619545360


들어가며

  mac에서scala를 설치하는 방법에 대해서 설명을 한다. scala는 java를 기반으로 해서 미리 java를 설치를 해야한다.  dependency를 위해 build tool로 gradle을 설치했다. 설치를 완료한 후에는 환경변수를 설정해주면 끝 

Java 설치하기

$ brew install cask install java

Scala 설치하기

$ brew install scala

Grade 설치하기

https://gradle.org/ 에서 다운로드가 가능하다.

$ unzip grade-3.1-all.zip

환경변수 세팅하기

~/.bash_profile에 아래와 같이 입력하자

export JAVA_HOME=<java_home_path>
export GRADLE_HOME=<gradle_home_path
export PATH=${PATH}:$JAVA_HOME/bin:$GRADLE_HOME/bin

추가를 완료 했으면 아래와 같이 실행하고 정확하게 환경변수가 설정이 되었는지 확인하면 된다.

$ source ~/.bash_profile

$ gradle -version

Git설치, 설정하는 방법과 저장소(Repository) 생성, 파일 저장소에 추가 및 커밋(commit)하는 방법

들어가며

  Git은 Linus Torvalds라는 Linux operation system을 구현한 분이 처음에 코드 관리를 위해 만든 툴입니다. linux가 오픈소스인건 누구나 아실텐데요. 이처럼 오픈 소스를 개발하기 위해서는 한 명이 아닌 여러명이 개발을 해야합니다. 여러명이 한 프로젝트를 개발한다? 협업을 하는 측면에서 바라본다면, 정말 어려운 문제입니다. 내가 수정한 부분이 다른 사람의 수정한 부분과 동일하면 충돌이 일어날 것이고, 버전 별로 관리를 하지 않는다면 언제까지 .bak파일을 만들거나 복사 붙여넣기를 할 수 없는 문제입니다. 이 처럼 한 프로젝트를 여러명이 동시에 개발할때 생기는 문제를 해결해 주고, 코드 관리를 해주는게 git이라고 할 수 있습니다. git은 누구나 사용할 수 있는  오픈소스 소프트웨어 이고, programming 버전관리와 코드의 변화과정을 히스토리화 해서 볼수 있습니다.


Git 설치하기

  Git을 시작하기 위해서는 git을 설치를 해야합니다. 대표적인 사이트는 여러곳이 있는데, 그 중에서도 가장 대중적으로 사용하는 github에 대해 설명을 해 드리겠습니다. 거의 모든 git repository를 제공하는 사이트가 git을 기반으로 동작하기 때문에 비슷하니 github에 대한 사용법을 이해하시면 다른 git 관련 사이트를 이용해도 문제가 없습니다. 여기서 만약에 private하게 소수만 무료로 사용하고 싶다면 (https://bitbucket.org/)을 추천해 드리겠습니다. 

  다운로드 받는 경로는 아래와 같습니다. 한곳은 github이고, 다른 한 곳은 git을 받는 사이트 입니다.

  • https://desktop.github.com/
  • https://git-scm.com/downloads

Git 설정하기

  git을 다운로드 받았다면 command에서 git의 버전을 확인 할 수 있습니다. (설치 유무를 일단 확인합시다.) 아래 처럼 global하게 내가 사용할 username과 useremail을 설정 할 수 있습니다. 여기에는 github아이디를 쓰시면 됩니다. 나중에 수정이 가능하고, 추가적으로 여러 유저를 추가가 가능합니다. 
$ git --version 
$ git config --global user.name "username"
$ git config --global user.email "useremail"

저장소(Repository) 만들기

  저장소(Repository)는 프로젝트의 폴더라고 생각하시면 됩니다. 이 폴더에는 내가 변경한 파일의 정보, 코드 정보가 저장되어 있습니다. 

  저장소를 만드는 방법은 나의 프로젝트 ROOT_PATH에서 git init을 하면 됩니다. 아래 예제는 banana 라는 프로젝트를 ROOT_PATH로 하는 git repository를 생성한 내용입니다. git status를 하시면 내가 생성한 repository의 변화를 확인하실 수 있습니다. 지금은 아직 초기의 프로젝트이기 때문에 아무런 내용이 없습니다. commit에 대한 내용은 뒤에서 설명하겠습니다.

$ mkdir banana
$ cd banana
$ git  init
# Initialized empty Git repository in /home/ubuntu/workspace/banana/.git/
$ git status

새로운 파일을 만들기

  Repository에 새로운 파일을 추가해보겠습니다. 평소에 좋아하시는 Editor를 통해 파일을 생성해 보세요. 저는 banana라는 내용을 readme.txt에 담아 생성을 했습니다. 

$ echo "banana" > readme.txt

add, commit - Repository에 파일 추가 하기

  여기서 git add와 git commit에 대해서 간단하게 설명을 하면, git add는 working directory에서 staging area라고 보내는 명령이고, git commit은 staging area에 있는 파일을 repository로 넣는 역할을 합니다. 즉 내가 만든 파일을 repository에 넣기 위해서는 add와 commit을 모두 해줘야 합니다. 

  파일을 commit을 하기 전에 위에서 언급한 git status를 해보도록 하겠습니다.



$ git status

  내가 추가한 readme.txt가 빨간색 글씨로 보이는걸 확인할 수 있습니다. add되지 않은 파일의 목록을 보여줍니다. (여기서 폴더 내의 모든 파일을 추가하기 위해서는 add 뒤에 파라미터로 파일 이름 대신 .을 넘기면 됩니다.)

$ git add readme.txt

내가 추가를 하게 되면 new file : readme.txt를 확인하실 수 있습니다.

$ git commit -m "your commit message"

커밋을 한 뒤에 git status를 통해 확인해 보면 readme.txt의 내용이 commit된 것을 확인 할 수 있습니다.


파일 내용 변경하기



  readme.txt.파일을 변경을 해보고 저장해보겠습니다. 이렇게 저장을 한 뒤에

$ git status

modified: readme.txt라는빨간색으로 보여지는 내용을 확인할 수 있습니다. 현재 readme.txt가 수정이 됬다 라는 말입니다. 어떤 내용이 수정되었는지 확인을 하고 싶으면

$ git diff

를 하시면 변화된 내용을 확인하실 수 있습니다. -BBanana가 제거되고, +change banana가 추가 되었다는 내용을 확인할 수 있습니다.

$ git commit -m "change banana message"


commit을 다시 하게 되면, 변경상태가 add하고, commit을 하라고 합니다.

$ git add . 
$ git commit -m ""
$ git status

하시면 변경된 내용이 commit 되었음을 확인 할 수 있습니다.

Git


Git은 Linus Torvalds라는 Linux operation system을 구현한 분이 처음에 코드 관리를 위해 만든 툴입니다. 누구나 사용할 수 있는  오픈소스 소프트웨어 입니다. 


Git 설치하기

programming 버전관리와 코드의 변화과정을 히스토리화 해서 볼수 있습니다.



https://desktop.github.com/

https://git-scm.com/downloads

을 통해 다운로드가 가능합니다. 

Git 설정하기

$ git --version 
$ git config --global user.name ""
$ git config --global user.email ""


Repositories

Repository는 프로젝트의 폴더라고 생각하시면 됩니다. 이 폴더에는 내가 변경한 파일 정보, 코드 정보가 저장되어 있습니다. 


저장소 만들기


저장소를 만드는 방법은 나의 프로젝트 ROOT_PATH에서  git init을 하면 됩니다. 아래 예제는 banana 라는 프로젝트를 ROOT_PATH로 하는 git repository를 생성한 내용입니다. git status를 하시면 내가 생성한 repository의 변화를 확인하실 수 있습니다. 지금은 아직 초기의 프로젝트이기 때문에 아무런 내용이 없습니다. commit에 대한 내용은 뒤에서 설명하겠습니다.


$ mkdir banana
$ cd banana
$ git  init
# Initialized empty Git repository in /home/ubuntu/workspace/banana/.git/
$ git status



새로운 파일을 만들기

Repository에 새로운 파일을 추가해보겠습니다. 평소에 좋아하시는 Editor를 통해 파일을 생성해 보세요. 

$ echo "banana" > readme.txt

add, commit - Repository에 파일 추가 하기


파일을 commit을 하기 전에 위에서 언급한 git status를 해보도록 하겠습니다.

$ git status


내가 추가한 readme.txt가 빨간색 글씨로 보이는걸 확인할 수 있습니다. commit한 내용이 없기 때문에 아무런 내용이 표시되지 않습니다. 여기서 폴더 내의 모든 파일을 추가하기 위해서는 add 뒤에 파라미터로 파일 이름 대신 .을 넘기면 됩니다.


$ git add readme.txt


내가 추가를 하게 되면 new file : readme.txt를 확인하실 수 있습니다. 

$ git commit -m "<message>"




readme.txt.파일을 변경을 해보고 저장해보겠습니다. 

이렇게 저장을 한 뒤에 


<pre><code class="bash">

$ git status

</code></pre>

modified: readme.txt라는 내용을 확인할 수 있습니다. 현재 readme.txt가 수정이 됬다 라는 말입니다. 어떤 내용이 수정되었는지 확인을 하고 싶으면


<pre><code class="bash">

$ git diff

</code></pre>

를 하시면 변화된 내용을 확인하실 수 있습니다. -BBanana가 제거되고, +change banana가 추가 되었다는 내용을 확인할 수 있습니다. 


만약 이 상태에서

<pre><code class="bash">

$ git commit -m "<your commit message>"

</code></pre>

commit을 다시 하게 되면, 변경상태가 add하고, commit을 하라고 합니다. 

<pre><code class="bash">

$ git add . 

$ git commit -m "<your commit message>"

$ git status

</code></pre>


하시면 변경된 내용이 commit 되었음을 확인 할 수 있습니다.



+ Recent posts