From 4eb7eeffa0251d4b5d465244f8d06561d7403385 Mon Sep 17 00:00:00 2001 From: Eugene Sokolov Date: Thu, 6 Feb 2020 20:46:34 +0300 Subject: docs: update README.md --- README.md | 45 +++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 43 insertions(+), 2 deletions(-) (limited to 'README.md') diff --git a/README.md b/README.md index d3e1001..f6e1f8f 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,44 @@ -# Benzin +

+ +**BENZIN** is a powerful React Material components library. It supplies you with cool pre-defined style, while assuring that your project will follow all [Material Design guidelines](https://material.io/). + + +# Getting started +## Installation +You can easily add **BENZIN** to your project with `npm`: +```bash +$ npm install react-benzin +``` +**BENZIN** works best in kick-starting new projects and allows you to focus on the functionality, while all the beauty will be maintained by our library. + +**TIP:** *Create-React-App with Typescript* is your GO-TO in most of the cases. [Learn more.](https://create-react-app.dev/docs/adding-typescript/) + +You can find a minimal usage example [here](src/index.tsx). + +## Functionality +**BENZIN** provides you with a bunch of cool components that greatly integrate with each other. + +[Explore](src/lib) `src/lib/` folder to see what's available. Documentation is yet to come, but for now you can enjoy type definitons. + +[Chrono-Cube](https://github.com/eug-vs/chrono-cube/) will also be a great example of usage, since it's the actual project which inspired us to create **BENZIN**. + + +# Explore NPM package online +https://www.npmjs.com/package/react-benzin + + +# Development +## Running live demo +To run a live example, clone a repo and execute following commands: +```bash +$ npm i +$ npm start +``` +It's worth noticing that presence of React-App in this repo forces us to split some configurations. For example, we have 2 `Typescript` configs: one for `react-scripts` to run live-demo, and the other one to build *distribution files*. + +## Running tests +```bash +$ npm test +``` +**NOTE**: this command assures that `ESlint` does not throw any warnings and exits with a *non-zero status code* otherwise. That means `CircleCI` tests would fail *even if a single warning is present*. Therefore, you should always locally test your changes before publishing them. -A powerful React Material components library. -- cgit v1.2.3 From 2e79b97a5862746552f5449085b3924e30d882d7 Mon Sep 17 00:00:00 2001 From: Eugene Sokolov Date: Thu, 6 Feb 2020 20:57:07 +0300 Subject: docs: add building and deploying info --- README.md | 9 +++++++++ 1 file changed, 9 insertions(+) (limited to 'README.md') diff --git a/README.md b/README.md index f6e1f8f..f26984e 100644 --- a/README.md +++ b/README.md @@ -42,3 +42,12 @@ $ npm test ``` **NOTE**: this command assures that `ESlint` does not throw any warnings and exits with a *non-zero status code* otherwise. That means `CircleCI` tests would fail *even if a single warning is present*. Therefore, you should always locally test your changes before publishing them. +## Building +We've decided to use `Typescript compiler` to transpile our code, since we think `Babel` is a bit of an overkill here. +```bash +$ npm run build +``` +This command will generate `dist/` folder ready for distribution, which you of course can explore. Note that `tsc` creates type definitions (`.d.ts`) for every corresponding `.js` file. It's very useful because consumers also get access to them. + +## Deploying +Deploying to `npm` is fully automated through **CircleCI**: simply tag a commit as a Release and it will do the job. -- cgit v1.2.3 From 1837dbee6424f1bb32454a7fc93c93009a01d37a Mon Sep 17 00:00:00 2001 From: Eugene Sokolov Date: Thu, 6 Feb 2020 21:55:00 +0300 Subject: docs: add shelds.io badges to README :fire: --- README.md | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'README.md') diff --git a/README.md b/README.md index f26984e..9a99ce1 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,11 @@

+[![](https://img.shields.io/github/v/release/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/releases) +[![](https://img.shields.io/circleci/build/github/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/commits/develop) +[![](https://img.shields.io/david/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/network/dependencies) +[![](https://img.shields.io/github/languages/code-size/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/releases) +[![](https://img.shields.io/npm/l/react-benzin)](https://github.com/eug-vs/react-benzin/blob/develop/LICENSE.md) + **BENZIN** is a powerful React Material components library. It supplies you with cool pre-defined style, while assuring that your project will follow all [Material Design guidelines](https://material.io/). -- cgit v1.2.3 From 1dbb0b039932f2b67a63264500a30da234d87eae Mon Sep 17 00:00:00 2001 From: Eugene Sokolov Date: Thu, 6 Feb 2020 22:05:14 +0300 Subject: docs: improve heading, remove logo.png --- README.md | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'README.md') diff --git a/README.md b/README.md index 9a99ce1..0587bd8 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,7 @@ -

+

+

BENZIN

+ +[React](https://reactjs.org/) Material components library. It supplies you with cool pre-defined style, while assuring that your project will follow all [Material Design guidelines](https://material.io/). [![](https://img.shields.io/github/v/release/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/releases) [![](https://img.shields.io/circleci/build/github/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/commits/develop) @@ -6,8 +9,6 @@ [![](https://img.shields.io/github/languages/code-size/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/releases) [![](https://img.shields.io/npm/l/react-benzin)](https://github.com/eug-vs/react-benzin/blob/develop/LICENSE.md) -**BENZIN** is a powerful React Material components library. It supplies you with cool pre-defined style, while assuring that your project will follow all [Material Design guidelines](https://material.io/). - # Getting started ## Installation -- cgit v1.2.3 From 33181ee0d10b8b82ba31259cda5bf0c9de5e32d3 Mon Sep 17 00:00:00 2001 From: Eug-VS Date: Thu, 6 Feb 2020 22:33:53 +0300 Subject: chore: v2.2.3 --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'README.md') diff --git a/README.md b/README.md index 0587bd8..b696beb 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@

BENZIN

- + [React](https://reactjs.org/) Material components library. It supplies you with cool pre-defined style, while assuring that your project will follow all [Material Design guidelines](https://material.io/). [![](https://img.shields.io/github/v/release/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/releases) -- cgit v1.2.3 From b8d32af56db1474017333aac44b386eb25b4d26d Mon Sep 17 00:00:00 2001 From: Eugene Sokolov Date: Thu, 6 Feb 2020 23:05:47 +0300 Subject: docs: improve badges --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'README.md') diff --git a/README.md b/README.md index b696beb..e84f316 100644 --- a/README.md +++ b/README.md @@ -3,8 +3,8 @@ [React](https://reactjs.org/) Material components library. It supplies you with cool pre-defined style, while assuring that your project will follow all [Material Design guidelines](https://material.io/). -[![](https://img.shields.io/github/v/release/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/releases) -[![](https://img.shields.io/circleci/build/github/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/commits/develop) +[![](https://img.shields.io/npm/v/react-benzin?logo=npm)](https://github.com/eug-vs/react-benzin/releases) +[![](https://img.shields.io/circleci/build/github/eug-vs/react-benzin?logo=circleci)](https://github.com/eug-vs/react-benzin/commits/develop) [![](https://img.shields.io/david/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/network/dependencies) [![](https://img.shields.io/github/languages/code-size/eug-vs/react-benzin)](https://github.com/eug-vs/react-benzin/releases) [![](https://img.shields.io/npm/l/react-benzin)](https://github.com/eug-vs/react-benzin/blob/develop/LICENSE.md) -- cgit v1.2.3 From c57197bd7fd37161c42a1a6fd272c6666c8a13a1 Mon Sep 17 00:00:00 2001 From: Eugene Sokolov Date: Fri, 7 Feb 2020 03:49:27 +0300 Subject: docs: add screenshot to README.md --- README.md | 2 ++ 1 file changed, 2 insertions(+) (limited to 'README.md') diff --git a/README.md b/README.md index e84f316..e528b03 100644 --- a/README.md +++ b/README.md @@ -20,6 +20,8 @@ $ npm install react-benzin **TIP:** *Create-React-App with Typescript* is your GO-TO in most of the cases. [Learn more.](https://create-react-app.dev/docs/adding-typescript/) +![Preview screenshot](https://user-images.githubusercontent.com/51545008/73991116-46b04f00-495c-11ea-9733-865bcc6c8807.png) + You can find a minimal usage example [here](src/index.tsx). ## Functionality -- cgit v1.2.3