From the course: Web Components and Modularization: Practical Approaches

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Input and output

Input and output

From the course: Web Components and Modularization: Practical Approaches

Start my 1-month free trial

Input and output

“

- [Instructor] Mapping out what data is needed and how the data flows through the components is vital for the components to work properly and for efficient development. Before I start passing actual data from component to component, I like to map it out and leave comments in each component's file explaining what data the component receives and what data it sends. I do this by traversing the tree from the outermost leaf inwards. Let me show you how that works. In the BookCarousel Components, the outermost leaves are BookTitle, BookAuthor, and BookPrice and we'll start there by looking at BookTitle. Here in the comments, I've added two new lines that say Receives: props.book.title and Sends: nothing. This is a leaf, it's at the end of the tree and it doesn't have any more child components that's why it doesn't send anything. And what it receives is the information necessary to display the content properly, which in this…

Contents