Skip to content

Commit 801d485

Browse files
committed
updated documentation
1 parent 827f212 commit 801d485

File tree

3 files changed

+122
-13
lines changed

3 files changed

+122
-13
lines changed

CONTRIBUTING.MD

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
## Contributing to m3ters.js: Building Clarity Together
2+
3+
We welcome contributions from passionate developers like you to help evolve m3ters.js and make it an even more powerful tool for interacting with the M3tering Protocol. We encourage contributions of all types, whether it's fixing bugs, adding new features, improving documentation, or simply suggesting ideas.
4+
5+
**Before you dive in, please take a moment to familiarize yourself with these guidelines:**
6+
7+
**Getting Started:**
8+
9+
* **Fork the repository:** Head over to the m3ters.js GitHub repository and click the "Fork" button. This creates a copy of the codebase in your own account, allowing you to make changes and submit them for review.
10+
* **Set up your development environment:** Make sure you have Node.js (version 19 or above) and npm installed on your system. Then, clone your forked repository locally and install the dependencies:
11+
12+
```bash
13+
git clone https://github.com/your-username/m3ters.js
14+
cd m3ters.js
15+
npm install
16+
```
17+
18+
* **Branching strategy:** We use feature branches for all bug fixes and new features. Please create a new branch for your contribution based on the `main` branch, and name it descriptively using the format `feature/your-contribution-name`.
19+
20+
**Making Changes:**
21+
22+
* **Follow our coding style:** We use Prettier and ESLint to maintain consistent code formatting and quality. Please run `npm run lint` before committing your changes to ensure they adhere to our conventions.
23+
* **Write clear and concise commit messages:** Your commit messages should briefly explain what you changed and why. Use a subject line that summarizes the change followed by a body that provides more details.
24+
* **Unit tests:** If you're adding new functionality, please write unit tests to ensure it works as expected. We use Jest for our unit testing framework.
25+
26+
**Submitting your Contribution:**
27+
28+
* **Push your changes to your forked repository:** Once you're happy with your changes, push them to your feature branch on your forked repository.
29+
* **Create a pull request:** Head over to your forked repository on GitHub and create a pull request from your feature branch to the `main` branch of the upstream repository. Be sure to provide a clear and concise description of your changes in the pull request description.
30+
* **Engage in the review process:** We encourage discussion and feedback on pull requests. Be patient and responsive to any comments or questions from the maintainers.
31+
32+
**Additional points to remember:**
33+
34+
* **Stay respectful and professional:** We strive to maintain a welcoming and inclusive community. Please treat everyone with respect and avoid any discriminatory or offensive language.
35+
* **Be mindful of scope:** Try to keep your pull requests focused on a single issue or feature. Larger changes should be broken down into smaller, more manageable pieces.
36+
* **Don't hesitate to ask for help:** If you encounter any problems or have any questions, feel free to reach out to the maintainers for assistance. We're happy to help!
37+
38+
**We appreciate your contributions to m3ters.js! Together, we can make it even better.**
39+
40+
**Happy coding!**

README.md

Lines changed: 81 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,92 @@
11
# `m3ters.js`
2-
React toolkit tailored to M3tering Protocol for handling ugly crypto strings
32

