본문 바로가기
입문자용 프로그래밍/Ruby On Rails

[Ruby on Rails 강좌] 1-2. 한 페이지짜리 웹, 무에서 배포까지 - rails 설치하기

by 개발과디자인 2016. 1. 29.

2016/01/29 - [입문자용 프로그래밍/Ruby On Rails] - [Ruby on Rails 강좌] 1-1. 한 페이지짜리 웹, 무에서 배포까지 - 기본세팅

본 게시물은 영문의 레일즈튜토리얼(http://railstutorial.org) 내용을 바탕으로 하며, 해당 내용을 그대로 번역한 포스팅이 아니라 입문자의 이해를 위해 생소한 개념에 대한 설명을 일부 추가하고 복잡한 내용은 간추리거나 제거한 포스팅임을 알려드립니다.

인트로

이번 포스팅은 개발플랫폼인 Cloud9에 Rails라는 Ruby의 웹 프레임워크를 구축하여 본격적인 개발환경을 구축하겠습니다. 또한 개발플랫폼 내에서 이뤄지는 기본적인 명령어에 대해 숙지하도록 하겠습니다. 매우 간단한 내용이니 천천히 이해하시면서 따라오시면 됩니다.

개발플랫폼의 조작

Cloud9에 접속, 생성한 프로젝트를 Open하여 다음과 같은 화면에 접속하겠습니다.

하단의 Command-line이 보이시나요? 이부분에 다음과 같이 치겠습니다.

   username:~/workspace (master) $ ls
현재 폴더의 파일리스트를 보여줘(ls)
README.md* html/ node.js/ php/ python/ ruby/
현재폴더는 ~/workspace/ 이고 그 폴더 안에는 README.md* 와 html, node.js, python, ruby라는 폴더가 있다는 것입니다.

여러분들의 화면에는 username 대신 자신의 닉네임이 있을 것입니다(메일에 따라 자동생성됩니다). 그리고 ~/workspace란 부분은 현재 명령어를 치는 곳의 경로입니다. 명령어를 칠때는 현재 폴더가 어디인지도 매우 중요합니다. (master)라는 부분은 추후에 설명하도록 하겠습니다. $라는 부분은 따로 안치셔도 되는 부분입니다. 또한 하단에 결과부분을 회색으로 처리했는데 실제 화면에서는 색자체는 다를것입니다.

노란 박스는 치고있는 명령어가 어떤 역할을 하는지 알기 쉽도록 해석하여 설명하는 역할을 합니다. 앞으로 Command-line을 작성할때는 위와같은 형식으로 작성하겠으니 참고하시면 되겠습니다.

현재 경로가 ~/workspace라고 하였는데 다음과 같이 쳐보겠습니다.

   username:~/workspace (master) $ cd ../
현재폴더의 상위폴더(../)로 이동해라(cd)
   username:~ (master) $ cd ../

감이 오시나요? 다음 Line에서는 상위폴더로 이동하게 되어 workspace가 지워졌습니다.

상위폴더로 이동을 하였으니 다시 파일 리스트를 호출한다면 그 중 workspace라는 폴더가 있겟지요?

   username:~ (master) $ ls
현재 폴더의 파일리스트를 보여줘(ls)
lib/ workspace/
다행스럽게도 하위폴더 목록 중 workspace가 보입니다.

이제 현재 폴더 ~(home를 의미합니다)에서 rails를 설치해 보도록 하겠습니다.

Rails 설치

하단의 명령어를 입력합니다.

   username:~ (master) $ gem install rails -v 4.2.2
rails라는 패키지(gem)을 버젼(-v) 4.2.2로 설치해줘(install)
.
.
Fetching: rails-4.2.2.gem (100%)
Successfully installed rails-4.2.2
9 gems installed

굉장히 긴 출력값이 나오고 성공적으로 설치했다고 뜹니다.

Gem이라는 것은 Ruby의 기능을 패키지로 제공하는 것인데 웹사이트 혹은 프로그램을 구축할 때 원하는 Gem을 가져다 쓰면 됩니다. 우리는 Rails라는 Gem이 필요하여 이것을 사용할 수 있도록 설치한 것입니다.

하지만 우리 개인컴퓨터에 워드같은 프로그램을 깔았다고 해서 문서가 생성된것이 아닌 것처럼 Rails를 설치했다고 해서 Rails로 이루어진 App은 생성되지 않았습니다.(App이란 개념은 통상적으로 스마트폰의 어플로 많이 쓰이지만 앞으로의 포스팅에선 Application 자체의 의미로 쓰겠습니다.)

우리는 연습용 App을 workspace라는 폴더에 만들어 잡업해볼 것입니다. 그렇다면 다시 workspace로 이동하기 어떤 명령어를 쳐야할까요?

   username:~ (master) $ cd workspace
현재폴더의 하위폴더인 workspace로 이동해라(cd)
   username:~/workspace  (master) $

* cd w 까지만 입력하신 후 Tap키를 누르시면 현재 폴더의 파일이름 중 적절한 것으로 자동완성이 됩니다 !!

이제 다시 workspace폴더에 들어왔고 해당 폴더에 Rails를 이용한 hello_app을 만들겠습니다.

   username:~/workspace (master) $ rails _4.2.2_ new hello_app
hello_app라는 이름으로 rails의 4.2.2 버젼(rails _4.2.2_)으로 새로운 App을 만들어라(new)
.
.
      create vendor/assets/stylesheets/.keep
      run bundle install
.
.
Installing turbolinks 2.5.3
Installing uglifier 2.7.2
Installing web-console 2.3.0
Bundle complete! 12 Gemfile dependencies, 54 gems now installed.
Use `bundle show [gemname]` to see where a bundled gem is installed.
Post-install message from rdoc:
Depending on your version of ruby, you may need to install ruby rdoc/ri data:

<= 1.8.6 : unsupported
= 1.8.7 : gem install rdoc-data; rdoc-data --install
= 1.9.1 : gem install rdoc-data; rdoc-data --install
>= 1.9.2 : nothing to do! Yay!
      run bundle exec spring binstub --all
* bin/rake: spring inserted
* bin/rails: spring inserted

hello_app이 정상적으로 생성되었습니다. run bundle install 이라는 문구가 뜬 후에는 시간이 다소 걸립니다.

왼쪽의 Navigator를 확인해보면

위와 같이 hello_app이 생성된 것을 확인할 수 있고 화살표를 누르면 그 안에 파일들이 생성되있는 것들을 볼 수 있습니다.

hello_app만 만들었는데 왜 파일들이 있을까요?
우리는 Rails라는 프레임워크로 이루어진 hello_app을 만들었기 때문입니다. 프레임워크는 뼈대와 같은 것이라고 했었는데요, 즉 초기에 구성되어있는 파일들이 각각의 역할이 주어져있는 뼈대라는 것입니다. 또한 이 뼈대는 MVC 모델을 기반으로 합니다.

MVC 모델
MVC는 Model-View-Controller의 약자입니다. Model은 데이터베이스에 접근하여 데이터를 호출, 저장 하는 역할을 합니다. View는 서비스 이용자가 홈페이지에 들어왔을때 보이는 모든 시각적인 요소에 해당합니다. 즉 데이터를 어떻게 이쁘게 뿌려주냐를 설정하는 역할입니다. Controller는 Model에서 얻은 데이터와 View에서 얻은 시각적 양식을 연결시켜 주고 페이지들의 컨트롤 요소를 담당합니다.
이렇게 각각의 역할을 나누어 모델이론은 실제로 웹사이트를 구축하는데 큰 기반이 됩니다. 프로그래머들과 디자이너들이 각자 자신의 뚜렷한 역할에 집중할 수 있는 협업이 가능하게 되기 때문입니다.


이번 포스팅은 이까지입니다. 드디어 웹사이트의 기반이 될만한 App을 만들었습니다. 다음 포스팅은 App에 hello world라는 문구를 띄울 수 있는 페이지를 만들어 보겠습니다.