Rubyで書く。
ブラウザで動く。

# frozen_string_literal: true

puts "こんにちは、未來！"
puts 7 + 5
puts "Ruby #{RUBY_VERSION}"
puts RUBY_DESCRIPTION

# frozen_string_literal: true

name = "未來"
hp = 420
equipment = "ルビーの剣"
puts "#{name}のHPは#{hp}です"
puts "装備：#{equipment}"

hp -= 50
puts "攻撃を受けたあとのHP：#{hp}"
p hp.positive?
p nil

# frozen_string_literal: true

puts 7 / 2
puts 7.fdiv(2)
puts 7 % 2
puts 2 ** 10

hp = 315
max_hp = 420
puts "HPの割合：#{(hp.fdiv(max_hp) * 100).round}%"

p "42abc".to_i
p Integer("42abc", exception: false)
p Integer("42", exception: false)
p Math.sqrt(16)

# frozen_string_literal: true

hp = 80
mp = 25

if hp <= 100 && mp >= 20
  puts "叡智の祈りで回復する"
elsif mp >= 30
  puts "白光の一閃を使う"
else
  puts "ルビーの剣で攻撃する"
end

command = :guard
case command
when :attack then puts "攻撃！"
when :guard  then puts "守りを固める！"
else              puts "行動を選んでください"
end

# frozen_string_literal: true

3.times do |index|
  puts "#{index + 1}回目の攻撃"
end

%w[紅玉の鎧 叡智の冠 コードの書].each do |item|
  puts "#{item}を装備した"
end

enemy_hp = 90
while enemy_hp > 0
  enemy_hp = [enemy_hp - 30, 0].max
  puts "大魔王のHP：#{enemy_hp}"
end

# frozen_string_literal: true

items = ["薬草", "ルビーの剣", "コードの書"]
puts items[0]
puts items[-1]
items << "紅玉の鎧"
p items.length

map = [
  ["草地", "森",   "城"],
  ["道",   "道",   "山"],
  ["村",   "草地", "海"]
]
puts "右上のマス：#{map[0][2]}"

board = Array.new(2) { Array.new(3, 0) }
board[0][0] = 1
p board

# frozen_string_literal: true

hero = { name: "未來", hp: 420, mp: 100 }
hero[:hp] -= 50
puts "#{hero[:name]}のHP：#{hero.fetch(:hp)}"
puts hero.fetch(:weapon, "素手")

visited = Set["村", "森", "村"]
p visited.to_a
p visited.include?("城")

Point = Data.define(:x, :y)
position = Point.new(x: 2, y: 3)
moved = position.with(x: 4)
p position
p moved

# frozen_string_literal: true

def damage_for(attack:, defense:)
  [attack - defense, 1].max
end

def remaining_hp(hp, damage)
  [hp - damage, 0].max
end

damage = damage_for(attack: 125, defense: 30)
puts "ダメージ：#{damage}"
puts "残りHP：#{remaining_hp(80, damage)}"

double = ->(number) { number * 2 }
puts double.call(12)
p [1, 2, 3].map { |number| double.call(number) }

# frozen_string_literal: true

class Fighter
  attr_reader :name, :hp

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

  def take_damage(amount)
    @hp = [@hp - amount, 0].max
  end

  def alive?
    @hp.positive?
  end
end

hero = Fighter.new("未來", 420)
boss = Fighter.new("大魔王", 960)
boss.take_damage(230)
puts "#{hero.name}のHP：#{hero.hp}"
puts "#{boss.name}のHP：#{boss.hp}"
p boss.alive?

# frozen_string_literal: true

text = $stdin.gets.to_s.chomp
number = Integer(text, exception: false)

if number.nil?
  puts "整数を入力してください"
else
  puts "回復量：#{number.clamp(0, 140)}"
end

begin
  puts 10 / 0
rescue ZeroDivisionError => error
  puts "計算できません：#{error.message}"
end

