open-index/open-npm huggingface dataset:
npm package: @frontops/redux-crud
Description: > Improve your redux experience!
Author: Pavel Belugin aka @frontops
Latest version: 0.1.2

# redux-crud | FrontOps
> Improve your redux experience!

[![NPM Version][npm-image]][npm-url]
[![Build Status][travis-image]][travis-url]
[![Downloads Stats][npm-downloads]][npm-url]

# DISCLAIMER
## DO NOT USE THIS, IT'S ALPHA VERSION

## Features

Best redux crud for the faster development.

![](header.png)

## Installation

```sh
npm i -D @frontops/redux-crud
```


## Contributing

1. Fork it (<https://github.com/pashaigood/frontops/fork>)
2. Create your feature branch (`git checkout -b feature/fooBar`)
3. Commit your changes (`git commit -am 'Add some fooBar'`)
4. Push to the branch (`git push origin feature/fooBar`)
5. Create a new Pull Request

<!-- Markdown link & img dfn's -->
[npm-image]: https://img.shields.io/npm/v/@frontops/redux-crud.svg?style=flat-square
[npm-url]: https://npmjs.org/package/@frontops/redux-crud
[npm-downloads]: https://img.shields.io/npm/dm/@frontops/redux-crud.svg?style=flat-square
[travis-image]: https://img.shields.io/travis/dbader/node-@frontops/redux-crud/master.svg?style=flat-square
[travis-url]: https://travis-ci.org/dbader/node-@frontops/redux-crud
[wiki]: https://github.com/pashaigood/frontOps/wiki
npm package: @frontpack/frontpack
Description: webpack configuration helper and presets.
Author: frontainer
Latest version: 2.0.0

# frontpack

webpack configuration helper and presets.

# Usage

```
npm i --save-dev frontpack
```

webpack.config.js
```
'use strict';
const frontpack = require('frontpack'); // load frontpack

const fp = new frontpack({
  debug: false, // debug mode (default false)
  verbose: true // echo information (default true)
});

const config = fp
  .preset([
    'common',  // use @frontpack/preset-common
    'babel',   // use @frontpack/preset-babel
    'style',   // use @frontpack/preset-style
    'server',  // use @frontpack/preset-server
    // './my-preset/my.js',    // local config
    // 'frontpack-external-preset'  // external package
  ])   // load from preset
  .config({ // your webpack config
    entry: {
      main: [
        './src/assets/js/main.js',
        './src/assets/css/style.scss'
      ]
    }
  }).option({   // preset options
    copy: [],   // copy {from: '/path/from/file', to: '/path/to'}
    options: {  // loader options

    }
  }).export();  // export webpack config object
module.exports = config;
```

## Preset

### preset-common

基本設定をまとめたプリセット
 
```
npm i -D @frontpack/frontpack-preset-common
```

### preset-babel

babelを使うためのプリセット
 
```
npm i -D @frontpack/frontpack-preset-babel
```

### preset-typescript

typescriptを使うためのプリセット
 
```
npm i -D @frontpack/frontpack-preset-typescript
```

### preset-html

HTMLを生成するためのプリセット
 
```
npm i -D @frontpack/frontpack-preset-html
```

### preset-style

SASS/CSSをビルドして生成するためのプリセット
 
```
npm i -D @frontpack/frontpack-preset-style
```

### preset-sprite

複数の画像からスプライト画像とscssを生成するためのプリセット
 
```
npm i -D @frontpack/frontpack-preset-sprite
```

### preset-dll

簡単にDLLファイルを生成するためのプリセット

- 要 preset-common 

```
npm i -D @frontpack/frontpack-preset-dll
```

### preset-server

開発用サーバーを立ち上げるプリセット

- 要 preset-common 

```
npm i -D @frontpack/frontpack-preset-server
```

### preset-angular

- 要 preset-html 
- 要 preset-style 

angular(2.x)のためのプリセット
 
```
npm i -D @frontpack/frontpack-preset-angular
```

## Examples

## API

frontpack.preset

frontpack.config

frontpack.option

frontpack.export

frontpack.strategy

- document coming soon...

## Custom preset

- document coming soon...

## Examples

### frontpack-example-standard

Babelを使った汎用Web制作テンプレート
[frontpack-example-standard](https://github.com/frontainer/frontpack-example-standard) 

### frontpack-example-angular

angular(2.x)を使った開発のためのテンプレート
[frontpack-example-angular](https://github.com/frontainer/frontpack-example-angular) 

## ToDo

- update documentation
- unit testing
- preset-react
- preset-vue
npm package: @frontplus-ui/button
Description: A button allows a user to perform an action, with mouse, touch, and keyboard interactions.
Author: Muhammad Zeeshan
Latest version: 1.0.11

# @frontplus-ui/button

A button allows a user to perform an action, with mouse, touch, and keyboard interactions.

This component heavilly depends on `@frontplus-ui/theme`. Because theme package contains all component styles and TailwindCSS plugin.

## Features

- Accessible – Uses a native button element under the hood, with support for the Space and Enter keys.
- Cross-browser – Mouse, touch, keyboard, and focus interactions are normalized to ensure consistency across browsers and devices.

for more details refer to this [blog post](https://react-spectrum.adobe.com/blog/building-a-button-part-1.html)

## Installation

1.  lets assume you have setup TailwindCSS. If not please refer to this [guide](https://tailwindcss.com/docs/installation)
2.  set path and plugin

    ```js
    // file: tailwind.config.js
    import { frontplusui } from "@frontplus-ui/theme";

    export default {
      content: [
        // includes theme package so tailwindcss generate component styles],
        "./node_modules/@frontplus-ui/theme/dist/**/*.{js,jsx}",
      ],
      // add plugin because @frontplus-ui uses custom configurations
      plugins: [frontplusui()],
    };
    ```

3.  install button component

    ```bash
    pnpm add @frontplus-ui/button
    # or
    yarn add @frontplus-ui/button
    # or
    npm i @frontplus-ui/button
    ```

## API Reference

is in progress

## Usage/Examples

```js
import { Button } from "@frontplus-ui/button";

function App() {
  return <Button>frontplus ui</Button>;
}
```

## Licence

This project is licensed under **MIT license**
npm package: @frontplus-ui/react-utils
Description: This package contains utilities for react
Author: Muhammad Zeeshan
Latest version: 1.1.6

# @frontplus-ui/react-utils

This package contains utilities for react

## Installation

```bash
pnpm add @frontplus-ui/react-utils
# or
yarn add @frontplus-ui/react-utils
# or
npm i @frontplus-ui/react-utils
```

## API Reference

is in progress

## Licence

This project is licensed under **MIT license**
npm package: @frontplus-ui/shared-utils
Description: This package contains common used utilities
Author: Muhammad Zeeshan
Latest version: 1.0.5

# @frontplus-ui/shared-utils

This package contains common used utilities

## Installation

```bash
pnpm add @frontplus-ui/shared-utils
# or
yarn add @frontplus-ui/shared-utils
# or
npm i @frontplus-ui/shared-utils
```

## API Reference

is in progress

## Licence

This project is licensed under **MIT license**
npm package: @frontplus-ui/theme
Description: In this package you can find the TailwindCSS plugin and component styles.
Author: Muhammad Zeeshan
Latest version: 1.0.9

# @frontplus-ui/theme

In this package you can find the TailwindCSS plugin and component styles.

## Installation

```bash
pnpm add @frontplus-ui/theme
# or
yarn add @frontplus-ui/theme
# or
npm i @frontplus-ui/theme
```

## API Reference

is in progress

## Usage/Examples

```js
// file: tailwind.config.js
import { frontplusui } from "@frontplus-ui/theme";

export default {
  // add plugin because @frontplus-ui uses custom configurations
  plugins: [frontplusui()],
};
```

## Licence

This project is licensed under **MIT license**
npm package: @frontplus-ui/use-media-query
Description: Subscribe and respond to media query changes with useMediaQuery.
Author: Muhammad Zeeshan
Latest version: 1.0.5

# @frontplus-ui/use-media-query

Subscribe and respond to media query changes with useMediaQuery.

The useMediaQuery hook leverages the window.matchMedia API to subscribe to CSS media query changes, thereby providing real-time responsiveness to dynamic changes in the viewport or screen orientation. It allows the component to rerender whenever the media query’s result changes. It throws an error if attempted to be used on the server-side (media queries only work in the browser).

## Installation

```bash
pnpm add @frontplus-ui/use-media-query
# or
yarn add @frontplus-ui/use-media-query
# or
npm i @frontplus-ui/use-media-query
```

## API Reference

is in progress

## Licence

This project is licensed under **MIT license**
npm package: @frontplus-ui/use-ripple
Description: This hook is used to add ripple effect in all elements except void elements
Author: Muhammad Zeeshan
Latest version: 1.0.6

# @frontplus-ui/use-ripple

This hook is used to add ripple effect in all elements except void elements

- [elements](https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics#anatomy_of_an_html_element "acceptable elements")
- [void elements](https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics#void_elements)

## Installation

```bash
pnpm add @frontplus-ui/use-ripple
# or
yarn add @frontplus-ui/use-ripple
# or
npm i @frontplus-ui/use-ripple
```

## API Reference

is in progress

## Licence

This project is licensed under **MIT license**
npm package: @frontpoint/github-actions-mcp
Description: MCP server for automatically generating and optimizing GitHub Actions workflows based on project analysis
Author: frontpoint
Latest version: 0.1.0

# @frontpoint/github-actions-mcp

MCP (Model Context Protocol) server for generating GitHub Actions workflow files from project analysis.

## Features

- **Project Analysis**: Automatically detect project type, languages, package managers, test frameworks, and more
- **Workflow Generation**: Generate optimized CI/CD workflows based on project analysis
- **Multiple Templates**: Support for CI, CD, Test, Lint, Build, Release, Docker, Security, and more
- **Smart Defaults**: Sensible defaults based on detected project configuration

## Installation

```bash
npm install -g @frontpoint/github-actions-mcp
```

Or with npx:
```bash
npx @frontpoint/github-actions-mcp [project-path]
```

## Usage with Claude Code / MCP

Add to your MCP configuration:

```json
{
  "mcpServers": {
    "github-actions": {
      "command": "npx",
      "args": ["@frontpoint/github-actions-mcp", "/path/to/project"]
    }
  }
}
```

## Available Tools

| Tool | Description |
|------|-------------|
| `gha-init` | Initialize GitHub Actions configuration |
| `gha-analyze` | Analyze project for workflow generation |
| `gha-status` | Show current configuration status |
| `gha-generate` | Generate workflow files |

## Workflow Templates

- **ci**: Continuous Integration (build, test, lint)
- **cd**: Continuous Deployment
- **test**: Test-only workflow
- **lint**: Linting workflow
- **build**: Build and artifact upload
- **release**: npm/package release
- **docker**: Docker build and push
- **security/codeql**: Security scanning
- **dependency-update**: Dependabot auto-merge
- **pages**: GitHub Pages deployment

## Example

```bash
# Initialize
gha-init

# Analyze project
gha-analyze

# Generate CI workflow
gha-generate --template ci

# Generate Docker workflow
gha-generate --template docker
```

## Supported Project Types

- Node.js (npm, yarn, pnpm)
- Python (pip, poetry)
- Go
- Rust
- And more...

## License

MIT
npm package: @frontpoint/metrics-dashboard-mcp
Description: MCP server for generating Grafana dashboards and Prometheus alerting rules from application metrics
Author: frontpoint
Latest version: 0.1.0

# @frontpoint/metrics-dashboard-mcp

MCP (Model Context Protocol) server for generating Grafana dashboards and Prometheus alerting rules.

## Features

- **Dashboard Generation**: Create Grafana dashboard JSON files from templates
- **Alert Rules**: Generate Prometheus alerting rules YAML
- **Multiple Templates**: Node.js, HTTP API, Database, Redis, Kubernetes, Docker, System
- **Ready to Import**: Generated files can be directly imported into Grafana/Prometheus

## Installation

```bash
npm install -g @frontpoint/metrics-dashboard-mcp
```

Or with npx:
```bash
npx @frontpoint/metrics-dashboard-mcp [project-path]
```

## Usage with Claude Code / MCP

Add to your MCP configuration:

```json
{
  "mcpServers": {
    "metrics-dashboard": {
      "command": "npx",
      "args": ["@frontpoint/metrics-dashboard-mcp", "/path/to/project"]
    }
  }
}
```

## Available Tools

| Tool | Description |
|------|-------------|
| `metrics-init` | Initialize Metrics Dashboard configuration |
| `metrics-status` | Show current configuration status |
| `metrics-generate-dashboard` | Generate Grafana dashboard JSON |
| `metrics-generate-alerts` | Generate Prometheus alerting rules |

## Dashboard Templates

- **nodejs**: Node.js application metrics (CPU, memory, event loop, heap)
- **http-api**: HTTP API metrics (request rate, latency, errors)
- **database**: Database metrics (queries, connections, errors)
- **redis**: Redis metrics (commands, memory, hit rate)
- **kubernetes**: Kubernetes cluster metrics (pods, nodes, resources)
- **docker**: Docker container metrics (CPU, memory, network)
- **system**: System metrics (CPU, memory, disk)

## Example

```bash
# Initialize
metrics-init

# Generate Node.js dashboard
metrics-generate-dashboard --template nodejs --title "My App Dashboard"

# Generate HTTP API alerts
metrics-generate-alerts --template http-api --name "API Alerts"
```

## Generated Files

- Dashboards: `.metrics-mcp/dashboards/*.json`
- Alerts: `.metrics-mcp/alerts/*.yml`

Import dashboards via Grafana UI or API. Add alert rules to Prometheus configuration.

## License

MIT
npm package: @frontrockets/redux-abstract-action
Description: Organize Actions in react-redux applications
Author: Eugene Zhlobo
Latest version: 0.0.1

_This is part of @datarockets infrastructure_

## Install

```
yarn add @frontrockets/redux-abstract-action
```

## Usage

```jsx
import createAbstractAction from '@frontrockets/redux-abstract-action'

const fetch = createAbstractAction('Namespace/fetch', {
  // Here we specify functions which will generate a payload according to
  // arguments (we can specify generators for `init`, `success` and `failure`
  // actions)
  init: id => ({ id }),
  success: data => data,
})

fetch.init(10)
//- { type: 'Namespace/fetch/INIT', payload: { id: 10 } }

fetch.success({ name: 'Eugene' })
//- { type: 'Namespace/fetch/SUCCESS', payload: { name: 'Eugene' } }

fetch.failure()
//- { type: 'Namespace/fetch/FAILURE', payload: {} }

fetch.INIT
//- 'Namespace/fetch/INIT'

fetch.SUCCESS
//- 'Namespace/fetch/SUCCESS'

fetch.FAILURE
//- 'Namespace/fetch/FAILURE'
```
npm package: @frontrockets/requester
Description: Interface wrapper over Axios lib for making ajax requests
Author: ezhlobo
Latest version: 0.0.3

_This is part of @datarockets infrastructure_

## Install

```
npm install frontrockets/requester
```

## Usage

### Requester uses Axios under the hood, expect relevant to Axios config

```jsx
import Requester from "@frontrockets/requester";

const api = new Requester({
  baseURL: process.env.REACT_APP_API,
  withCredentials: true,
  injectHeaders: () => ({
    Authorization: `Bearer ${SessionToken.get()}`,
  }),
  transformResponse: (response) => response.data,
});

api.get("/some-url");
api.post("/some-url");
api.patch("/some-url");
api.delete("/some-url");
```
npm package: @frontseed/roll-call
Description: Service dependency checks for a JSON health endpoint
Author: Attila Beregszaszi
Latest version: 0.1.0

# Roll Call

A module to provide upstream dependency checks for service health endpoints

[![Build Status](https://travis-ci.org/frontseed/roll-call.svg?branch=master)](https://travis-ci.org/frontseed/roll-call)

## Requirements

This module is written with standards ES2015 and up and does not use any transpilers.  
The required NodeJS engine is `>8.6`.

## Usage

The module should work with any web framework.

```js
const rc = require('@frontseed/roll-call')

const checks = rc.configure({
  // Check a simple HTTP endpoint if it returns 200.
  mySimpleWebCheck: new rc.WebCheck('https://example.com/status'),

  // Add options and a custom callback to execute your own response checks.
  myComplexWebCheck: new rc.WebCheck(
    // URL to check.
    'https://example.com/other',
    // Options passed to the underlying Axios web client.
    {
      validateStatus: () => true,
      timeout: 5000
    },
    // Callback to run on response.
    res => (res && !res.error ? rc.up() : rc.down(res))
  ),

  // Add a raw check to check on any custom dependency such as a socket connection.
  myRawCheck: new RawCheck(() => {
    const result = myInternalCheck()
    return result ? rc.up() : rc.down()
  })
})
```

The `configure()` method here returns a function which returns a Promise.  
This promise resolves to a an object containing a status code and a JSON payload to serve in a health endpoint payload 
with a web framework of your choice. Add your own handler to cater for this.

## Credits

This is a simplified, more modern and framework agnostic variant of `@hmcts/nodejs-healthcheck`.