# Components-Constructors-Solution

**Repository Path**: mirrors_LambdaSchool/Components-Constructors-Solution

## Basic Information

- **Project Name**: Components-Constructors-Solution
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-09-25
- **Last Updated**: 2026-07-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

**COMPONENTS-CONSTURCTORS**
----------------------------------

Topics:
* Naming Conventions
* BEM
* Constructors with ES6 class syntax

You will be building on your prior work from Components-BEM by adding a `Tabs` component.

The HTML and CSS for the Tabs component and instance are provided so that you may add your prior work around it. If you have not finished Components-BEM, ask you TA for the solution.

You may need to adjust some of the naming for the usuage of `Box` in the HTML provided if it's different in your implementation.

## Description
  The `Tabs` component should be a grouping of links and associated items. Only one item is shown at a time, and each item is shown when its corresponding link is clicked. You should default to the first link and item upon page load.

  You will also be doing a more complex query with `querySelector` and Data Attributes. It's a great challenge to try to work out on your own. If it's holding you back too much, you may ask your TA for the solution to that query.

## Resources

  Data Attributes: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

  BEM: http://getbem.com/naming/
  
  Constructors (and factory function): https://medium.com/javascript-scene/javascript-factory-functions-vs-constructor-functions-vs-classes-2f22ceddf33e