Ruby on Rails 보기 모드 및 역모드

Ruby on Rails Patterns and Anti-Patterns series의 세 번째 부분으로 돌아온 것을 환영합니다.이전 문장에서 우리는 모델과
역모드, Rails 모델과 관련된 역모드.이 문서에서는 Rails 뷰와 관련된 몇 가지 모드와 반전 모드를 소개합니다.
Rails 보기는 때로는 완벽하고 빠르게 작동할 수 있지만, 다른 때에는 여러 가지 문제가 있을 수 있다.
만약 당신이 자신의 관점을 어떻게 처리하는지에 대한 자신감을 높이고 싶거나, 단지 이 화제에 대한 정보를 더 알고 싶을 뿐이라면, 이 블로그는 당신을 위해 준비한 것이다.그냥 뛰어들래요.
Rails 프레임워크는 구성이 아닌 규칙을 따른다는 것을 알 수 있습니다.Rails는 Model-View-Controller(MVC) 모드에서 매우 중요하기 때문에 이 격언은 당연히 보기 코드에도 적용된다.여기에는 태그(ERB 또는 슬림 파일), JavaScript 및 CSS 파일이 포함됩니다.언뜻 보기에, 당신은 시각층이 매우 간단명료하다고 생각할 수 있지만, 현재 시각층에 여러 가지 기술이 존재한다는 것을 명심하십시오.
뷰에서 JavaScript, HTML 및 CSS를 사용합니다.이 세 가지 상황은 코드의 혼란과 혼란을 초래할 수 있어 장기적으로 보면 큰 의미가 없다.다행히도 오늘 우리는 Rails 뷰 레이어의 흔한 문제와 해결 방안을 토론할 것이다.

파워 리프트 뷰

이것은 자주 발생하지 않는 잘못이지만, 일단 발생하면, 그것은 눈엣가시가 될 것이다.때때로 사람들은 역 논리나 조회를 보기에 직접 두는 경향이 있다.이렇게 하면 뷰 레이어가 무겁거나 강력하게 향상됩니다.흥미로운 것은 레일스가 실제로 이런 상황이 쉽게 발생할 수 있도록 허락했다는 점이다.
이 문제에 있어서 안전망이 없으면, 당신은 보기 층에서 당신이 하고 싶은 일을 할 수 있습니다.
정의에 따라 MVC 모드의 뷰 레이어에는 표현 논리가 포함되어야 합니다.그것은 역 논리나 조회 데이터에 시달려서는 안 된다.Rails에서는 Ruby 코드를 작성할 수 있는 ERB 파일(내장 Ruby)을 사용할 수 있습니다.
그런 다음 HTML로 계산합니다.만약 우리가 색인 페이지에 노래를 열거한 사이트의 예를 고려한다면, 보기 논리는 app/views/songs/index.html.erb에 있을 것이다.
'힘의 향상'의 의미와 무엇을 하지 않는지 설명하기 위해 다음과 같은 예를 살펴보자.

# app/views/songs/index.html.erb

<div class="songs">
  <% Song.where(published: true).order(:title) do |song| %>
    <section id="song_<%= song.id %>">
      <span><%= song.title %></span>

      <span><%= song.description %></span>

      <a href="<%= song.download_url %>">Download</a>
    </section>
  <% end %>
</div>

커다란 반모드는 표시에서 노래를 얻는 것이다.데이터를 얻는 책임은 컨트롤러나 컨트롤러에서 호출되는 서비스에 위탁해야 한다.나는 때때로 사람들이 컨트롤러에 데이터를 준비하고 보기에서 더 많은 데이터를 얻는 것을 볼 수 있다.이것
엉망진창인 디자인이다. 그것은 당신의 사이트를 느리게 할 것이다. 왜냐하면 당신은
더욱 빈번하게 조회를 사용하여 데이터베이스의 압력을 가중시키다.
다음과 같이 컨트롤러 작업에서 인스턴스 변수 @songs을 공개하고 태그에서 호출해야 합니다.

