
THIS.GUI
The goal is to automate the GUI generation process so users only pass data or configurations, and this.GUI handles the rest.
Getting Started:
Install this.gui
:
Open your terminal and run the following command to install the this.me
package:
npm install this.gui
Import this.GUI
in Your Project:
In the JavaScript file where you want to use this.gui
, import the thisGUI
class.
import thisGUI from 'this.gui';
Explanation of Grouping:
• Atomic: Smallest components that are not broken down further. Alert, Audio, Badge, Button, Caption, Checkbox, Container, Divider, Heading, Icon, Image, Label, Link , Loader, Paragraph, ProgressBar, RadioButton, RangeInput, Select, Slider, Snackbar, Spacer, Spinner, Tag, TextArea, TextInput, Toggle, Tooltip, Video.
• Molecules: Simple combinations of atomic components that together form a small UI feature.
Accordion, AudioPlayer, AvatarWithName, Breadcrumbs, ButtonGroup, Card, ComparisonTable, DataTable, FileUpload, FormField, Header, IconButton, ImageWithCaption, InputGroup, InputWithLabel, List, MediaCard, Modal, Navbar, Notification, PricingTable, SearchBar, Sidebar, VideoWithDescription.
• Organisms: More complex, combining molecules and atomic components to create larger, more detailed features. • Layout: Components related to structuring and organizing content across the page. • Templates: Layouts of full pages, combining organisms and layout components. • Pages: Complete and functional pages made up of templates and content. • Miscellaneous: Utility components that don’t fit into the above categories but provide important functions, such as popovers, overlays, and media controls.
What is All.This?
Modular Data Structures:
Each module in all.this represents a specific datastructure. These classes encapsulate the functionalities and data specific to their domain.
this.me - this.audio - this.text - this.wallet - this.img - this.pixel - be.this - this.DOM - this.env - this.GUI - this.be - this.video - this.dictionaries
Contribution
If you are interested in collaborating or wish to share your insights, please feel free to reach out or contribute to the project.