Coursera UI
An experiment to create reusable component library using the latest front-end technologies.
Table of Contents
How to Use
-
Clone the repo and run npm install
-
npm run storybook
and visit http://localhost:9000 (depends on the availability) and you'll see the stories
-
npm start
Run the actual app
-
npm run test
Run all the tests in tests directory and eslint
-
npm run test:only
Run tests without eslint
-
npm run test:w
Watch and run the tests
-
npm run lint
Lint the js files using airbnb's eslint and flow config
-
npm run lint:fix
Lint and try to fix some basic linting errors
-
npm run publish-storybook
Will publish the story at https://vidaaudrey.github.io/coursera-ui
-
Required Global Installations
npm install -g semantic-release-cli getstorybook
Feature List
Utilities
Components
Basic
Extended
Animation & Transition
Super Rich Components
Charts
Vendor Services
Composables (align with recompose)
Common States and Behaviors
Libraries
How to Contribute
-
Understanding Semantic Release
-
Commit Guidelines, format and tool.
-
Commit Types. RefAngular Git Commit Guidelines
- feat: A new feature
- fix: A bug fix
- docs: Documentation only changes
style: Changes that do not affect the meaning of the code (white-space, - formatting, missing semi-colons, etc)
- refactor: A code change that neither fixes a bug nor adds a feature
- perf: A code change that improves performance
- test: Adding missing tests
- chore: Changes to the build process or auxiliary tools and libraries such as - documentation generation
- build: changes that affect the build system or external dependencies
- ci: changes to travis
- revert: revert a previous commit
-
Scopes
-
Styleguides
- [Airbnb React Styleguide][airbnb-react]
Documentation
We use git wiki to manage all our documentations. You can edit it online or within our repo's docs directory. How to use git wiki as submodule
Testing
import sinon from 'sinon';
import { expect } from 'chai';
Coverage Reporting
Continuous Integration
We use Travis CI.
Deployment
Build
Something Missing?
with-styles
[airbnb-react]: https://github.com/airbnb/javascript/tree/master/react