Welcome to the Custom CLI project! This project provides an interactive command-line interface implemented in JavaScript, along with a GUI-based Command Creator to build custom commands and sub-commands.
- Interactive CLI: Navigate through commands and frameworks, execute actions, and receive feedback in real-time.
- Dynamic Command Hierarchy: Supports infinite nesting of commands and sub-commands.
- Command History Navigation: Use the up and down arrow keys to navigate through previous commands.
- Tree-Structured Help Display: Type
help
to see a hierarchical list of available commands. - Dark Dracula Theme: A visually appealing dark theme inspired by PyCharm's Dracula theme.
- GUI-based Command Creator: Build custom commands with specific handlers using a user-friendly interface.
Getting Started
- Open
cli.html
in your web browser. - Type commands into the input field and press Enter to execute them.
- Use
help
to see available commands.
- Open
command_creator.html
in your web browser. - Use the GUI to create custom commands and sub-commands.
- Generate the JavaScript code and integrate it into your CLI.
- Open the Command Creator: Use the Command Creator page to build your commands.
- Define Commands: Enter command names, types, descriptions, and handler code.
- Generate Code: Click Generate Code to create the JavaScript code for your commands.
- Copy and Integrate: Copy the generated code and paste it into
js/cli.js
after the CLI initialization code. - Test Your Commands: Reload the CLI page and test your new commands.
JS-CLI/ βββ index.html βββ cli.html βββ command_creator.html βββ css/ β βββ style.css βββ js/ β βββ cli.js β βββ command_creator.js βββ README.md
Feel free to modify and extend the project to suit your needs. You can:
- Add new commands and frameworks.
- Customize the theme and styles.
- Integrate additional features such as syntax highlighting or command auto-completion.
This project was developed to provide a flexible platform for creating interactive command-line interfaces in web environments. It combines practical functionality with an intuitive user experience.
To host your site on GitHub Pages:
- Push Your Code to GitHub: Commit and push all your files to your GitHub repository.
- Enable GitHub Pages:
- Go to your repository's settings.
- Scroll down to GitHub Pages.
- Under Source, select the branch you want to use (usually
main
ormaster
). - Click Save.
- Access Your Site: After a few minutes, your site will be available at:
https://<username>.github.io
(for user/organization sites)https://<username>.github.io/<repository>
(for project sites)
By following this guide, you should have a fully functional GitHub Pages site hosting your CLI project and command creator. Users can interact with the CLI directly in their browsers and use the Command Creator to build and customize commands.
This project demonstrates how JavaScript and HTML can be leveraged to create interactive web-based command-line interfaces. The use of classes, event handling, and dynamic DOM manipulation showcases modern web development techniques.
Feel free to share your project with others, contribute to its development, and explore new features and enhancements!
Enjoy building and customizing your CLI project!
[Hassan Safari] - Telegram : @safari_trader - [email protected]
Project Link: https://github.com/safaritrader/js-cli