개발자가 내팔자

[Ruby on Rails] 공식문서와 함께 하는 30분 만에 블로그 만들기! - 게시판 CRUD 본문

WEB/Back-end

[Ruby on Rails] 공식문서와 함께 하는 30분 만에 블로그 만들기! - 게시판 CRUD

야생의 개발자 2022. 8. 8. 18:01

 

Ruby on Rails . . .

 

 

https://rubyonrails.org/

 

Ruby on Rails

A web-app framework that includes everything needed to create database-backed web applications according to the Model-View-Controller (MVC) pattern.

rubyonrails.org

공식문서에 들어가면 벤애플렉 닮은 아저씨가 30분짜리 튜토리얼을 통해 블로그를 만들 수 있다고 친절하게 알려준다.
블로그를 만들어 게시글 CRUD와 댓글 기능, 댓글 시 이메일을 보내고, 이 댓글을 라이브로 업데이트하는 것을 볼 수 있는 기능까지 구현하여 heroku로 배포까지 해버린다. (회원가입/로그인 기능은 없다)
이 영상을 보면서 따라해보자

시작!

demo라는 프로젝트를 만든다.

rails new demo

그 프로젝트에 들어간다.

cd demo

이렇게 들어가보면 기본적인 구조가 잡혀있는 것을 확인해볼 수 있다.

❯ ls
Gemfile      Rakefile     config       lib          storage      vendor
Gemfile.lock app          config.ru    log          test
README.md    bin          db           public       tmp

scaffold를 이용하여 model 만들기

아래 명령어는 post라는 테이블에 string 타입의 title과 text 타입의 content 컬럼으로 생상한다는 뜻이다.
scaffold는 뼈대라는 뜻을 가지고 있는데, 이렇게 생성한 post를 기반으로 crud를 할 수 있는 뼈대 코드를 한 번에 생성해준다.

❯ rails generate scaffold post title:string content:text
      invoke  active_record
      create    db/migrate/20220808083432_create_posts.rb
      create    app/models/post.rb
      invoke    test_unit
      create      test/models/post_test.rb
      create      test/fixtures/posts.yml
      invoke  resource_route
       route    resources :posts
      invoke  scaffold_controller
      create    app/controllers/posts_controller.rb
      invoke    erb
      create      app/views/posts
      create      app/views/posts/index.html.erb
      create      app/views/posts/edit.html.erb
      create      app/views/posts/show.html.erb
      create      app/views/posts/new.html.erb
      create      app/views/posts/_form.html.erb
      create      app/views/posts/_post.html.erb
      invoke    resource_route
      invoke    test_unit
      create      test/controllers/posts_controller_test.rb
      create      test/system/posts_test.rb
      invoke    helper
      create      app/helpers/posts_helper.rb
      invoke      test_unit
      invoke    jbuilder
      create      app/views/posts/index.json.jbuilder
      create      app/views/posts/show.json.jbuilder
      create      app/views/posts/_post.json.jbuilder

우선 migrate으로 달려가서 새로 생긴 migration 파일을 살펴보자.

db/migrate/20220808083432_create_posts.rb

class CreatePosts < ActiveRecord::Migration[7.0]
  def change
    create_table :posts do |t|
      t.string :title
      t.text :content

      t.timestamps
    end
  end
end

posts라는 table이 생성(create)되고 컬럼과 타입을 보여준다.
루비에서는 기본적으로 timestamps라는 것으로 create_at, update_at 등의 시간을 기록해주는 것 같다.

app/models/post.rb 확인

models 디렉토리에 가서 post.rb를 확인해보면 아무것도 없다.
이 부분이 좀 특이하다고 생각했는데, 난 모델에 대한 데이터 스키마가 객체 형식으로 자동 생성되어있을 줄 알았다.
하지만 아직 아무것도 없다.

class Post < ApplicationRecord
end

app/controllers/posts_controller.rb 확인

controller에 들어가보면 내가 만들지도 않은 action(루비에서는 method를 action이라고 부른다)을 restful하게 7개나 만들어준다.

