FD-UI-KIT

A web development ui kit library for reactjs by finedinemenu's devteam

• See Demo / Documentation

Please read this section before start to development.

First of all you have to install these plugins to your editor (vscode), but if you are using it another code editor or IDE install them for your them.

• Styled Component Syntax highlighting for VS Code

• ESLint Plugin for VS Code

• Prettier - Code formatter for VS Code

• EditorConfig for VS Code

If you don't use one of these Code Editor/IDE please check is your EDITOR/IDE exist or not please install Editor Config plugin for your Code Editor/IDE.

Linter / Commit Messages

While developing this library you should take an attention to linter rules, all of your codes and commit messages, because you can't do any development without checking by rules.

Notice: Before commit to changes, HuskyJs checking these commit messages / linter rules

If you get a lint's error when you commiting a message, you can check for eslint linter rules or if you get an error because of your commit message you can check below commit message types and examples or you can check from Conventional Commits.

Commit-lint Types

Examples:

git commit -m "feat: button component added"

git commit -m "docs(readme): server link added"

• build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
• ci: Changes to our CI configuration files and scripts (example scopes: Circle, BrowserStack, SauceLabs)
• chore: Updating packages,build project etc. (no production code change)
• docs: Documentation only changes
• feat: A new feature
• fix: A bug fix
• perf: A code change that improves performance
• refactor: A code change that neither fixes a bug nor adds a feature, when refactoring a production code, eg. renaming a variable.
• revert: A commit revert message
• style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
• test: Adding missing tests or correcting existing tests

For Documentation

We are using storybook to document the our ui kit

How to start development on this repo

To get this repo to your local development enviroment, run the below script in your terminal

git clone https://github.com/finedine/finedine-mobile-core-ui-kit && cd finedine-mobile-core-ui-kit && npm install && npm start

How to publish package on NPM

Before to publish package you should add NPM_TOKEN (access token) env to your local terminal or bash file.

For minor version

  npm run pub:minor

For patch version

  npm run pub:patch

For major version

  npm run pub:major