class SongsController < ApplicationController
  ...

  def index
    @songs = Song.all.where(published: true).order(:title)
  end

  ...
end

# app/views/songs/index.html.erb

<div class="songs">
  <% @songs.each do |song| %>
    <section id="song_<%= song.id %>">
      <span><%= song.title %></span>

      <span><%= song.description %></span>

      <a href="<%= song.download_url %>">Download</a>
    </section>
  <% end %>
</div>

이 예들은 완벽하지 않다.SQL 스파게티를 사용하지 않고 컨트롤러 코드를 읽을 수 있도록 하려면 previous blog post을 확인하는 것이 좋습니다.
또한 뷰 레이어를 무시하면 로직이 증가합니다.
다른 사람들은 이를 바탕으로 해결 방안을 구축하려고 시도할 가능성이 있다.

Rails에서 제공하는 기능 활용

우리는 이곳에서 간단명료함을 유지할 것이다.Ruby on Rails는 프레임워크로서 특히 뷰 내부에서 많은 간결한 도우미를 제공합니다.이 예쁜 조수들은 너로 하여금 신속하고 가볍게 시청층을 구축할 수 있게 한다.Rails의 초보자로서
다음과 같이 ERb 파일의 전체 HTML을 작성할 수 있습니다.

# app/views/songs/new.html.erb

<form action="/songs" method="post">
  <div class="field">
    <label for="song_title">Title</label>
    <input type="text" name="song[title]" id="song_title">
  </div>

  <div class="field">
    <label for="song_description">Description</label>
    <textarea name="song[description]" id="song_description"></textarea>
  </div>

  <div class="field">
    <label for="song_download_url">Download URL</label>
    <textarea name="song[download_url]" id="song_download_url"></textarea>
  </div>

  <input type="submit" name="commit" value="Create Song">
</form>

이 HTML이 있으면 다음 캡처와 같이 좋은 신곡 리스트를 얻을 수 있을 것이다.

그러나, Rails가 있으면, 너는 그렇게 간단한 HTML을 쓸 필요도 없고, 그렇게 간단한 HTML을 작성해서는 안 된다. 왜냐하면 Rails는 너의 지지가 있기 때문이다.form_with 뷰 도움말을 사용하여 HTML을 생성할 수 있습니다.Rails 5.1에 form_with 도입form_tag 및 form_for을 교체할 수 있는지 여부
어떤 사람들은 매우 익숙하다.form_with에서 추가 코드를 작성하지 않아도 되는 방법에 대해 살펴보겠습니다.

<%= form_with(model: song, local: true) do |form| %>
  <div class="field">
    <%= form.label :title %>
    <%= form.text_field :title %>
  </div>

  <div class="field">
    <%= form.label :description %>
    <%= form.text_area :description %>
  </div>

  <div class="field">
    <%= form.label :download_url do %>
      Download URL
    <% end %>
    <%= form.text_area :download_url %>
  </div>

  <%= form.submit %>
<% end %>

HTML을 생성하는 것 외에 form_with은 CSRF 공격을 방지하는 진실성 영패를 생성합니다.따라서 거의 모든 상황에서 지정된 조수를 사용하는 것이 좋다. 왜냐하면 그들은 Rails 프레임워크를 잘 사용할 수 있기 때문이다.
일반 HTML 양식을 제출하려고 하면 요청에 올바른 신뢰성 토큰이 제출되지 않았기 때문에 실패합니다.form_with, label, text_area, submit 도움말 외에 더 많은 보기 도움말은 Rails를 통해 제공된다.그들은 너의 생활을 더욱 가볍게 하기 위해서이니, 너는 그들을 더욱 잘 이해해야 한다.'올스타'중 한 명은 틀림없이 link_to:

<%= link_to "Songs", songs_path %>

다음 HTML이 생성됩니다.

<a href="/songs">Songs</a>

