slick-ui
is a component library based on Material-UI and the Material Design System. At the moment this is just a side project for fun, practice, and teaching.
This library is a collection of work I've done over the last few years that demonstrates my ui development capabilities. It's meant for use on my other side projects, not necessarily for use by the general public.
Frontend architecture, ui component development, accessibility, clean and maintainable code, user experience, documentation, and ui testing are my passions as a developer. I like to live where all of those things come together!
Things I'm playing around with for this project just to practice and learn...
- React.js
- Material-UI
- Semantic HTML
- styled-components (css-in-js)
- Jest and storybook testing
- eslint / stylelint
- Storybook
- Netlify
- CircleCI
- Codecov
- (not yet) tailwindcss (utility based css)
- (not yet) TypeScript
- (not yet) Custom HTML Elements (web components)
- Accessibility testing
Clone slick-ui
from GitHub - https://github.com/rturek/slick-ui
gh repo clone rturek/slick-ui
The project might work with previous versions, but I can only guarantee it works on these versions
- node v14.17.6
- npm v8.1.2
npm install
Run tests
npm run test
Update Snapshots
npm run test -u
Coverage report should be generated at coverage/lcov-report/index.html
npm run lint
npm run lint:css
npm run storybook
build-storybook -c .storybook -o static-storybook
Requires @storybook/cli
npx sb upgrade
Netlify pulls from the deploy-netlify-storybook
branch in this repo to deploy to the URL above. To start a new deploy, you should get deploy-netlify-storybook
up to date with main
OR push whatever changes you'd like to test to the deploy branch, and Netlify will automatically run the storybook static build and publish the updates when the branch is updated on GitHub.
git checkout deploy-netlify-storybook
git rebase main
git push