Alkimia Framework

Overview

The Alkimia Framework (version 0.1.2) is a JavaScript framework that strives to minimize abstraction, encouraging developers to work directly with JavaScript and the HTML DOM. Unlike frameworks such as React, Alkimia emphasizes simplicity and direct manipulation of the DOM, making it easier to build dynamic web applications without the overhead of heavy abstractions. It includes a CLI tool to scaffold components interactively.

Key Principles

• Direct JavaScript Usage: By advocating the closest usage of JavaScript, Alkimia minimizes syntactic sugar, such as classical object creation. This approach enhances transparency and simplicity in code.
• Function Factory Approach: The CLI generates modules that use the function factory pattern to expose public methods while keeping properties and methods private.
• Singleton and Instance Constructors: Each module provides both a singleton and an instance constructor, offering flexibility in managing unique and multiple instances as needed.
• Encouraged Verbosity: To further reduce abstractions, the framework encourages verbosity. This ensures that the code remains clear and understandable, even for complex applications.
• View Module Creation: The CLI offers the option to create modules that require a view. In such cases, HTML and SCSS placeholder files are added automatically. Additionally, a playground folder is included in each module, providing an introduction to the component's usage, including data binding.

Features

• Component Creation: Easily generate new components with predefined structures.
• State Management: Utilize built-in state management utilities.
• Resource Management: Import and manage various resources with ease.
• View Module Creation: Create modules that require a view, including automatic generation of HTML and SCSS placeholder files and a playground folder for component usage and data binding.

Directory Structure

@alkimia/framework/
├── cli.js                    # CLI entry point
├── index.js                  # Main exports
├── src/
│   ├── createComponent.js    # Component generator logic
│   ├── modulesMaker.js       # Module templates
│   ├── makeResourcesImportable.js  # Resource bundling
│   └── vite.config.js        # Build config
├── components/               # Example generated components
│   └── LoginWith2fa/
├── sample/                   # Sample projects
├── package.json
├── eslint.config.mjs
└── README.md

Installation

To install the Alkimia Framework, you need to have Node.js and npm installed on your machine. Then, run the following command:

npm install -g @alkimia/framework

Usage

The Alkimia Framework includes a CLI tool for scaffolding components. After installation, run the CLI interactively:

alkimia

You'll be prompted for:

• Directory (e.g., src)
• Component name
• Options (e.g., include DOM, playground, states sample)

This generates a new component module in the specified directory with optional HTML, SCSS, and playground files.

For more details on state management or resource importing, see the generated component examples in the components/ directory or the @alkimia/lib documentation.

Contributing

If you wish to contribute to the Alkimia Framework CLI, please follow the guidelines below:

1. Fork the repository.
2. Create a new branch for your feature or bug fix.
3. Make your changes and commit them with descriptive messages.
4. Push your changes to your fork.
5. Create a pull request.

Authors

• InterSides (Marco Falsitta) - Initial work

License

This project is licensed under the ISC License - see the LICENSE file for details.