나는 이 문장이 너무 길고 통독이 오늘의 주제의 일부분이 아니기 때문에 모든 조수를 상세하게 소개하지 않을 것이다.나는 네가 통과할 것을 건의한다
Rails Action View helpers guide
당신의 사이트에 필요한 물건을 선택하세요.

보기 코드 재사용 및 구성

완벽한 웹 응용 프로그램을 상상해 봅시다.완벽한 용례에서if-else 문장은 없고 컨트롤러로부터 데이터를 가져와 HTML 태그 사이에 놓는 순수한 코드만 있습니다.이런 응용 프로그램은 hackathons와 Dream에 존재할 수 있지만, 현실 세계의 응용 프로그램은 보기를 렌더링할 때 일련의 지점과 조건이 있다.
페이지 부분의 논리가 너무 복잡해졌을 때 어떻게 해야 합니까?이제 어디로 갈 거예요?일반적인 답은 현대 자바스크립트 라이브러리나 프레임워크를 이용하여 복잡한 것들을 구축하는 것일 수도 있다.하지만 이 게시물은
Rails 뷰에 대한 옵션을 살펴보겠습니다.

애프터서비스(맞춤형) 도우미

노래 아래에 행동 호소 (CTA) 단추를 표시하고 싶다면.그러나 한 곡에 다운로드 URL이 있을 수도 있고, 어떤 이유로든 잃어버릴 수도 있는 함정이 있다.다음과 같은 코드를 작성할 수 있습니다.

app/views/songs/show.html.erb

...

<div class="song-cta">
  <% if @song.download_url %>
    <%= link_to "Download", download_url %>
  <% else %>
    <%= link_to "Subscribe to artists updates",
                artist_updates_path(@song.artist) %>
  <% end %>
</div>

...

만약 우리가 위의 예를 고립된 표상 논리로 간주한다면, 그것은 보기에 그리 나쁘지 않을 것이다. 그렇지?그러나 이런 조건이 더 많이 나타나면 코드의 가독성이 떨어진다.그것 은 특히 일부 지역 에서 제대로 과장할 수 없는 가능성 을 증가시켰다
더 많은 조건이 있다.
이 문제들을 해결하는 방법의 하나는 그것들을 다른 조수에게 구하는 것이다.다행히도, Rails는 사용자 정의 조수를 쉽게 작성할 수 있는 방법을 제공해 주었다.app/helpers에서 다음과 같이 SongsHelper을 만들 수 있습니다.

module SongsHelper
  def song_cta_link
    content_tag(:div, class: 'song-cta') do
      if @song.download_url
        link_to "Download", @song.download_url
      else
        link_to "Subscribe to artists updates",
                artist_updates_path(@song.artist)
      end
    end
  end
end

만약 우리가 노래의 페이지를 열면, 우리는 여전히 같은 결과를 볼 수 있을 것이다.
그러나 우리는 이 예를 좀 더 잘 만들 수 있다.위의 예에서 우리는 실례 변수 @song을 사용했다.이 도움말은 @song의 nil에서 사용하기로 결정한 경우 사용할 수 없습니다.따라서 인스턴스 변수 형식의 외부 종속을 끊기 위해 다음과 같은 매개변수를 조수에게 전달할 수 있습니다.

module SongsHelper
  def song_cta_link(song)
    content_tag(:div, class: 'song-cta') do
      if song.download_url
        link_to "Download", song.download_url
      else
        link_to "Subscribe to artists updates",
                artist_updates_path(song.artist)
      end
    end
  end
end

그런 다음 뷰에서 다음과 같이 조수를 호출할 수 있습니다.

app/views/songs/show.html.erb

...

<%= song_cta_link(@song) %>

...

