Comprehensive guide to integrating PagedJS with Ruby on Rails

Setting Up a Ruby on Rails Project

First, make sure you have Ruby and Rails installed. Then create a new Rails project:

rails new my-amazing-project
cd my-amazing-project

Create a new View

In Rails, views are stored in app/views. Create a controller and a view for our magazine:

rails generate controller Magazine index

Edit app/views/magazine/index.html.erb:

<div class="content">
  <h1 class="main-title">Doppio Magazine</h1>
  <% 5.times do |i| %>
    <section class="page">
      <h2 class="title">Chapter <%= i + 1 %></h2>
      <p class="text">Content of chapter <%= i + 1 %>.</p>
    </section>
  <% end %>
</div>

Install PagedJS via CDN

Add the Paged.js script to your layout or view:

<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>

Styling the Page

Create a stylesheet in app/assets/stylesheets/magazine.css:

.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 2rem 4rem;
}
.page { break-after: page; }
h1 { color: #5935dd; text-align: center; }
h2 { color: #3c3c3c; text-align: center; }
p { color: #a1a1a1; text-align: center; }

Configure the Route

In config/routes.rb:

get 'magazine', to: 'magazine#index'

Generate PDFs

Now you can generate PDF files from this page using Doppio.

What's next?

Check out the Paged.js documentation for all available features!