playground elm

|> playground-elm

Meu playground que uso para brincar com tecnologias sofisticadas e emocionantes. Este é para Elm.

Propósito

O objetivo deste playground é explorar, estudar e avaliar a língua Elm - uma linguagem deliciosa para aplicativos da web confiáveis.

As exibições devem ser:

• Simples : bastante simples e compreensível. Toda vitrine é implementada em um único arquivo ELM.
• Exploratório :
  • Destaque alguns aspectos da língua ELM, como imutabilidade, reatividade, desempenho e interoperabilidade com outras bibliotecas JS e estruturas CSS.
  • Explore alguns padrões de arquitetura/design em torno do spa estático/sem servidor reativo
• Jogável : o máximo possível, fornece um conteúdo útil e agradável.

? Mostrações

Visitar o? site de demonstração e jogue no seu navegador.

A demonstração é um spa puro (100% de aplicativo ao lado do cliente) escrito no ELM.

Lista de showcases:

• GLSL: Um efeito de eletricidade dinâmico WebGL criado com shaders GLSL, com rotação interativa 3D com inércia suave.

• Alternância de ondas sonoras: um botão de alternância simples da onda sonora renderizada no SVG.

• DAPP: Uma aplicação descentralizada direta (DAPP) que interfina com várias carteiras, utilizando o EIP-6963.

• Asteróides: Um clone simples dos asteróides de jogo clássico, implementado no ELM usando o padrão de sistema de componentes da entidade (ECS), renderizado com SVG.

• Termo: um terminal baseado na Web que avalia o código JavaScript usando portas ELM para interatividade.

• Física: Um mecanismo de física direto utilizando o algoritmo de integração do Verlet, renderizado em uma tela HTML5.

• Maze: Um gerador de labirinto criado usando o algoritmo de retrocesso recursivo.

• Relógio digital: uma demonstração do relógio digital, representado visualmente usando o SVG.

• Lissajous: Animação de figuras de Lissajous, retratadas em SVG.

• Calc: Uma calculadora básica projetada para operações aritméticas simples.

? Construção e corrida

Elm 0,19

O ELM 0.19 me quebrou como muitos outros codificadores, devido a muitas mudanças nos tópicos que usei neste projeto com a versão anterior:

• elm.json ARQUIVO
• JSON decodificando
• Conversões de String / Int / Float
• Aplicativo do navegador, roteamento
• Gerenciamento de URL
• Data Hora ( Posix , Zone )
• Muitos pacotes incompatíveis
• ...

Finalmente consegui migrar para esta nova versão, mas as instabilidades podem ser notadas.

Pré -requisitos

Certifique -se de ter o seguinte instalado corretamente:

• Node.js v18.17 (hidrogênio)
• PNPM v8.3

Construir

O projeto agora se baseia no Parceljs, um empregado de aplicativos da web que lida com a ELM construa gratuitamente.

No começo, todos os pacotes de nó que o qual o projeto depende deve ser instalado localmente. Isso pode ser feito com o seguinte comando:

pnpm install

A construção pode ser lançada com:

pnpm build

Em seguida, abra o arquivo ./dist/index.html no seu navegador.

Se você preferir, o site pode ser publicado por um servidor HTTP local. Nesse modo, se alguma alteração for detectada, a construção do projeto será iniciada novamente e o site atualizado automaticamente no navegador; o que é bom durante as fases de desenvolvimento.

A publicação é lançada com o seguinte comando:

pnpm serve

O site é acessível através do "/ endpoint.

? Tecnologias

• elm : Elm

  Com os seguintes pacotes (principal e não exaustiva):

  • Chadtech/Elm-vetor
  • AVH4/ELM-COR
  • CUDUCOS/ELM-FORMAT Number
  • ELM-Explorations/Markdown
  • Simonh1000/Elm-Colorpicker
  • Joakin/Elm-Canvas
  • wsowens/termo
  • MacCasouTreach/GraphicsVG
  • Harmboschloo/Elm-ECS
  • Brianhicks/Elm-Particle
  • EXPLORAÇÕES ELM/WEBGL
  • NPHOLLON/GEO3D

• parceljs : Web Application Bundler

• bulma : a estrutura CSS moderna

Licença

MIT © Chris Camel