이런 것들이 있으면 우리는 보기에서 이전과 같은 결과를 얻어야 한다.helpers를 사용하는 장점은 나중에 그것들과 관련된 회귀가 발생하지 않도록 테스트를 작성할 수 있다는 것이다.사기극은 그들이다
전역적으로 정의됩니다. 프로그램에서 조수의 이름이 유일한 것인지 확인해야 합니다.
Rails Custom Assistant 작성을 별로 좋아하지 않는 경우
Draper gem .
아니면 여기에서 자신의 보기 모형 모드를 굴릴 수도 있다. 그렇게 복잡해서는 안 된다.만약 당신이 웹 응용 프로그램을 사용하기 시작했다면, 사용자 정의 도움말 프로그램을 천천히 작성하는 것을 권장합니다. 만약 이것이 고통을 가져올 수 있다면 다른 해결 방안으로 전환하십시오.

의견을 발표하지 마라

내가 Rails를 사용하기 시작했을 때, 내가 진정으로 좋아하는 것은 표시를 쉽게 제거할 수 있다는 것이었다. 이것은 나로 하여금 거의 믿을 수 없게 했다.Rails를 사용하면 어디에나 재사용 가능한 코드 세그먼트를 포함하는 partials를 만들 수 있습니다.... 때문에
예를 들어 여러 위치에서 노래를 렌더링하고 여러 파일에 같은 코드가 있다면 노래 세션을 만드는 것은 의미가 있다.
만약 당신이 당신의 노래를 전시했다면 다음과 같다.

# app/views/songs/show.html.erb

<p id="notice"><%= notice %></p>

<p>
  <strong>Title:</strong>
  <%= @song.title %>
</p>

<p>
  <strong>Description:</strong>
  <%= @song.description %>
</p>

<%= song_cta_link %>

<%= link_to 'Edit', edit_song_path(@song) %> |
<%= link_to 'Back', songs_path %>

그러나 동일한 태그가 있는 다른 페이지에도 표시하기를 원합니다.그럼 넌 돼.app/views/songs/_song.html.erb과 같은 밑줄 접두사가 있는 새 파일을 만듭니다.

# app/views/songs/_song.html.erb

<p>
  <strong>Title:</strong>
  <%= @song.title %>
</p>

<p>
  <strong>Description:</strong>
  <%= @song.description %>
</p>

<%= song_cta_link(@song) %>

그리고 이 노래를 어디에 놓고 싶든지 간에 다음과 같은 일을 하세요.

...

<%= render "song" %>

...

Rails는 _song 섹션의 존재 여부를 자동으로 찾아 렌더링합니다.사용자 정의 조수의 예시와 유사합니다. 일부 코드에서 실례 변수 @song을 제거하는 것이 좋습니다.

# app/views/songs/_song.html.erb
<p>
  <strong>Title:</strong>
  <%= song.title %>
</p>

<p>
  <strong>Description:</strong>
  <%= song.description %>
</p>

<%= song_cta_link(song) %>

그리고 우리는song 변수를partial에 전달하여 다시 사용하기 쉽고 다른 곳에 포함하기에 적합하도록 해야 한다.

...

<%= render "song", song: @song %>

...

마지막 생각

이상은 이 문장의 전체 내용이다.결론적으로 Rails 뷰 영역에서 발생할 수 있는 몇 가지 모드와 역모드에 대해 살펴보겠습니다.몇 가지 주요 사항은 다음과 같습니다.

UI의 복잡한 로직 방지(보기를 크게 확장하지 않음)

뷰 도우미에서 Rails가 제공하는 이점에 대해 알아보십시오.

사용자 정의 도움말 프로그램과 일부

을 사용하여 코드를 재구성하고 다시 사용합니다

은 실례 변수에 그다지 의존하지 않는다.

다음 기사에서는 Rails 컨트롤러 모드와 역모드를 소개할 예정이며 매우 혼란스러워질 수 있습니다.계속 지켜봐 주세요.
다음까지 건배!
또한 Ruby Magic에 게시된 게시물이 출간되는 즉시 읽고 싶으면 subscribe to our Ruby Magic newsletter and never miss a single post으로 전화하세요!
Nikola은 엔지니어와 작가로 노비사드에서 생활하고 일하며 블로그와 대화를 통해 사람들에게 지식을 전파한다.그는 자바스크립트와 루비로 훌륭한 것을 구축하는 것을 좋아한다.