4-
## Features
5-
- **[M3ter Alias](./docs/m3ter-alias.md#m3ter-alias): Human-Readable Hashes:** Easily convert complex cryptographic strings into easily understandable and visually appealing human-readable hashes.
3+
Introducing m3ters.js, a React toolkit meticulously crafted to empower developers with seamless management of complex cryptographic strings within the M3tering Protocol.
64

7-
- **[M3ter Head](./docs/m3ter-head.md#M3ter-Head): Unique SVG Avatars** Generate one-of-a-kind SVG avatars that serve as distinctive visual representations for device DIDs and blockchain address strings commonly encountered in the M3tering Protocol.
5+
This versatile library empowers developers with:
86

9-
## Installation
7+
- **Seamless Integration:** Effortlessly incorporate m3ters.js components and functions into your React projects, streamlining development and reducing complexity.
108

11-
1. Add the `m3ters.js` component to your project using npm:
9+
- **Protocol Adherence:** Interact with M3tering Protocol elements confidently, ensuring compliance with protocol-specific requirements and best practices.
1210

13-
```bash
14-
npm install m3ters --save
15-
```
11+
## Featured React Components
12+
13+
### [M3ter Alias](./docs/m3ter-alias.md#m3ter-alias): Transform Unwieldy Identifiers
14+
15+
Effortlessly convert those eye-straining crypto strings into captivating and user-friendly aliases, seamlessly integrated within your React applications. Representing IDs in a way you can actually remember.
16+
17+
### [M3ter Head](./docs/m3ter-head.md#M3ter-Head): Unique SVG Avatars
18+
19+
Generate unique and captivating SVG avatars that serve as visual representations for device DIDs and blockchain addresses, enhancing user engagement and brand recognition.
20+
21+
## Installation Options
22+
23+
m3ters.js offers flexible installation methods to cater to your preferred workflow:
24+
25+
### 1. Using a Package Manager:
26+
27+
Open your terminal or command prompt and navigate to your project's root directory. Then, execute the following command:
28+
29+
- **npm:** `npm i --save m3ters`
30+
- **yarn:** `yarn add m3ters`
31+
32+
If you prefer a package manager other than npm or yarn, you can also try:
33+
34+
- **pnpm:** `pnpm install m3ters`
35+
- **Bower:** `bower install m3ters`
36+
37+
### 2. CDN Link:
38+
39+
- Include the following script tag in your HTML file:
40+
41+
```html
42+
<script src="https://unpkg.com/m3ters@latest/dist/m3ters.min.js"></script>
43+
```
44+
45+
### 3. Direct Download:
46+
47+
- Access the m3ters.js repository on GitHub: [here](https://github.com/iChristwin/m3ters.js/releases)
48+
- Download the latest `.zip` or `.tar.gz` file containing the library source code.
49+
- Extract the contents into your project's directory.
50+
- Import components directly from the extracted files.
51+
52+
## Usage
53+
54+
Added the React components from `m3ters.js` into code via named imports
55+
56+
```javascript
57+
import { M3terAlias, M3terHead } from "m3ters";
58+
```
59+
60+
See [M3ter Alias](./docs/m3ter-alias.md#m3ter-alias) and [M3ter Head](./docs/m3ter-head.md#M3ter-Head) for more usage documentation.
61+
62+
## Compatibility
63+
64+
The library was developed, tested and is guaranteed to function properly on
65+
66+
- node `19.0.0`
67+
- npm: `9.8.1`
68+
- react: `18.2.0`
69+
70+
Should also be compatible with all major desktop and mobile browsers including but not limited to
71+
72+
- Firefox
73+
- Chrome
74+
- Edge
75+
- Brave
76+
- Waterfox
1677

1778
## Example App
1879

19-
Check out my [demo m3ters](https://github.com/ichristwin/demo-m3ters) for a sample React project incorporating the `m3ters.js` library. Additionally, you can experience the live implementation of `m3ters.js` at https://m3ters.ichristwin.com.
80+
Check out the my example GitHub repo, [ichristwin/demo-m3ters](https://github.com/ichristwin/demo-m3ters). You could also experience the live implementation of at https://m3ters.ichristwin.com
2081

2182
### Other projects using `m3ters.js`
22-
-
83+
84+
-
85+
86+
## Contributing
87+
88+
See the [contributing docs](./CONTRIBUTING.MD) for more information on how to contribute code.
89+
90+
## Licensing
91+
92+
You are free to embed under the terms of the [CC0 1.0 Universal](./LICENSE) License.

docs/m3ter-alias.md

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ Effortlessly create captivating names that instantly distinguish each device, an
1111
import { M3terAlias } from "m3ters";
1212
```
1313

14-
2. Render the alias within your component, providing a unique seed string for generation:
14+
2. Render the alias within your component, providing your input string for conversion:
1515

1616
```jsx
1717
export default function Home() {
@@ -30,7 +30,6 @@ Effortlessly create captivating names that instantly distinguish each device, an
3030

3131
Inspired by a similar JavaScript library, [angry-purple-tiger](https://github.com/helium/angry-purple-tiger) developed by [Andrew Allen](https://twitter.com/allenan_) for the Helium Network.
3232

33-
3433
## Licensing
3534

3635
You are free to embed under the terms of the [CC0 1.0 Universal](./LICENSE) License.

0 commit comments

Comments
 (0)