class PostsController < ApplicationController
  before_action :set_post, only: %i[ show edit update destroy ]

  # GET /posts or /posts.json
  def index
    @posts = Post.all
  end

  # GET /posts/1 or /posts/1.json
  def show
  end

  # GET /posts/new
  def new
    @post = Post.new
  end

  # GET /posts/1/edit
  def edit
  end

  # POST /posts or /posts.json
  def create
    @post = Post.new(post_params)

    respond_to do |format|
      if @post.save
        format.html { redirect_to post_url(@post), notice: "Post was successfully created." }
        format.json { render :show, status: :created, location: @post }
      else
        format.html { render :new, status: :unprocessable_entity }
        format.json { render json: @post.errors, status: :unprocessable_entity }
      end
    end
  end

  # PATCH/PUT /posts/1 or /posts/1.json
  def update
    respond_to do |format|
      if @post.update(post_params)
        format.html { redirect_to post_url(@post), notice: "Post was successfully updated." }
        format.json { render :show, status: :ok, location: @post }
      else
        format.html { render :edit, status: :unprocessable_entity }
        format.json { render json: @post.errors, status: :unprocessable_entity }
      end
    end
  end

  # DELETE /posts/1 or /posts/1.json
  def destroy
    @post.destroy

    respond_to do |format|
      format.html { redirect_to posts_url, notice: "Post was successfully destroyed." }
      format.json { head :no_content }
    end
  end

  private
    # Use callbacks to share common setup or constraints between actions.
    def set_post
      @post = Post.find(params[:id])
    end

    # Only allow a list of trusted parameters through.
    def post_params
      params.require(:post).permit(:title, :content)
    end
end

app/views/posts/index.html.erb 확인

프론트에서 보여질 화면을 템플릿으로 구성했다.
이것도 내가 한 게 아니고 rails scaffold가 알아서 만들어줬다.

<p style="color: green"><%= notice %></p>

<h1>Posts</h1>

<div id="posts">
  <% @posts.each do |post| %>
    <%= render post %>
    <p>
      <%= link_to "Show this post", post %>
    </p>
  <% end %>
</div>

<%= link_to "New post", new_post_path %>

db migration

❯ rails db:migrate
== 20220808083432 CreatePosts: migrating ======================================
-- create_table(:posts)
   -> 0.0008s
== 20220808083432 CreatePosts: migrated (0.0008s) =============================

위 명령어를 치면 migration이 되었다는 말과 함께 아래와 같이 app/db/schema.rb 파일이 생긴다.

# This file is auto-generated from the current state of the database. Instead
# of editing this file, please use the migrations feature of Active Record to
# incrementally modify your database, and then regenerate this schema definition.
#
# This file is the source Rails uses to define your schema when running `bin/rails
# db:schema:load`. When creating a new database, `bin/rails db:schema:load` tends to
# be faster and is potentially less error prone than running all of your
# migrations from scratch. Old migrations may fail to apply correctly if those
# migrations use external dependencies or application code.
#
# It's strongly recommended that you check this file into your version control system.

ActiveRecord::Schema[7.0].define(version: 2022_08_08_083432) do
  create_table "posts", force: :cascade do |t|
    t.string "title"
    t.text "content"
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
  end

end

실행!

❯ rails server
=> Booting Puma
=> Rails 7.0.3.1 application starting in development
=> Run `bin/rails server --help` for more startup options
Puma starting in single mode...
* Puma version: 5.6.4 (ruby 3.1.2-p20) ("Birdie's Version")
*  Min threads: 5
*  Max threads: 5
*  Environment: development
*          PID: 91994
* Listening on http://127.0.0.1:3000
* Listening on http://[::1]:3000
Use Ctrl-C to stop

이 명령어를 실행하면 이제 Post CRUD가 가능한 간단한 블로그 서버를 볼 수 있다.

 

이렇게 들어가면 그냥 rails만 뜨는데, 주소창에 http://127.0.0.1/posts라고 치면 글 목록이 나온다.

축하한다! 벌써 블로그를 만들어버렸다. 아직 추가기능은 없지만 글을 쓰고, 읽고, 수정하고, 삭제하는 기본적인 것들이 가능하다.

처음엔 당연히 아무것도 없으니 New Post 같은 것을 눌러서 글을 몇 개 써주자.

 

다음 포스트에서는 블로그를 좀 더 예쁘게 꾸미고, 검증 등의 추가 기능을 넣어보도록 한다.

 

Comments