Analyzing your web application's architecture
To answer these questions, let's zoom out from the implementation details and explore our application's architecture:
- The
app.js
file renders ourApplication
component - The
Application
component manages a collection of tweets and renders ourStream
andCollection
components - The
Stream
component receives the new tweets from theSnapkiteStreamClient
library and renders theStreamTweet
andHeader
components - The
Collection
component renders theCollectionControls
andTweetList
components
Stop right there. Can you tell how data flows inside our application? Do you know where it enters our application? How does a new tweet end up in our collection? Let's examine our data flow more closely:
- We use the
SnapkiteStreamClient
library to receive a new tweet inside aStream
component. - This new tweet is then passed from
Stream
to theStreamTweet
component. - The
StreamTweet
component passes it to theTweet
component, which renders the tweet image...