Apresentando o Engaslider: Um Carrossel de Imagens Leve e Independente com Vanilla JS

 

Desenvolver interfaces limpas e responsivas é sempre um desafio. Muitas vezes, ao precisar de um simples carrossel de imagens (slider), acabamos importando bibliotecas gigantescas e dependências pesadas, como jQuery, que incham nosso projeto desnecessariamente.

Foi pensando nisso que desenvolvi o Engaslider: um plugin de slider de imagens focado em simplicidade, construído 100% com JavaScript puro (Vanilla JS) e CSS puro. Sem frameworks pesados, sem dores de cabeça.

O que o Engaslider oferece?

O Engaslider foi desenhado para ser direto ao ponto. Ele entrega o que a maioria dos projetos precisa de forma extremamente leve:

• Transições Suaves (Fade): Animações criadas diretamente via @keyframes do CSS, garantindo performance pelo navegador.
• Múltiplas Formas de Navegação: Suporte a setas (próximo/anterior), navegação por "dots" (bolinhas circulares) e uma barra lateral/inferior de miniaturas (thumbnails).
• Autoplay Configurável: Basta passar a opção correta e o seu slider começa a rodar sozinho.
• Zero Dependências: Instale e use, simples assim.

 

A Evolução: Refatoração Recente e Boas Práticas

Recentemente, o projeto passou por uma importante análise e refatoração de código (v0.2) para se adequar aos mais rígidos padrões da web moderna (W3C).

O que mudou por debaixo dos panos?

1. Semântica HTML: Antigamente o script dependia de atributos id que se repetiam nas imagens (id="slider-image"). Isso foi totalmente limpo! Agora o motor de renderização busca de forma inteligente pelas classes, deixando o HTML 100% válido.
2. Limpeza no JavaScript: Reatribuições desnecessárias e variáveis soltas foram limpas, melhorando a velocidade de execução do script (slidershow.js).

O Futuro do Projeto: Rumo à Arquitetura Modular

O Engaslider está crescendo e os próximos passos já estão desenhados. A meta é tornar a biblioteca escalável o suficiente para competir com as grandes do mercado em termos de arquitetura. O plano (roadmap) inclui:

• Refatoração para POO (Orientação a Objetos): Vamos encapsular toda a lógica em uma Classe ES6. Isso permitirá que os desenvolvedores tenham quantos sliders quiserem na mesma página, sem que um interfira no outro.
• Customização via Variáveis CSS: Todo o estilo (cores, tamanhos, botões) será passado para Custom Properties (:root), permitindo que as equipes de design customizem o Engaslider mexendo em apenas 3 linhas de CSS!
• Sistema de Gestos (Swipe): Implementação de arraste para dispositivos mobile.

Teste você mesmo!

Se você está criando um site e não quer carregar bibliotecas enormes apenas para exibir algumas fotos, o Engaslider é para você.

O projeto é de código aberto e todos são bem-vindos para contribuir, sugerir melhorias ou utilizá-lo livremente!

👉 Acesse o repositório no Github e veja o código fonte
👉 Veja os Exemplos Rodando Online

Até a próxima, e bons códigos!

Pojeto GEDAS Grande aulas de computação

Como Criar um Simples Sistema Operacional(só o Kernel) com C++

Um REFÚGIO na INTERNET para VOCÊ! - GOPHER

Textos e Notas em Matemática e Computação

 

 Para encontrar textos e anotações deixarei abaixo alguns link sugeridos. Estarei mantendo um repositório de materiais distribuídos abertamente de domínio público para alunos.

 

Biblioteca Textos e Notas

Github Textos/Notas Repositório ( em construção )

Zeus Static Site Gerando Blog Estático com Python

Biblioteca Dimensão Alfa Textos Matemáticos & Hospedando Página no Github

Dimensão Alfa - Matemática & Arte Um Convite de Um Voluntario em Sua Jornada

Olá, sou Wandeson -- de algum lugar do interior  -- que aos quase 40 anos ainda sonha com uma universidade e mantêm as antigas paixões e admiração de quando criança pela matemática e pelas artes. Crescendo como um jovem nerd tímido que encontrava nos livros e nos estudos um refúgio e uma janela para um mundo diferente, mágico, onde por um instante era possível esquecer as dores e dificuldades da vida. Ao longo dos anos tive estudado sozinho por conta própria, com algumas pausas ao longo destes anos por problemas de saúde e financeiro. Mantendo-me estudando em meu ritmo -- um pouco mais lento que outros -- mas ativo, e tendo ao longo dessa jornada compartilhado o que tenho aprendido tentando ajudar voluntariamente outros que como eu amam estudar e buscar o conhecimento enxergando nele uma forma de libertar-se. 

 

