Skip to content

safaritrader/js-cli

Folders and files

NameName
Last commit message
Last commit date

Latest commit

79d47bc Β· Oct 14, 2024

History

2 Commits
Oct 14, 2024
Oct 14, 2024
Oct 14, 2024
Oct 14, 2024
Oct 14, 2024
Oct 14, 2024
Oct 14, 2024
Oct 14, 2024
Oct 14, 2024

Repository files navigation

Custom Javascript Command-Line Interface (CLI) Project

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.

Important

All of codes in this repository Made with the ChatGPT 🏳️  License

Features

  • 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

Launch the CLI Interface

  • 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.

Use the Command Creator

  • 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.

How to Add Custom Commands

  1. Open the Command Creator: Use the Command Creator page to build your commands.
  2. Define Commands: Enter command names, types, descriptions, and handler code.
  3. Generate Code: Click Generate Code to create the JavaScript code for your commands.
  4. Copy and Integrate: Copy the generated code and paste it into js/cli.js after the CLI initialization code.
  5. Test Your Commands: Reload the CLI page and test your new commands.

Project Structure

JS-CLI/ β”œβ”€β”€ index.html β”œβ”€β”€ cli.html β”œβ”€β”€ command_creator.html β”œβ”€β”€ css/ β”‚ └── style.css β”œβ”€β”€ js/ β”‚ β”œβ”€β”€ cli.js β”‚ └── command_creator.js └── README.md

Customization

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.

Acknowledgments

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.


Deploying to GitHub Pages

To host your site on GitHub Pages:

  1. Push Your Code to GitHub: Commit and push all your files to your GitHub repository.
  2. 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 or master).
    • Click Save.
  3. 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)

Final Notes

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!

πŸ“ž Contact

[Hassan Safari] - Telegram : @safari_trader - [email protected]

Project Link: https://github.com/safaritrader/js-cli