<!doctype html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Rubyで勇者の名前を表示する</title>
  <style>
    body { margin: 0; padding: 24px; color: #14202b; background: #f6f5f2; font-family: sans-serif; }
    h1 { font-size: 20px; }
    input, button { max-width: 100%; padding: 10px; font: inherit; }
    button { margin: 8px 0; background: #1b4e77; color: white; border: 0; border-radius: 6px; }
    #message { line-height: 1.8; }
  </style>
  <script src="https://cdn.jsdelivr.net/npm/@ruby/4.0-wasm-wasi@2.10.1/dist/browser.script.iife.js"></script>
</head>
<body>
  <h1>冒険のはじまり</h1>
  <label>勇者の名前 <input id="name" value="未來" maxlength="30"></label>
  <button id="greet" type="button" disabled>冒険に出る</button>
  <p id="message" role="status">Rubyを読み込んでいます…</p>
  <script type="text/ruby">
    require "js"
    document = JS.global[:document]
    input = document.querySelector("#name")
    button = document.querySelector("#greet")
    message = document.querySelector("#message")

    button.addEventListener("click") do |_event|
      name = input[:value].to_s.strip
      message[:textContent] = if name.empty?
        "名前を入力してください。"
      else
        "#{name}はルビーの剣を手に、冒険に出た！"
      end
    end

    button[:disabled] = false
    message[:textContent] = "準備できました。名前を入力してボタンを押しましょう。"
  </script>
</body>
</html>

<!doctype html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>RubyでCanvasに描く</title>
  <style>
    body { margin: 0; padding: 20px; color: #14202b; background: #f6f5f2; font-family: sans-serif; }
    h1 { font-size: 20px; }
    canvas { display: block; width: 100%; max-width: 480px; height: auto; border-radius: 8px; }
    button { margin-top: 12px; padding: 10px 16px; color: white; background: #1b4e77; border: 0; border-radius: 6px; }
  </style>
  <script src="https://cdn.jsdelivr.net/npm/@ruby/4.0-wasm-wasi@2.10.1/dist/browser.script.iife.js"></script>
</head>
<body>
  <h1>ルビーの剣の白い光</h1>
  <canvas id="stage" width="480" height="230" aria-label="左に勇者の未來、右に大魔王。ボタンで白い光を描く戦闘の図。">未來と大魔王の戦闘シーン</canvas>
  <button id="attack" type="button" disabled>白光の一閃</button>
  <p id="status" role="status">Rubyを読み込んでいます…</p>
  <script type="text/ruby">
    require "js"
    document = JS.global[:document]
    canvas = document.querySelector("#stage")
    ctx = canvas.getContext("2d")
    button = document.querySelector("#attack")
    status = document.querySelector("#status")

    draw = ->(light) do
      ctx.clearRect(0, 0, 480, 230)
      ctx[:fillStyle] = "#182238"
      ctx.fillRect(0, 0, 480, 230)
      ctx[:fillStyle] = "#bd4765"
      ctx.fillRect(65, 90, 50, 80)
      ctx[:fillStyle] = "#dabd81"
      ctx.fillRect(70, 72, 40, 18)
      ctx[:fillStyle] = "#805397"
      ctx.fillRect(345, 65, 70, 105)
      ctx[:fillStyle] = "#ffffff"
      ctx[:font] = "16px sans-serif"
      ctx.fillText("未來", 70, 200)
      ctx.fillText("大魔王", 350, 200)
      if light
        ctx[:strokeStyle] = "#fff5d7"
        ctx[:lineWidth] = 12
        ctx.beginPath
        ctx.moveTo(120, 112)
        ctx.lineTo(365, 90)
        ctx.stroke
      end
    end

    draw.call(false)
    button.addEventListener("click") do |_event|
      draw.call(true)
      status[:textContent] = "ルビーの剣から、白い光が放たれた！"
    end
    button[:disabled] = false
    status[:textContent] = "準備できました。必殺技を使ってみましょう。"
  </script>
</body>
</html>

# frozen_string_literal: true

require "json"

hero = { name: "未來", hp: 315, mp: 70 }
json = JSON.generate(hero)
puts json

saved = JSON.parse(json)
puts "#{saved.fetch("name")}のHP：#{saved.fetch("hp")}"