Button component

Solution for a challenge from Devchallenges.io.

Demo | Solution | Challenge

Table of Contents

• Overview
  • Built With
• Features
• How to use
• Contact
• Acknowledgements

Overview

ETC: ~13h

Built With

• Create React App
• hex-rgb
• Material-UI
• React

Features

This application/site was created as a submission to a DevChallenges challenge. The challenge was to build an application to complete the given user stories:

• User story: I can see different button types: default, outline and text
• User story: I can choose to disable box-shadow
• User story: I can choose to disable the button
• User story: I can choose to have an icon on the left or right (Use Google Icon and at least 5 variants)
• User story: I can have different button sizes
• User story: I can have different colors
• User story: When I hover or focus, I can see visual indicators
• User story: I can still access all button attributes
• User story (optional): Show button in a similar way like the design or use Storybook.

How To Use

To clone and run this application, you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:

# Clone this repository
$ git clone https://github.com/your-user-name/your-project-name

# Install dependencies
$ npm install

# Run the app
$ npm start

Acknowledgements

• How can I dynamically load an icon using its snake_case name (React, material-ui)

Contact

• GitHub @RauboLuk
• Stack Overflow @RauboLuk