Em qual Estrutura / Pattern / Tecnologia você cria suas Libs Javascript hoje?

[napalmdev]

Olá a todos, nos últimos meses venho estudando com mais afinco sobre JS, e então resolvi criar uma lib que faz algumas alterações no DOM e mais algumas firulas, mais para estudos mesmo. E logo percebi que seria interessante utilizar uma estrutura mais profissional e modular para essa lib, já que o intuito é disponibilizar pra outros dev's, enfim comecei a estudar sobre Module Pattern e Revealing Module Pattern vendo alguns post do @fdaciuk, e acabei ficando na dúvida se utilizava o Module Pattern puro, ou partia para um Browserify pra utilizar o CommonJS ou então Webpack + Babel pra já ir aprendendo sobre ES2015. No meu caso, com dica do @fdaciuk resolvi fazer assim:

1. Partir da estrutura mais básica com Module Pattern
2. Passar pra Browserify
3. Portar pra Webpack + Babel para aprender os macetes do ES2015.

E você? Qual Estrutura / Pattern / Tecnologia você cria suas Libs Javascript hoje?

[matheuslc]

O que tu pode fazer é utilizar o UMD (Universal Module Definition), o que o UMD faz é verificar qual sistema de módulos a aplicação está usando e então disponibiliza a mesma. A vantagem do webpack é que ele faz o "inverso" disso, ele faz o que o UMD faz, mas na aplicação, ou seja, tu pode usar libs AMD, CommonJS etc e chamar com o webpack normalmente (usando a sintaxe de cada especificação).

[dleitee]

Esses dias vi em uma newsletter o rollup, to pensando em fazer uns testes com ele. Parece muito interessante.

[bernardodiasc]

To curtindo bem ES2015, usei os outros padrões e agora to nesse, a razão é que é a nova forma oficial (pelo menos durante esse ano, hehehe, zuera) de fazer as coisas e à prova de futuro ("future-proof"). Se não me engano as libs de modularização de js surgiram para dar corbertura nessa funcionalidade até então indisponível na linguagem, a ideia foi muito boa, varias opções surgiram, notável na história dessa questão é o padrão CommonJS que abriu terreno pra muita coisa foda, muitas provas de conceito e aplicações reais nesse meio tempo e de toda essa experimentação chegou no padrão proposto no ES2015. E sendo uma funcionalidade nativa da linguagem agora é uma questão de tempo até não precisarmos necessariamente de build step pra fazer isso e ainda assim as mesmas regras/sintaxe que se aplicam com babel vao continuar funcionando sem.

Um artigo muito bom sobre o assunto é https://addyosmani.com/writing-modular-js/ (o artigo é antigo mas ainda válido, ES2015 é o ES Harmony, foi chamado assim por um breve período um tempo atrás), e do mesmo autor o livro https://addyosmani.com/resources/essentialjsdesignpatterns/book/ (ainda não li, mas boto fé de ser muito bom).

[napalmdev]

legal @matheuslc , então como no meu caso tudo é muito novo e quero aprender progressivamente, vou começar pelo básico e criar uma interface legal pelo Module Pattern e depois vou portando pra uma solução universal como UMD.

@dleitee acho q o Addy Osmani postou algo sobre isso uns dias atrás né? Parece ser interessante mesmo.

@bernardodiasc boa cara vlw, vou ler esse artigo ________ e dar uma sapeada no livro.

[vitorbritto]

Nossa... existem muitos padrões para desenvolvimento. O importante a saber é que cada um se enquadra em uma finalidade e seu uso vai depender das necessidades do seu projeto.

Tenha sempre em mente que o seu código deve estar sempre em um alto nível de reuso e nem sempre você vai utilizar um mesmo padrão para todos os projetos.

Padrões para Design:

De Criação

• Builder
• Factory
• Singleton

De Estrutura

• Decorator
• Facade
• Proxy

De Comportamento

• Iterator
• Mediator
• Observer
• ...

Temos também os padrões para criação de objetos (namespaces, chain method, module, revealing, sandbox...), reuso de código, orientado à funções(memoization, currying, returning fn(), callback).

E ainda temos os padrões gerais:

• Como definir funções
• Uso adequado de estruturas condicionais
• Acesso a um objeto global
• Uso indiscriminado de variáveis globais
• Single var
• Hoisting
• Como otimizar estruturas de laços
• conversões com parseInt()
• entre outros...

Ou seja, tem padrão para tudo! Mas antes mesmo de aplicar no projeto, você precisa entender a necessidade do seu algoritmo, traçar um breve planejamento, fazer alguns rabiscos no papel, além de entender finalidade de cada padrão.

[vitorbritto]

Ah, ultimamente tenho utilizado o Browserify e muitas funções nos meus projetos (sem medo de ser feliz). =]

[matheuslc]

Aproveitando a deixa do @vitorbritto, caso queira estudar mais sobre Design Patterns, recomendo:

• Learning JavaScript Design Patterns - Addy Osmani - FREE
• JavaScript Patterns - Stoyan Stefanov

[napalmdev]

Vlw pelos links @matheuslc, e @vitorbritto como sempre uma aula, brigadão.

[jonniehenrique]

Atualmente, to usando Orientação a Objeto, via composição de Classes com Prototype. Com o ES6, vai ser mão na roda por seguir a mesma lógica, mudando basicamente a sintaxe.

https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript