🎯 이번 시간 학습 목표
- ✅ Rails의 핵심 구성 요소인 라우팅(Routing), 컨트롤러(Controller), 뷰(View)의 역할을 이해합니다.
- ✅
config/routes.rb
파일을 통해 URL 요청을 컨트롤러 액션에 연결하는 방법을 배웁니다. - ✅
rails generate controller
명령어로 컨트롤러와 기본 뷰 파일을 생성합니다. - ✅ 컨트롤러 액션에서 뷰 템플릿(
.html.erb
)을 렌더링하는 과정을 실습합니다. - ✅ 간단한 '읽기(Read)' 기능을 구현하며 MVC 패턴의 흐름을 파악합니다.
- ✅ 웹 애플리케이션의 기본 기능인 CRUD(Create, Read, Update, Delete) 개념을 맛봅니다.
지난 시간에는 Rails의 MVC 패턴을 살짝 엿보고 첫 Rails 앱을 성공적으로 만들어 실행해봤죠? ✨ 이번 시간에는 그 빈 껍데기 앱에 생명을 불어넣는 방법을 배울 차례입니다! 바로 Rails의 핵심 삼총사, 라우팅(Routing), 컨트롤러(Controller), 뷰(View)를 직접 다루면서 사용자의 요청을 받아 화면에 원하는 내용을 보여주는 과정을 익힐 거예요. 🚀 웹 개발의 기본인 CRUD 개념도 살짝 맛볼 예정이니, 집중해서 따라와 주세요!
✨ 오늘 배울 내용 미리보기
개념/파일/명령어 | 설명 | 간단 예시 |
---|---|---|
config/routes.rb |
URL 요청과 컨트롤러 액션을 연결하는 지도 역할 | get '/hello', to: 'welcome#index' |
Controller |
사용자 요청을 받아 처리하고 응답(뷰)을 보내는 중간 관리자 | class WelcomeController < ApplicationController |
Controller Action |
컨트롤러 내에서 특정 요청을 처리하는 메소드 | def index ... end |
View (.html.erb) |
사용자에게 보여줄 HTML 문서를 만드는 템플릿 |
|
rails g controller [이름] [액션...] |
컨트롤러와 관련 파일(뷰, 헬퍼 등) 생성 명령어 | rails g controller Welcome index |
CRUD |
데이터 처리의 기본 작업 (Create, Read, Update, Delete) | 게시글 작성/조회/수정/삭제 기능 등 |
📌 rails g
는 rails generate
의 축약형입니다. 앞으로 자주 사용하게 될 거예요!
🗺️ 길 안내 전문가, 라우터 (config/routes.rb)
사용자가 웹사이트 주소(URL)를 입력하면, Rails 앱은 가장 먼저 어디로 가야 할지 알아야 합니다. 이 길 안내 역할을 하는 것이 바로 라우터(Router)입니다. 설정 파일은 config/routes.rb
에 있어요.
라우터는 특정 URL 요청이 들어왔을 때, 어떤 컨트롤러(Controller)의 어떤 액션(Action, 메소드)을 실행할지 연결해주는 역할을 합니다.
# config/routes.rb
Rails.application.routes.draw do
# 사용자가 웹사이트 루트(/)로 접속하면,
# pages 컨트롤러의 hello 액션을 실행하도록 변경해봅시다.
root "pages#hello" # 이전에는 주석처리 했었죠? 이제 풀어줍니다.
# 사용자가 '/hello' 경로로 GET 요청을 보내면,
# pages 컨트롤러의 hello 액션을 실행해라!
get '/hello', to: 'pages#hello' # 루트와 동일한 액션을 연결할 수도 있습니다.
# 만약 리소스를 다루는 경우 (예: 게시글), 이렇게 쓰면
# CRUD 관련 라우트가 자동으로 생성됩니다. (나중에 자세히!)
# resources :articles
end
위 예시처럼 get '/hello'
는 사용자가 `/hello`라는 주소로 접속했을 때 (HTTP GET 요청) 어떤 일을 할지 정의합니다. to: 'pages#hello'
는 `pages`라는 이름의 컨트롤러 안에 있는 `hello`라는 액션(메소드)을 실행하라는 의미입니다. `root "pages#hello"`는 웹사이트의 가장 기본 주소(예: `http://localhost:3000`)로 접속했을 때 `pages#hello` 액션을 실행하라는 뜻이에요. 쉽죠? 😉
👨💼 요청 처리반장, 컨트롤러 (app/controllers)
라우터가 길을 안내해주면, 그 요청을 실제로 받아서 처리하는 역할은 컨트롤러(Controller)가 담당합니다. 컨트롤러는 모델(데이터 담당, 나중에 배움)과 통신하거나, 어떤 뷰(화면)를 보여줄지 결정하는 중간 관리자예요.
컨트롤러는 app/controllers
폴더 안에 만들며, 보통 [이름]_controller.rb
형식의 파일명을 가집니다. (예: `pages_controller.rb`)
터미널에서 명령어를 사용해 컨트롤러를 쉽게 생성할 수 있습니다. `pages` 컨트롤러와 `hello` 액션을 만들어 볼까요? (이미 이전 단계에서 만들었다면 이 단계는 건너뛰거나, 다른 이름으로 연습해보세요!)
# 터미널에서 실행 (프로젝트 루트 폴더에서)
# 만약 pages 컨트롤러가 없다면 생성합니다.
# rails generate controller pages hello
# 또는 축약형: rails g controller pages hello
이 명령어를 실행하면 Rails가 자동으로 여러 파일을 만들어줍니다.
app/controllers/pages_controller.rb
: 컨트롤러 파일 생성app/views/pages/hello.html.erb
: `hello` 액션에 대응하는 뷰 파일 생성- 관련 테스트 파일, 헬퍼 파일 등도 함께 생성됩니다. (지금은 몰라도 괜찮아요!)
생성된 (또는 이미 있는) app/controllers/pages_controller.rb
파일을 열어보면 다음과 같이 코드가 작성되어 있을 거예요.
# app/controllers/pages_controller.rb
class PagesController < ApplicationController
def hello
# 이 액션이 실행될 때 수행할 코드를 여기에 작성합니다.
# 지금은 비어있지만, 나중에 데이터를 처리하는 코드가 들어갈 수 있습니다.
# 특별히 지정하지 않으면, Rails는 자동으로
# app/views/pages/hello.html.erb 파일을 찾아서 렌더링합니다.
# 만약 뷰에게 데이터를 전달하고 싶다면 인스턴스 변수(@)를 사용합니다.
@greeting = "안녕하세요, Rails의 세계에 오신 것을 환영합니다!"
@time = Time.now
end
# 다른 액션을 추가할 수도 있습니다. 예를 들어...
# def goodbye
# @message = "다음에 또 만나요!"
# end
# 이 액션을 사용하려면 routes.rb에 라우팅 설정이 필요합니다.
# 예: get '/goodbye', to: 'pages#goodbye'
# 그리고 app/views/pages/goodbye.html.erb 뷰 파일도 만들어야겠죠?
end
컨트롤러 클래스는 ApplicationController
를 상속받고, 그 안에 액션 이름과 동일한 메소드(def hello ... end
)를 정의합니다. 이 메소드 안에서 필요한 로직을 처리하고, 인스턴스 변수(@
로 시작하는 변수)를 사용해서 뷰 템플릿으로 데이터를 넘겨줄 수 있습니다.
🎨 사용자 얼굴 마담, 뷰 (app/views)
컨트롤러가 준비한 데이터를 가지고 사용자에게 실제로 보여줄 HTML 화면을 만드는 역할은 뷰(View)가 담당합니다. 뷰 파일은 app/views
폴더 안에 컨트롤러 이름과 같은 폴더를 만들고, 그 안에 액션 이름과 같은 파일명(.html.erb
확장자)으로 저장됩니다. (예: app/views/pages/hello.html.erb
)
.html.erb
파일은 HTML 코드 안에 루비 코드를 삽입할 수 있는 템플릿 파일입니다. ERB(Embedded Ruby)라고 불러요.
<%= ... %>
: 루비 코드의 실행 결과를 HTML에 출력합니다. (예:<%= @greeting %>
)<% ... %>
: 루비 코드를 실행만 하고 결과는 출력하지 않습니다. (예: 조건문, 반복문 등)
아까 rails g controller
명령어로 자동 생성된 (또는 이미 있는) app/views/pages/hello.html.erb
파일을 열어서 내용을 수정해 봅시다.
🎉 환영합니다! 🎉
이 페이지는 app/views/pages/hello.html.erb
에서 만들어졌어요.
<%= @greeting %>
현재 시간: <%= @time.strftime("%Y년 %m월 %d일 %H시 %M분 %S초") %>
<%# 루비 주석은 이렇게 작성합니다. %>
<% if @time.hour < 12 %>
좋은 아침입니다! ☀️ 오늘 하루도 힘차게 시작하세요!
<% elsif @time.hour < 18 %>
즐거운 오후 보내고 계신가요? ☕️ 잠시 쉬어가는 것도 좋아요.
<% else %>
편안한 저녁 시간 보내세요! 🌙 오늘 하루도 수고 많으셨습니다.
<% end %>
<%# link_to "다른 페이지로 가기", '/some_other_page' %>
이제 서버를 실행하고 (`bin/rails s`) 웹 브라우저에서 루트 주소 (`http://localhost:3000`) 또는 `/hello` 주소 (`http://localhost:3000/hello`)로 접속해보세요! 컨트롤러에서 정의한 `@greeting`과 `@time` 변수의 값이 ERB 문법에 따라 화면에 멋지게 출력되는 것을 확인할 수 있습니다. 🎉 시간대에 따라 다른 메시지가 나오는 것도 확인해보세요!
🛠️ CRUD 맛보기: 간단한 '읽기(Read)' 구현
우리는 방금 사용자의 URL 요청을 받아(라우팅
), 컨트롤러가 인사말과 현재 시간을 준비하고(컨트롤러
), 그 정보를 HTML 페이지로 보여주는(뷰
) 과정을 완성했습니다. 이것은 웹 애플리케이션의 가장 기본적인 기능 중 하나인 CRUD에서 읽기(Read) 작업을 수행한 것과 같습니다.
- Create: 새로운 데이터를 생성하는 것 (예: 새 게시글 작성)
- Read: 기존 데이터를 읽어서 보여주는 것 (예: 게시글 목록 보기, 특정 게시글 보기) ← 방금 우리가 한 것!
- Update: 기존 데이터를 수정하는 것 (예: 게시글 내용 변경)
- Delete: 기존 데이터를 삭제하는 것 (예: 게시글 삭제)
지금은 단순히 컨트롤러에서 준비한 내용을 보여주는 '읽기'만 구현했지만, 앞으로 모델(Model)과 데이터베이스(Database)를 배우게 되면 사용자가 입력한 데이터를 저장(Create)하고, 저장된 데이터를 수정(Update)하거나 삭제(Delete)하는 기능까지 모두 구현할 수 있게 됩니다.
🤔 웹 브라우저에No route matches [GET] "/원하는_경로"
오류가 뜨나요?이 오류는 브라우저가 요청한 URL에 해당하는 길 안내 정보(라우트)가
🤔 컨트롤러 생성 시config/routes.rb
파일에 정의되어 있지 않다는 의미입니다.config/routes.rb
파일을 열어 해당 경로에 대한 라우팅 설정 (예:get '/원하는_경로', to: '컨트롤러#액션'
)이 올바르게 되어 있는지 확인하고, 파일을 수정한 후에는 Rails 서버를 재시작(Ctrl+C 로 껐다가bin/rails s
로 다시 켜기)해야 적용될 수 있습니다.NameError: uninitialized constant ...Controller
오류가 보이나요?컨트롤러 파일명(예:
pages_controller.rb
)과 클래스명(예:PagesController
)이 Rails의 규칙(카멜 케이스, 마지막에 Controller 붙이기 등)에 맞게 작성되었는지 확인해보세요. 가장 좋은 방법은rails generate controller [이름]
명령어를 사용하여 Rails가 자동으로 파일을 생성하도록 하는 것입니다.
✨ MVC 흐름 파악 완료! ✨
훌륭합니다! 여러분은 오늘 Rails 애플리케이션의 핵심 작동 원리인 라우팅 → 컨트롤러 → 뷰의 흐름을 직접 경험하고 이해하셨습니다. 🎉 사용자의 요청이 어떤 과정을 거쳐 화면에 표시되는지 감을 잡으셨을 거예요. 그리고 웹 개발의 기본인 CRUD 개념도 살짝 엿보았습니다.
MVC 패턴과 이 흐름을 이해하는 것은 Rails 개발의 기초를 다지는 데 매우 중요합니다. 앞으로 더 복잡한 기능을 만들 때도 이 기본 구조 위에서 확장해나가게 될 거예요. 😉
다음 시간에는 웹 개발의 또 다른 축인 프론트엔드, 그중에서도 인기 있는 자바스크립트 라이브러리 **React**를 소개하고 Rails 프로젝트와 어떻게 통합하여 사용할 수 있는지 알아보겠습니다. 백엔드와 프론트엔드의 만남, 기대되지 않나요? 🚀 (다음 강의 예고: ⚛️ 2-1: React와 루비의 만남 - React 소개와 Rails 프로젝트에 통합하기)
'루비' 카테고리의 다른 글
⚛️ React와 루비의 만남 - React 소개와 Rails 프로젝트에 통합하기 (0) | 2025.04.01 |
---|---|
🔄 루비 문자열 최종장: slice(추출), to_i/to_f(숫자변환), concat(원본결합) 정복! (0) | 2025.04.01 |
루비 문자열 탐색: 포함(include?), 시작/끝(start_with?/end_with?), 특정 위치 접근([]) 완벽 가이드 (0) | 2025.03.31 |
루비 문자열 변환: upcase/downcase (대소문자 변경)와 strip (공백 제거) 마스터하기 (1) | 2025.03.31 |
루비 문자열 기초: 길이 확인(length), 비었는지 검사(empty?), 결합(+) 완벽 정리 (0) | 2025.03.31 |