Hiccup lists, keys, and laziness

Subscribe to a paid plan to get instant access to this course.

Video time: 16m12s

PREVIOUS

NEXT

Want this course?

Hiccup lists, keys, and laziness

Updated January 13, 2019

We explore how Reagent deals with lists of elements and how that interacts with React. We address some common warnings that come up when using lists and especially lazy lists.

Buy this course or register for a membership to view the code.

Next Lesson:

Accessing DOM nodes

Sometimes we need to get a reference to the real DOM node that React normally manages for us. For instance, when we need to play an embedded video, the API requires access to the DOM node of the video element. React gives us a feature called Refs that let us get access to any DOM node it creates.

Understanding Re-frame

0 / 37

0 / 37

Re-frame Stack Overview

Reagent components

Basic HTML with Hiccup

Hiccup true, false, and nil Attributes

Hiccup Style Attributes

Hiccup class Pattern

Hiccup id and class Shortcuts

Hiccup Nested Tag Shortcut

Hiccup and subcomponents

Hiccup lists, keys, and laziness

Accessing DOM nodes

Form component best practices

Component Re-rendering

Embedding strings of HTML

Embedding Native JS React Components

Re-frame flow overview

Dispatching Events

Handling Events

Effect Handlers

Interceptors overview

Interceptor example

HTML DB Isolation

Reactive Subscriptions

Reactive Subscriptions walkthrough

Choosing where to store state

Naming Events and Subscriptions

Initialization recommendations

Deeply nested databases

Keep Events and Subscriptions Together

Calculations in Subscriptions

Indexed Entities

Indexed Entity Order