Um de meus desenhos.

Atualmente venho iniciando a criação de conteúdo de forma voluntária para um canal que iniciei no YouTube onde diariamente compartilho questões de matemática básica, cálculo, geometria analítica além dos códigos que escrevo ( exemplo app web simples para visualizar textos no formato LaTex ) e coloco em minha página no Github.

 

 

Quem desejar apoiar-me nessa jornada e na criação de materiais pode contribuir apoiando através da página "Apoie - Como Contribuir". Este apoio servirá as despesas e manutenção desse meu trabalho de forma voluntaria e aberta acessível para todos(as).

Matemática, Computação & Arte Programando Minha Ferramenta de Desenho 1

Fundamentos de Matemática para Computação

 Videos

 

Textos 

1. Fundamentos de Matemática Para Computação, Judith L. Gersting;
2. Introdução á teoria da computação, Michael Sipser;
3. Teoria da Computação - Máquinas Universais e Computabilidade, Tiarajú Asmuz Diverio, Paulo Blauth Menezes;
4. Algorithms, Robert Sedgewick e Kevin Wayne;
5. "Introduction to the Theory of Computation", Michael Sipser;
6. "Concrete Mathematics", Ronald L. Graham, Donald E. Knuth e Oren Patashnik;

Build Your Own Lisp Learn C and build your own programming language in 1000 lines of code!

 

Ada Lovelace

Book guide about C language and create own programming language Lisp.

"If you're looking to learn C, or you've ever wondered how to build your own programming language, this is the book for you.

In just a few lines of code, I'll teach you how to use C, and together, we'll start building your very own language.

Along the way we'll learn about the weird and wonderful nature of Lisps, how to develop a real-world project, concisely solve problems, and write beautiful code!

This book is free to read online, so you can get started right away! But for those who want to show their support, or who want the best reading experience, this book is also available for purchase in print format, or for cheap in all major e-book formats."

Jornalismo & Computação

Há alguns anos me deparei com o uso da programação para raspagem de dados na internet seja por meio de APIs ou simplesmente varrendo páginas e páginas de HTML. O assunto me pareceu bem interessante e uma forma de praticar. Logo depois me deparei com uso dessas técnicas para áreas diversas e segmentos como jornalismo ou mesmo para Analise de Dados e trabalhos de pesquisa em machine learning, um ramo interessantíssimo da inteligência artificial. Assim pensei que poderia unir meu gosto pela programação com a matemática e quem sabe até a arte. 

Com a chegada de tecnologias como GPT, "generative pre-trained transformer", usado no chatGPT da openAI por exemplo bem como o "Stable Difusion" usado para geração de imagens comecei a imaginar as possibilidades e achei bem curioso o assunto. Claro que meu arcabouço ferramental técnico em matemática e computação ainda não me permitem desenvolver programas dentro destes tópicos. Considero que estes assuntos devem ser visto de forma cautelosa e mais rigorosa distante dos ruídos das grandes mídias e redes sociais para afastar-se da euforia e compreender que essas tecnologias tem suas limitações e se aplicam a problemas e situações especificas e que nem sempre entregarão os melhores resultados possíveis.

Uma das possibilidades que vi envolvendo as raspagem de dados, analise e machine learning foi acessando dados públicos do governo para analisar gastos por exemplo, como fiz para fins de estudos básicos e coloquei em meu repositório github neste link https://github.com/wsricardo/eda-tcs, onde é usados dados de contas do senado brasileiro como gastos de seus membros.

Acredito que essas tecnologias tem papel fundamental na democratização e acesso a informação provendo a população melhores recursos para tomadas de decisões quanto ao futuro de sua vida, empreendimentos e país. 

Recentemente, assim, resolvi criar um canal que usando um bot e crawler (agregador) de notícias que escrevi faz varredura em alguns portais e salva links de artigos jornalísticos para futuras consultas e os entrega em atualizações diárias em um canal do Telegram. No momento estou com mais de 1500 links de notícias salvos distribuídos em arquivos json. Acabo por usar estes quando necessito buscar algum tópico para criar meus cartuns, como o que publiquei recentemente sobre o "arcabouço fiscal". Estes projetos contudo são humildes e de fins didáticos servindo-me para estudo e ferramenta a auxiliar-me em algumas coisas.

