Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bake-js/-o-id-demo
Este é um projeto de demonstração que utiliza a biblioteca -O-id para criar um aplicativo simples de divisão de contas, chamado -O-id Splitter
https://github.com/bake-js/-o-id-demo
css html javascript shadowroot slot template webcomponet
Last synced: 1 day ago
JSON representation
Este é um projeto de demonstração que utiliza a biblioteca -O-id para criar um aplicativo simples de divisão de contas, chamado -O-id Splitter
- Host: GitHub
- URL: https://github.com/bake-js/-o-id-demo
- Owner: bake-js
- License: mit
- Created: 2024-07-04T20:18:31.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-08-16T11:26:31.000Z (3 months ago)
- Last Synced: 2024-08-17T04:19:07.997Z (3 months ago)
- Topics: css, html, javascript, shadowroot, slot, template, webcomponet
- Language: TypeScript
- Homepage: https://o-id-demo.pages.dev
- Size: 361 KB
- Stars: 2
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# -O-id Splitter Demo
Este é um projeto de demonstração que utiliza a biblioteca **-O-id** para criar um aplicativo simples de divisão de contas, chamado **-O-id Splitter**. Este demo destaca como usar componentes personalizados do **-O-id** para criar uma interface interativa e eficiente.
![Splitter](https://github.com/bake-js/-O-id-demo/blob/main/-O-id_Splitter.png)
## Visão Geral do Sistema
O **-O-id Splitter** é uma aplicação web interativa que permite aos usuários dividir o valor de uma conta entre várias pessoas, incluindo o cálculo da gorjeta. A arquitetura do sistema é composta por:
- **Frontend**: Desenvolvido em HTML, CSS e JavaScript, com componentes personalizados criados com a biblioteca **-O-id**.
- **Módulo de Eventos**: Gerenciamento de eventos assíncronos com o módulo **Echo** do **-O-id**, que permite a comunicação reativa entre componentes.
- **Servidor de Desenvolvimento**: Servidor local fornecido pelo Bun para desenvolvimento e testes.### Tecnologias Utilizadas
- **-O-id**: Biblioteca principal para a criação de componentes Web personalizados.
- **JavaScript**: Lógica do aplicativo e manipulação de componentes.
- **HTML**: Estrutura do aplicativo.
- **CSS**: Estilização da interface do usuário.
- **Bun**: Gerenciador de pacotes e servidor de desenvolvimento.### Diagrama de Contexto
No contexto do **-O-id Splitter**, o usuário interage com a interface web, que comunica com o backend através de eventos reativos. O diagrama de contexto seria simples, mostrando as interações básicas entre o usuário e o sistema através dos componentes de interface.
## Arquitetura Interna
Para mais detalhes sobre a arquitetura interna do **-O-id Splitter**, incluindo a estrutura de componentes e a lógica de negócio, consulte o índice abaixo:
- **[Arquitetura Interna do -O-id Splitter](https://github.com/bake-js/-O-id-demo/blob/main/src/README.md)**
- **[``](https://github.com/bake-js/-O-id-demo/blob/main/src/bill/README.md)**
- **[``](https://github.com/bake-js/-O-id-demo/blob/main/src/selectTip/README.md)**
- **[``](https://github.com/bake-js/-O-id-demo/blob/main/src/numberOfPeople/README.md)**
- **[``](https://github.com/bake-js/-O-id-demo/blob/main/src/splitter/README.md)**
- **[``](https://github.com/bake-js/-O-id-demo/blob/main/src/tipAmount/README.md)**
- **[``](https://github.com/bake-js/-O-id-demo/blob/main/src/total/README.md)**## Como Executar o Projeto
### Pré-requisitos
- Bun instalado
### Instalação
1. Clone o repositório:
```bash
git clone https://github.com/@bake-js/o-id-demo.git
```2. Navegue até o diretório do projeto:
```bash
cd o-id-demo
```3. Instale as dependências:
```bash
bun install
```### Executando o Projeto
Para iniciar o servidor de desenvolvimento:
```bash
bun dev
```Abra seu navegador e acesse `http://localhost:5173` para ver o aplicativo em ação.
## Sobre a Biblioteca -O-id
Para entender melhor como os componentes do **-O-id Splitter** foram implementados e explorar mais sobre as funcionalidades da biblioteca, visite o repositório oficial da [**-O-id**](https://github.com/bake-js/-o-id).
A biblioteca **-O-id** fornece um conjunto poderoso de ferramentas para criar e gerenciar componentes Web personalizados com facilidade. Com uma abordagem moderna e flexível, ela permite que desenvolvedores criem interfaces interativas e reativas, simplificando o desenvolvimento de aplicações complexas.
Confira a documentação detalhada, exemplos e tutoriais no repositório para aprofundar seu conhecimento e começar a utilizar o **-O-id** em seus próprios projetos.
## Contribuição
Contribuições são bem-vindas! Sinta-se à vontade para abrir issues ou enviar pull requests para melhorias ou novos recursos.
## Licença
Este projeto é distribuído sob a licença [MIT](https://choosealicense.com/licenses/mit/).