Tier: 1-Beginner
Patterns are integral to software engineering and represent potentially reusable components in program logic. However, patterns aren't used only for program logic, they are exist in other domains such as DevOps, user support, and the user interface.
A common user interface pattern is to summarize data in one section of a page that consists of some type of list (like text, images, or icons) that describes or categorizes a set of data. When a list item is clicked, the detailed data behind it is displayed in an adjacent pane on the page.
For example, on a real estate site clicking an address in a list of properties for sale displays the details about the property in another part of the page.
This challenge requires that the developer implementing it follow these constraints:
- You are responsible for creating your own test data. Use a hardcoded Javascript object to define your test data (see below).
- Use only native HTML/CSS/Javascript in your first version of this app
- You may use other packages or libraries when implementing subsequent versions.
- User can see a list of person names arranged vertically in a summary pane on the page.
- User can click on a name in the list to update an adjacent pane on the page with that individuals full name, address, telephone number, and birthday.
- User can click on another name in the list to refresh the detail pane with that individuals information.
- Consider defining your test data in a JavaScript object having a format such as this:
const people = [
{name: "...", street: "...", city: "...", state: "...", country: "...", telephone: "...", birthday: "..."},
.
.
.
{name: "...", street: "...", city: "...", state: "...", country: "...", telephone: "...", birthday: "..."}
];
Este projeto faz parte do desafio Appideas