esy-react-cli is a minimalist, yet robust command-line interface tool designed to accelerate ReactJS development. By automating component creation and project scaffolding, esy-react-cli aims to boost developer productivity and efficiency. Named after the build tool it uses, "ESBuild", the CLI leverages cutting-edge technology to deliver a fast, lightweight, and user-friendly development experience. With optional AI-powered features, esy-react-cli offers intelligent code generation capabilities to further enhance the development process.

NOTE: The CLI maintains full functionality without AI integration, ensuring developers have complete control over their development experience.

esy-react-cli includes optional AI-powered features that are disabled by default and require explicit user opt-in to enhance the development experience. All AI capabilities are implemented with complete transparency - the source code is open for review on GitHub, and the project maintains a strict policy regarding API key management, where keys are never stored within the codebase. For security and privacy, users manage their own API keys locally through environment variables, with no keys ever transmitted to or stored on the project's servers. The CLI maintains full functionality without AI integration, ensuring developers have complete control over their development experience.

We believe in transparency and security. All AI capabilities are implemented with complete transparency - the source code is open for review on GitHub, and the project maintains a strict policy regarding API key management, where keys are never stored within the codebase. For security and privacy, users manage their own API keys locally through environment variables, with no keys ever transmitted to or stored on the project's servers. Read More

Minimal Footprint

Creating a project with `esy-react-cli` in no way locks you into using ESYR forever! The CLI is designed to be lightweight and non-intrusive, allowing you to switch to other tools or workflows at any time.

Streamlined React Building

Generate perfect pages and reusable components and hooks with `esyr component`, saving time and promoting consistency.

Scaffold Dynamic Directory Structures & File Structures

Override the default paths for **all** commands and scaffold using your own .

Transparent Security Read More

The AI capabilities are fully open-source and respect user privacy by enabling local API key.

Intelligent Scaffolding

Leverage AI-powered features to scaffold pages, components, and other project elements (optional).

Once installed, you can start using esy-react-cli to create new React projects and manage your components. Refer to the Commands section for a list of available commands and their descriptions.

Supported Models:

Id	Model	Vendor	API Access
claude-3-sonnet-20240229	Claude Sonnet (new)	Anthropic	https://www.anthropic.com/api
gpt-4o-mini	GPT-4o mini	OpenAI	https://platform.openai.com/docs/models/gpt-4o

1. npm i -g esy-react-cli

1. cd into the project directory
2. npm i
3. npm run link

Settings are stored in a .env file in the root of the project or cli installation. On first run of each command, the user will be prompted to set a custom path for future use of that command. The default structure is as follows:

{project name}/
├── public/
├── scripts/
├── src/
│   ├── pages/{page name}/
│   ├── components/{component name}/
│   ├── contexts/
│   ├── hooks/
│   ├── workers/
│   ├── content-scripts/
│   ├── pop-ups/

To clear out settings and any api keys set, run esyr reset.

Cmd	Short Cmd	Description	AI Support
esyr project	esyr p	Create a new react project	-
esyr page	N/A	Create a page in a react project	✓
esyr component	esyr c	Create a component in a react project	✓
esyr hook	esyr h	Creates a context + provider for a react project	✓
esyr context	esyr ctx	Creates a context + provider for a react project	-
esyr service-worker	esyr sw	Create a service worker in a react project	✓
esyr browser-ext	esyr ext	WIP - Initializes a react project as a browser ext (experimental)	-
esyr content-script	esyr cs	WIP - Creates a content script for a react project that has a browser ext (experimental)	-
esyr reset	esyr rs	Removes the local env file that has API keys and any user preferences.	-

• Fixed bug with esyr proj command not setting the project root properly.
• Service workers can now be generated with the esyr sw command.
• Added OpenAI's gpt-4o model as an option for code generation.
• esyr p is now a shortcut for esyr page

• esyr page and esyr component now offer code generation with Claude Sonnet.
• Optional path setting for all commands.
• Optional file overwrite for all commands. (existing files)
• Added a meta-DX feature to allow for ease of install locally.
• Config reset command added.
• Added fun messages to commands for a more enjoyable experience.

• Scaffold a new React project with esyr project and create various components.

We welcome contributions from the community! If you find any issues or have suggestions for improvements, please feel free to open a GitHub issue or submit a pull request.

If you excel at prompt engineering, please review my System Prompt! I'd love to hear your thoughts on how to improve it. Claude System Prompt

If you encounter any issues or bugs while using esy-react-cli, please report them on the GitHub Issues page. Use the provided issue template to ensure that your bug report contains all the necessary information for us to investigate and address the problem.

This project is licensed under the MIT License.