Pagination and Infinite Scroll in Phoenix

Photo by Olga Tutunaru on Unsplash

What is Pagination?

What is Infinite Scroll?

How Do We Code This In Phoenix?

How Do You Paginate an Ecto Query?

How Do You Handle a load-more Event In Phoenix Liveview?

How Do You Trigger The Load More Event?

Final Thoughts.

  • Infinite Scrolling
  • Loading more entries vs loading next entries and removing previous entries.
  • Implementing pagination with Ecto queries
  • Creating a load-more event to load more entries and attach them to the current data set.
  • Triggering the load more event when the user scrolls down using phoenix hooks.

Software Engineer. I create educational content focused on technology for mobile and web applications.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Understanding Kubernetes from Real-world Use Cases

Cool AI Hackathons that you should not leave at any cost!

Monitor GC stats with a startup hook

Day 61: Boss Part 3

7 Quick Tips for Java Programmers Starting C++

UML Quick Reference

Nairobi Devfest2017 Through The Eyes Of a Newbie

Connect a Particle Xenon to the Cloud via CLI

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Brooklin Myers

Brooklin Myers

Software Engineer. I create educational content focused on technology for mobile and web applications.

More from Medium

Building a simple Calendly clone with Phoenix LiveView (pt. 4)

Hot Code Reloading of Elixir OTP Application

Deploy Phoenix 1.6 / Elixir 1.3 on Render.com: A Working Guide

Implement IO.Inspect in Elixir