Deixo abaixo alguns links. Outros são possíveis serem encontrados em meu Github ou aqui mesmo no blog.

Agradece ao leitor,

WSRicardo

Links

1. Meu Repositório Github

2. EDA-TCS (Acessando dados abertos sobre gastos do senado brasileiro).

3. Dados Abertos (CEAPS/Senado)

4. Programação de Computadores (básico)

IA para gerar horóscopo

Gerenciadores De Janelas ('Windows Manager' for Linux Operating System) Do Linux

 Procurando interface (GUI) gráficas para Linux mais simples e minimalistas deixo aqui esse pequeno post do canal Terminal Root que trás uma lista de sugestões e informações sobre cada sistema de janelas (interfaces) possíveis de se usar no Linux que são visualmente agradáveis e bem práticas de usar.

Tais interfaces podem ser bem uteis pra reduzir as distrações e informações presentes na tela do desktop quando precisamos parar para estudar ou digitar um trabalho no computador ou escrever códigos.

Na publicação intitulada "Os 25 Melhores Tiling Window Manager para seu Linux" é listado alguns sistemas de interface de gerenciamento de janelas (os 'window manager'). Tais sistemas incluem o i3wm, dwm, Openbox, AwesomeWM, QTile (escrito em Python), JWM (escrito em C e usando XLib minimo), Fluxbox, IceWM, WMII (programável, sistemas de arquivos 9p, gerenciamento de janelas clássico e lado a lado, base de código pequena e limpa. Link alternativo.).

Outro link sugerido é o https://suckless.org/ que é a home do dwm e outros código de aplicações focados em simplicidade e clareza.

Mais Informações

1. Lista de Comparações de sistemas X em genrenciamento de janelas comuns ao Linux, (Wikipedia);

2. 8 Top Window Managers on Linux (vídeo);

3. Window Managers On Linux All You Need to Know (vídeo);

4. Top 15 Window Managers For Linux, by FOSS Linux.

Pergunte a Notícia do Dia à Sofia

 

Quer saber qual as notícias principais mais recentes pergunte a Sofia sofia é um aplicativo que roda integrado ao Telegram e mantêm conjunto de dados das últimas notícias de portais como Band, BBC Brasil, G1/Globo, CNN Brasil. 

Você acompanhar as atualizações consultando diretamente o programa Sofia ou através do canal Sofia News.

12 Beginner Python Projects - Coding Course

Freecodecamp

ASMR Programming - Spinning Cube - No Talking

Canal bastante interessante gostei. Vídeos de programação de mini projetos.

ASCII Art Online

 Existem alguns portais para criação de artes modo ASCII ( imagens formadas por caracteres). Cito abaixo um que testei e achei bem interessante.

1. https://asciiflow.com

News Crawler

Agregador de Notícias e Bot Telegram

Sofia - Bot criado para Telegram 
(Nome da gata de rua que adotei há alguns anos.)

A gata "Sofia"

Há um tempo atrás havia tentado escrever um crawler de notícias bem simples para capturar as principais noticias da página inicial de três grandes portais de notícias brasileiros. Havia usado a linguagem Python e o ambiente do Jupyter Lab para criar de modo interativo o código e fazendo anotações sobre o código.

Por esses dias senti vontade de voltar ao código e fiz algumas alterações no arquivo do jupyter lab e inclui pequenas funções para salvar lista dos links das notícias. Após isso isolei o código em um pequeno módulo e criei um bot para o Telegram que permitia postar as notícias das atualizações dos portais em um canal no Telegram.

O código é simples e usa módulos Python como “Resquests” e “BeaultifulSoup” para acessar as páginas e pegar o html do site extraindo assim conteúdo como titulo e link das notícias da página inicial.

Nota: O bot acima mencionado usa API do Telegram para fins didaticos e utiliza-se do módulo news-crawler que é um agregador de notícias de portais veiculos de comunicação e jornalismo sérios. Assim o mesmo dentro da leis nacionais e normas da plataforma não serve-se e nem propõe-se para divulgação de notícias falsas (fake news) .

Deixo abaixo o link para o código no Github.

www.github.com/wsricardo/news-crawler

Para saber como apoiar este blog visite a página "Apoie"

Agradece,

Wandeson Ricardo

Let's build GPT: from scratch, in code, spelled out. (A ChatGPT case study by Andrey karpathy)