Romantic Developer : )

(Ruby on Rails) CRUD 개념으로 게시판 실습해보기(3. Read) 본문

Romantic Developer/Ruby on Rails

(Ruby on Rails) CRUD 개념으로 게시판 실습해보기(3. Read)

Romantic_Developer 2018. 5. 21. 12:00


안녕하세요~ 영감을 주는 개발자 '방민방민' 입니다.


오늘은 CRUD 의 개념중 Read 즉 읽어오기 에 대해 알아보도록 하겠습니다.


더 긴 말은 생략하고 바로 시작하겠습니다.


1. 개념 


Read 는 웹 상에서 사용자가 작성한 글을 읽어올수 조회할 수 있는 기능을 말한다.


2. 실습


지난번 Create 를 통해서 사용자의 입력을 받아 DB 상에 저장하는 과정 까지를 다루었습니다.

오늘은 Read에 대해 좀 더 알아보도록 하겠습니다.


먼저 게시판에서 어떤 글을 읽기 위해서는 내가 쓴 글이 목록화 되어 보여지면 직관적이고 좋을것 같습니다.

아마도 .... 저는 물론 그렇습니다. 

그래서 사용자에게 처음으로 보여질 페이지를 index로 

내가 써놓은 글들이 목록으로 보여줄 수 있도록 해보겠습니다.


오늘 다룰 실습에 앞서 다음의 두가지를 컨트롤러에 추가해줍니다.

Show 는 당연히 사용자에게 특정 게시물을 출력할 콘트롤러이고, 

index 는 사용자에게 목록을 보여줄 첫 페이지 입니다.


note_controller.rb

#Read
    def show
        #사용자가 선택한 페이지를 보여줘라
    end
    
    
# 첫페이지
        def index
        @notes=Note.all
        #사용자가 입력한 데이터를 모두 가져와 @notes에 넣어라
    end

end

여기서 @notes=Note.all 을 한 이유는 현재 view 페이지 자체는 전체 노트목록에 대한 데이터를 가지고 있지 않기 때문에 콘트롤러에서 Note에 저장된 모든 데이터를 가져와야 하기 때문입니다.

이렇게 해주면 이제 index 라는 뷰페이지에서는 @notes 라는 변수를 통해 Note 에 저장된 모든 데이터에 접근 할 수 있습니다.



그리고 아래의 명령어를 routes.rb 에 추가하여 사용자가 처음 입장하는 페이지(root)가 index 가 될 수 있도록 합니다.

routes.rb 

#Read
root 'notes#index'


이제 view 폴더에 index.html.erb 파일을 생성해 줍니다. ( 사용자가 직접 봐야하는 페이지는 html.erb파일을 생성해서 꾸며준다 고 생각하면 보다 이해가 쉬울 수 있습니다.)

아래의 index.html.erb 뷰 파일에 사용자가 기존에 입력해 둔 게시물이 모두 보여질 것입니다.




index.html.erb 에 아래와 같이 작성합니다.

<h1> 모든 게시글 목록 </h1>

<%@notes.each do |note|%>
<li><p1><%= note.title%></p1></li>
<%end%>



그러면 아래와 같이 모든 게시글(지금은 한개밖에 등록이 되지 않았습니다.) 을 확인할 수 있습니다.

이제 제목을 누르면 링크를 통해 해당 게시글에 접근할 수 있고, 게시글 목록에서 새로운 글을 만들수 

있도록 하고 싶습니다. 그러기 위해서는 사용자에게 보여지는 페이지가 필요할 것 같습니다.


그렇게 때문에 사용자가 입력한 게시물을 볼 수 있도록 앞서 만든 show 페이지를 꾸며보도록 하겠습니다.


그 전에 게시물에 대해 생각해 볼 필요가 있습니다. 라우팅을 위해 우리는 우리가 보고자 하는 게시물이 

도대체 몇번째(?) 게시물인지 알 필요가 있습니다. 즉 사용자로부터 게시판에 있는 특정 게시물에 대한 

있을때, 우리는 해당 게시물에 번호를 알아야만 게시물로 접근할 수 있다는 접입니다. 


그렇기 때문에 사용자로부터 id 번째 게시물의 params(변수)를 받아서 

show controller 에서 사용할 수 있어야 합니다. 그래야만 해당 변수번째 게시물에 접근할 수 있기 때문입니다.


따라서 


routes.rb 파일의 아래의 라우팅을 추가해 줍니다. 

  get '/notes/show/:id' => 'notes#show'


이렇게 되면 사용자의 주소입력이 있을때 우리는 :id 라는 변수(params)를 note#show 즉, show controller 

보내주게 되고 우리는 해당 id 값을 이용할 수 있습니다. 주소창으로 보면 이해하기 쉽습니다.


아래와 같이 notes/show/1 을 입력하면 사용자로부터 show 컨트롤러로 1 이라는 값이 id 로 전달됩니다.



자 이제 notes_controller.rb 파일에 show 컨트롤러에 아래의 내용을 추가해 줍니다.

그러면 show 콘트롤러는 사용자로부터 받은 1이라는 id를 이용하여  Note에 있는 게시물 중에 

1번 게시물을 찾아 note 라는 변수에 저장하게 됩니다.

즉 이제부터 show view 페이지에서도 note 라는 변수를 통해 해당 내용에 접근할 수 있게 된 것입니다.

#Read
    def show
        @note=Note.find(params[:id])
    end


show.html.erb 파일에 아래와 같이 적어줍니다.

(참고로 <%=     => 태그는 html 내에서도 ruby 코드를 통해 변수에 접근할 수 있도록 합니다.

그리고 주소창 뒤에 notes/show/1 을 입력합니다.

<h1> <%=@note.title%> </h1>

<p1> <%=@note.content%> </p1>


그럼 아래와 같이 정말 1번 게시글에 접근한 것을 확인할 수 있습니다.



와~~~~이제 정말 사용자로부터 특정 번째 게시물로 돌아갈 수 있도록 되었습니다. 

그럼 앞에서 만든 index 에서 특정 게시물의 제목을 클릭! 하면 특정 게시물로 이동할 수 있도록 해보겠습니다.


show.html.erb 파일에 아래와 같은 코드로 수정합니다.

<h1> 모든 게시글 목록 </h1>

<%@notes.each do |note|%>
<a href='/notes/show/<%=note.id%>'><li><p1><%= note.title%></p1></li>
<%end%></a>

각각의 게시글의 제목을 출력할때마다, 앞에서의 라우팅 /notes/show/:id 로 보낼것인데 id 값이 

<%=note.id%> 즉 각 note 의 id 값을 보내서 링크를 걸어주는 것입니다.



확인을 위해 몇개의 글을 조금 더 등록했습니다.

링크가 활성화 된것을 확인할수 있고, 링크를 클릭하면 특정 게시글로 진입하는 것을 확인할 수 있습니다.

두번째 글을 클릭해 보겠습니다.




지금까지 신나는 Read 에 대하여 알아보았습니다 :)


어떠셨나요?? 많이 어려운 부분이 많습니다. 

무엇보다 MVC 모델에 대한 이해가 없다면 데이터가 이쪽저쪽 왔다갔다 하는 것이 많이 어색할 수 있습니다.


저도 3번정도 복습하며 이 포스팅을 하는 것인데도 불구하고,,,, 헷갈리는 부분이 많습니다.


많은 복습만이!!!! 저희를 살리는 길이니 !!! 함께 힘내보아요 ㅜ



그러면 지금까지 영감을 주는 개발자 '방민방민'이었습니다.:)

감사합니다~!