A collection of development tools and utilities Made by Patrick Made for Patrick Made (but feel free to use it for your own projects)
npm install patrick-mades-dev-toolsA collection of development tools and utilities for React and React Native projects, written in TypeScript.
``bashSetup a React/React Native development environment
pmdt setup-react-env
Installation
$3
`bash
Using npm
npm install -g patrick-mades-dev-toolsUsing yarn
yarn global add patrick-mades-dev-toolsUsing pnpm
pnpm add -g patrick-mades-dev-tools
`After installation, the
pmdt command will be available globally in your terminal.$3
`bash
Using npm
npm install patrick-mades-dev-toolsUsing yarn
yarn add patrick-mades-dev-toolsUsing pnpm
pnpm add patrick-mades-dev-tools
`$3
For projects using Corepack, you can specify PMDT as your packageManager in
package.json:`json
{
"packageManager": "npm@9.0.0"
}
`This ensures everyone working on the project uses the same package manager version, making the CLI commands consistent across environments.
Command Line Interface
The package provides a powerful CLI tool that gives you access to all available tools:
`bash
Basic syntax
pmdt [options]Examples:
pmdt setup-react-env --outputDir ./config
pmdt ai-prompts show refactor
pmdt list
`$3
| Command | Description |
| -------------------- | --------------------------------- |
|
pmdt list | List all available tools |
| pmdt help | Display help information |
| pmdt | Display help for a specific tool |
| pmdt-setup-react | Shortcut for setup-react-env tool |Available Tools
$3
Sets up a complete React/React Native development environment with TypeScript, ESLint, and Prettier.
CLI Usage:
`bash
Basic usage
pmdt setup-react-envWith options
pmdt setup-react-env --outputDir ./config --packageManager npmUsing the direct shortcut
pmdt-setup-react
`This tool will:
1. Install essential dependencies:
- ESLint with React and TypeScript plugins
- Prettier and its ESLint integration
2. Create configuration files:
-
.prettierrc - Prettier configuration
- .eslintrc.js - ESLint configuration for React/TypeScript
- .vscode/settings.json - Optimized VSCode settings
- tsconfig.json - TypeScript configuration for ReactOptions:
-
--outputDir - Directory where configuration files will be created (default: current directory)
- --packageManager - Package manager to use (default: yarn)
- --dryRun - Run without actually installing dependencies$3
A collection of AI prompts for various coding tasks, which can be used with Cursor or other AI coding assistants.
CLI Usage:
`bash
List all available prompts
pmdt ai-prompts listShow a specific prompt
pmdt ai-prompts show Copy a prompt to clipboard
pmdt ai-prompts copy Browse prompts interactively
pmdt ai-prompts browse
`Using in Your Projects Programmatically
The package is written in TypeScript and includes type definitions. When importing the package in your TypeScript projects, you'll get full type support:
`typescript
import pmdt from 'patrick-mades-dev-tools';// Run a tool programmatically
await pmdt.runTool('setup-react-env', {
outputDir: './config',
packageManager: 'npm',
});
// Get all available tools
const tools = pmdt.getTools();
`Common CLI Workflows
$3
`bash
Create a new React project
npx create-react-app my-app
cd my-appSet up TypeScript, ESLint and Prettier
pmdt setup-react-envStart development
npm start
`$3
`bash
Browse available prompts interactively
pmdt ai-prompts browseOr list all prompts
pmdt ai-prompts listCopy a specific prompt to clipboard
pmdt ai-prompts copy refactor
`Extending with New Tools
You can create your own tools by following these steps:
1. Create a new directory in the
src/tools directory with your tool name (e.g., src/tools/my-new-tool)
2. Create an index.ts file in your tool directory with this structure:`typescript
import { ToolDefinition, CommandResult } from '../../types';interface MyToolOptions {
option1?: string;
booleanOption?: boolean;
}
const myNewTool: ToolDefinition = {
id: 'my-new-tool', // Unique ID for the tool
name: 'My New Tool', // Display name
description: 'Description of what your tool does',
// Options for your tool (optional)
options: {
option1: {
description: 'Description of option1',
default: 'defaultValue',
},
booleanOption: {
description: 'A boolean flag',
type: 'boolean',
default: false,
},
},
// The main function that will be executed
execute: async (options: MyToolOptions): Promise => {
// Your tool implementation
console.log('Tool executed with options:', options);
return { success: true };
},
};
export default myNewTool;
`All tools are automatically discovered and registered when the package loads.
Development
$3
`bash
Clone the repository
git clone https://github.com/PatrickMade/devtools.git
cd devtoolsInstall dependencies
npm installBuild the project
npm run buildTest CLI locally
node dist/bin/pmdt.js --help
`$3
-
npm run build - Build the TypeScript source files
- npm run lint - Run ESLint on the source files
- npm run lint:fix` - Fix linting issues automaticallyMIT
Patryk Madaj