티스토리 뷰
Ruby on Rails : devise 한글번역 + 'Time-Ago 번역' [Gem : devise-i18n]
나른한 하루 2019. 11. 3. 23:25해당 글은 https://blog.naver.com/kbs4674/221041391645 로 부터 게시글이 이전되었습니다.
참고
1. Gem : Devise를 이미 사용하고 있다는 가정하에 이 글을 작성합니다!
※ devise Gem 설치법 [클릭]
Devise Gem을 설치하신 분들은, 다른건 만족스러운데 중간에 저렇게 영어로 나오는 오류메세지가 많이 걸리적거릴겁니다.
처음에 저도 저 오류메세지 부분을 수정할려고 devise 관련 모든 파일을 찾아보는데... 어디에도 안나오더라고요..
좀 알아보니, 이런 오류메세지에 대해 쉽게 수정하면서도 devise에 대해 번역을 시켜주는 gem이 있다는 것을 알게됩니다.
오늘은 devise 번역 gem 적용법에 대해 알아보겠습니다.
-
devise-i18n 사용
1. Gemfile 에 다음 Gem을 추가시켜줍니다.
gem 'devise-i18n'그리고 Gem을 설치해줍니다.
bundle install
2. config/application.rb 파일을 열람 후, 다음 문구들을 추가합니다.
config.i18n.default_locale = :ko
config.time_zone = 'Seoul'적용 예시
## config/application.yml
... 내용 생략 ...
class Application < Rails::Application
config.load_defaults 5.2
config.i18n.default_locale = :ko
config.time_zone = 'Seoul'
end
3. 터미널에 다음 내용을 입력합니다.
rails g devise:i18n:locale ko그러면 config/locals 폴더에 devise.views.ko.yml 파일이 생성된게 확인됩니다.
해당 파일에 Devise의 각종 메세지 내용이 한글로 번역되어 있습니다.
5.
주의 5번과정은 view html 파일 내 코드를 바꾸는겁니다.
만약 사전에 Devise View 파일에 대해 코드를 수정작업 하신분은 조심하세요.
이어서 명령어 입력창(터미널)에 다음 명령어도 입력해주세요.
rails g devise:i18n:views번역에 특화된 View 파일이 생성되는게 확인될겁니다.
참고 만약 이미 Devise View파일이 있다보니, Conflict 에러가 생겼으나, 덮어씌어도 된다면 y+엔터 로 덮어씌어서 생성해주세요.
6. 서버를 껏다 켜주세요.
7. 이제 한글화 적용이 되었습니다!
-
Time-Ago 번역 적용
'x일 전' 과 같은 방식의 시간 표기에 있어 Ago 방식은 Rails에서 기본 함수를 지원해줍니다.
1. ago 방식이 나타나길 원하는 '시간영역'에서 다음 함수를 사용해주면 됩니다.
# <%= "#{time_ago_in_words(게시글_작성시간_정보를_가져오는_함수명.created_at)} 전" %>
<%= "#{time_ago_in_words(post.created_at)} 전" %>
2. Ago 방식이 우선 우선 기본적으로 영어 혹은 에러가 표시될겁니다.
3. 혹시 오류메세지가 아닌 영어로 보이시는 분은 config/application.rb 파일을 열람 후, 다음 문구들을 추가합니다.
config.i18n.default_locale = :ko
config.time_zone = 'Seoul'적용 예시
## config/application.yml
... 내용 생략 ...
class Application < Rails::Application
config.load_defaults 5.2
config.i18n.default_locale = :ko
config.time_zone = 'Seoul'
end
4. config/locals/ 에서 time.ko.yml 파일을 생성 후, 다음 내용을 입력해주세요.
ko:
activerecord:
errors:
messages:
record_invalid: 데이터 검증에 실패하였습니다. %{errors}
date:
abbr_day_names:
- 일
- 월
- 화
- 수
- 목
- 금
- 토
abbr_month_names:
-
- 1월
- 2월
- 3월
- 4월
- 5월
- 6월
- 7월
- 8월
- 9월
- 10월
- 11월
- 12월
day_names:
- 일요일
- 월요일
- 화요일
- 수요일
- 목요일
- 금요일
- 토요일
formats:
default: "%Y/%m/%d"
long: "%Y년 %m월 %d일 (%a)"
short: "%m/%d"
month_names:
-
- 1월
- 2월
- 3월
- 4월
- 5월
- 6월
- 7월
- 8월
- 9월
- 10월
- 11월
- 12월
order:
- :year
- :month
- :day
datetime:
distance_in_words:
about_x_hours:
one: 약 한 시간
other: 약 %{count}시간
about_x_months:
one: 약 한 달
other: 약 %{count}달
about_x_years:
one: 약 일 년
other: 약 %{count}년
almost_x_years:
one: 일 년 이하
other: "%{count}년 이하"
half_a_minute: 30초
less_than_x_minutes:
one: 방금
other: "%{count}분 이하"
less_than_x_seconds:
one: 일 초 이하
other: "%{count}초 이하"
over_x_years:
one: 일 년 이상
other: "%{count}년 이상"
x_days:
one: 하루
other: "%{count}일"
x_minutes:
one: 일 분
other: "%{count}분"
x_months:
one: 한 달
other: "%{count}달"
x_seconds:
one: 일 초
other: "%{count}초"
prompts:
day: 일
hour: 시
minute: 분
month: 월
second: 초
year: 년
errors:
format: "%{message}"
messages:
accepted: "%{attribute}을(를) 반드시 확인해야 합니다"
blank: "%{attribute}에 내용을 입력해 주세요"
confirmation: "%{attribute}은(는) 서로 일치해야 합니다"
empty: "%{attribute}에 내용을 입력해 주세요"
equal_to: "%{attribute}은(는) %{count}과 같아야 합니다"
even: "%{attribute}에 짝수를 입력해 주세요"
exclusion: "%{attribute}은(는) 이미 예약되어 있는 값입니다"
greater_than: "%{attribute}은(는) %{count}보다 커야 합니다"
greater_than_or_equal_to: "%{attribute}은(는) %{count}보다 크거야 같아야 합니다"
inclusion: "%{attribute}은(는) 목록에 포함되어 있는 값이 아닙니다"
invalid: "%{attribute}은(는) 올바르지 않은 값입니다"
less_than: "%{attribute}은(는) %{count}보다 작아야 합니다"
less_than_or_equal_to: "%{attribute}은(는) %{count}과 작거나 같아야 합니다"
not_a_number: "%{attribute}에 숫자를 입력해 주세요"
not_an_integer: "%{attribute}에 정수를 입력해 주세요"
odd: "%{attribute}에 홀수를 입력해 주세요"
taken: "%{attribute}은(는) 이미 존재합니다"
too_long: "%{attribute}은(는) %{count}자를 넘을 수 없습니다"
too_short: "%{attribute}은(는) 적어도 %{count}자를 넘어야 합니다"
wrong_length: "%{attribute}은(는) %{count}자여야 합니다"
template:
body: '아래 문제를 확인해 주세요.'
header:
one: 한 개의 오류로 인해 %{model}을(를) 저장할 수 없습니다
other: "%{count}개의 오류로 인해 %{model}을(를) 저장할 수 없습니다"
helpers:
select:
prompt: 선택해주세요
submit:
create: 등록
submit: 제출
update: 수정
number:
currency:
format:
delimiter: ","
format: "%n%u"
precision: 0
separator: "."
significant: false
strip_insignificant_zeros: false
unit: 원
format:
delimiter: ","
precision: 3
separator: "."
significant: false
strip_insignificant_zeros: false
human:
decimal_units:
format: "%n%u"
units:
billion: 십억
million: 백만
quadrillion: 경
thousand: 천
trillion: 조
unit: ''
format:
delimiter: ''
precision: 3
significant: true
strip_insignificant_zeros: true
storage_units:
format: "%n%u"
units:
byte: 바이트
gb: 기가바이트
kb: 킬로바이트
mb: 메가바이트
tb: 테라바이트
percentage:
format:
delimiter: ''
precision:
format:
delimiter: ''
support:
array:
last_word_connector: ", "
two_words_connector: '와(과) '
words_connector: ", "
time:
am: 오전
formats:
default: "%Y/%m/%d %H:%M:%S"
long: "%Y년 %m월 %d일, %H시 %M분 %S초 %Z"
short: "%y/%m/%d %H:%M"
pm: 오후5. 완료입니다!
- config/locals 파일 정리
1) locals 파일 개념
config/locals 파일은 config/application.rb 에 설정된 국가에 따라 번역이 되어서 보여지는 역할로서 쓰인다고 볼 수 있습니다.
예를들어, i18n이 적용된 Devise View 파일에서
## app/views/devise/sessions/new.html.erb
<h2><%= t(".sign_in") %></h2>
... 코드 생략 ...
<div class="form-actions">
<%= f.button :submit, t(".sign_in") %>
</div>
<% end %>위 파일을 보면 중간에
t.(".sign_in")이 코드가 보입니다.
해당 코드의 자리에 config/locals 에서 번역된 문장이 들어가는 자리라고 보면 됩니다.
2) locals 파일 이름 및 문법
locals 파일 이름은 아무렇게나 지어도 상관이 없습니다.
하지만 내부 코드에 있어 명칭 및 탭(Tap)처리에 대해선 규칙이 엄격하므로, 사용에 있어 참고바랍니다.
3) i18n 국가 설정
i18n 번역에 있어, 국가설정을 하는 곳은 config/application.rb 입니다.
config.i18n.default_locale = :ko위 코드에서 확인했다 싶이 대한한국 코드명은 ko입니다.
- 자료 참고
1. Github - devise-i18n [클릭]
2. Github - devise-i18n 한글번역 [클릭]
3. Github - devise-i18n 위키 [클릭]
4. 팀원의 조언 : L.G.S, K.S.H 형..
루비온 레일즈 Ruby on Rails ROR
'프로그래밍 공부 > Ruby on Rails : Gem' 카테고리의 다른 글
| Ruby on Rails : Devise에 닉네임, 오늘의 한마디 기능 넣기 (0) | 2019.11.04 |
|---|---|
| Ruby on Rails : Devise 문제 이슈 및 해결방안 (게시글을 쓰고 회원탈퇴를 한다면..?) (2) | 2019.11.04 |
| Ruby on Rails : 로그인/회원가입 [Gem : devise] (0) | 2019.11.03 |
| Ruby on Rails : 코드/계정 보안을 위한 Gem [Gem : Figaro] (0) | 2019.11.03 |
| Ruby on Rails : 게시판 텍스트 편집기 (TinyMCE) + AWS S3 이미지 업로드 연동 [Gem : TinyMCE, carrierwave, fog, ...] (2) | 2019.11.03 |
