カテゴリー: programming

ruby attr_accessorruby

class User
  # attr_accessor :name
  # attr_writer :name
  attr_reader :name

  def initialize(name, score)
    @name = name
    @score = score
  end

  # # getter
  # def name
  #   @name
  # end

  # # setter
  # def name=(new_name)
  #   @name = new_name
  # end

  def get_info
    "Name: #{@name}, Score: #{@score}"
  end
end

user1 = User.new("Taro", 70)
user2 = User.new("Jiro", 90)
user1.name = "TARO"
puts user1.name

Ruby on Rails Todoリスト

Ruby on Railsを使用してTodoリストを作成する方法を説明します。まずは、以下の手順に従って新しいRailsアプリケーションを作成しましょう。

  1. ターミナルを開いて、プロジェクトを保存するディレクトリに移動します。
  2. 次のコマンドを実行して、新しいRailsアプリケーションを作成します。

rails new todo_list

  1. 作成したディレクトリに移動します。

cd todo_list

次に、Todoリストの機能を追加します。

  1. Todoアイテムを保存するためのデータモデルを作成します。

rails generate model TodoItem title:string description:text completed:boolean

  1. データベースにマイグレーションを実行して、新しいテーブルを作成します。

rails db:migrate

  1. Todoアイテムを操作するためのコントローラーを作成します。

rails generate controller TodoItems

  1. config/routes.rb ファイルを開き、以下のようにルートを設定します。

Rails.application.routes.draw do resources :todo_items root 'todo_items#index' end

  1. app/controllers/todo_items_controller.rb ファイルを開いて、アクションを追加します。

class TodoItemsController < ApplicationController before_action :set_todo_item, only: [:show, :edit, :update, :destroy] def index @todo_items = TodoItem.all end def show end def new @todo_item = TodoItem.new end def edit end def create @todo_item = TodoItem.new(todo_item_params) if @todo_item.save redirect_to @todo_item, notice: 'Todo item was successfully created.' else render :new end end def update if @todo_item.update(todo_item_params) redirect_to @todo_item, notice: 'Todo item was successfully updated.' else render :edit end end def destroy @todo_item.destroy redirect_to todo_items_url, notice: 'Todo item was successfully destroyed.' end private def set_todo_item @todo_item = TodoItem.find(params[:id]) end def todo_item_params params.require(:todo_item).permit(:title, :description, :completed) end end

  1. app/views/todo_items ディレクトリ内に、必要なビューファイル（index、show、new、edit）を作成します。
  2. app/views/todo_items/index.html.erb ファイルを開いて、Todoアイテムのリストを表示するコードを追加します。

<h1>Todo Items</h1> <%= link_to 'New Todo Item', new_todo_item_path %> <ul> <% @todo_items.each do |todo_item| %> <li> <%= link_to todo_item.title, todo_item %> <% if todo_item.completed %> (Completed) <% else %> (Pending) <% end %> </li> <% end %> </ul>

これで、基本的なTodoリストアプリケーションが完成しました。 rails server コマンドを使用してRailsサーバーを起動し、 http://localhost:3000/todo_items にアクセスしてアプリケーションを確認できます。

User

You

No template for interactive request TodoItemsController#new is missing a template for request formats: text/html NOTE! Unless told otherwise, Rails expects an action to render a template with the same name, contained in a folder named after its controller. If this controller is an API responding with 204 (No Content), which does not require a template, then this error will occur when trying to access it via browser, since we expect an HTML template to be rendered for such requests. If that’s the case, carry on. ChatGPT

ChatGPT

このエラーは、TodoItemsController#new アクションに対応するビューテンプレートが見つからないために発生しています。Railsは通常、コントローラーと同じ名前のフォルダ内にある同じ名前のビューテンプレートを期待します。

解決するためには、app/views/todo_items ディレクトリ内に new.html.erb という名前のビューテンプレートファイルを作成する必要があります。その後、新しいTodoアイテムを作成するためのフォームをこのファイルに追加します。

例えば、次のようなフォームを追加できます。

erbCopy code

<!-- app/views/todo_items/new.html.erb --> <h1>New Todo Item</h1> <%= form_with(model: @todo_item, url: todo_items_path) do |form| %> <%= form.label :title %> <%= form.text_field :title %> <%= form.label :description %> <%= form.text_area :description %> <%= form.submit 'Create Todo Item' %> <% end %> <%= link_to 'Back', todo_items_path %>

これで、TodoItemsController#new アクションに対するビューテンプレートが追加されました。再度ブラウザでアクセスすると、エラーは解消されるはずです。

CSS クラスセレクター

index.html

@charset "utf-8";

body {
  margin: 0;
}

.container {
  width: 400px;
  margin: 32px auto 0;
  border: 8px solid blue;
}

.box-1 {
  width: 100px;
  height: 100px;
  background-color: pink;
}

.box-2 {
  width: 100px;
  height: 50px;
  background-color: skyblue;
}

.box-3 {
  width: 100px;
  height: 100px;
  background-color: orange;
}

style.css

@charset "utf-8";

body {
  margin: 0;
}

.container {
  width: 400px;
  margin: 32px auto 0;
  border: 8px solid blue;
}

.box-1 {
  width: 100px;
  height: 100px;
  background-color: pink;
}

.box-2 {
  width: 100px;
  height: 50px;
  background-color: skyblue;
}

.box-3 {
  width: 100px;
  height: 100px;
  background-color: orange;
}