Finish Building Out Full <Videos /> Component

[michael-martin-al]

Summary

Build a component for displaying a all the title video cards (the component is being built in #13 ). Your job is to create a very similar user interface as https://www.bible.com/videos using only components from our melos component library: https://github.com/lifechurch/melos . If you start working on this issue before #13 is complete, feel free to put an empty placeholder component in place.

You won't be able to recreate the exact look and feel that you see on the Bible.com videos page, but that's OK! 😄 What you see on Bible.com represents our old design style, but melos represents our newest design specs. I am sure you'll have questions, so feel free to ping me. We'll get one of our YouVersion designers to give you the final 👍 when you're done. So, you can expect there to be some back and forth work with them getting it just right.

Mock API Data

After #11 has been completed, there should be some mock data available to use while building your component. Instead of hard-coding the strings and images, you want to grab those from the mock api data. If you have questions about this, just make a comment here and we'll do our best to answer quickly.

This is What You're Building

Essentially, you're going to use <Heading1 /> from melos at the top of the page. Then, place an array of <TitleVideo /> components in a two-column grid.

[adamaverycole]

I'll take this.

[adamaverycole]

Is this component supposed to be a reusable component like the components in Melos or is it supposed to be a "page" component?

I think your answer will determine how I provide the data to it.

[michael-martin-al]

@adamaverycole it will be a page component.

[adamaverycole]

@michael-martin-al Thank you, sir.