Site pessoal de Ronny Arruda, desenvolvedor Java sênior full-stack.
Escrito à mão em HTML, CSS e JavaScript. Não tem framework, build nem dependências para instalar, e a página não faz nenhuma requisição externa: carrega 4 arquivos, todos do próprio domínio.
- Duas línguas: português em
/e inglês em/en/. - Tema escuro e claro, com a escolha salva no navegador.
- Seções de apresentação, serviços, skills, projetos, experiência e contato.
- Formulário de contato que monta o e-mail sem precisar de backend.
index.html página em português (pt-BR)
en/index.html página em inglês, mesma estrutura
styles/site.css todo o CSS, com os tokens de tema no topo
scripts/site.js tema, menu, digitação, barras e formulário
images/ronny.jpg foto de perfil (400x400)
Qualquer servidor estático serve:
npx serve .Abra http://localhost:3000. Também funciona abrindo index.html direto no navegador, já que não há requisições externas nem módulos.
O site abre no escuro. O botão de sol e lua na navbar alterna para o claro, e a escolha fica salva em localStorage (chave theme), valendo para as duas páginas.
Os dois temas são apenas conjuntos de variáveis CSS no topo de site.css (:root e [data-theme="light"]). Nenhuma outra regra sabe que existe tema, então para mudar cores basta mexer nesses dois blocos.
Cada página tem um <script> curto no <head> que aplica o tema antes da primeira pintura. Sem ele, a tela pisca clara. Se mudar a chave do localStorage, mude nos dois lugares: nesse script inline e em site.js.
Todos os ícones ficam num sprite SVG inline, no fim do <body>, entre a marca <!--ICON-SPRITE--> e o <script>. O uso é <svg><use href="#i-nome"/></svg>.
As marcas vêm do Simple Icons (CC0, sem exigência de atribuição). Os ícones de interface foram traçados à mão. O sprite é gerado por um script que fica fora do repositório. Para acrescentar um ícone, o caminho mais simples é colar mais um <symbol> no sprite das duas páginas.
As duas páginas são independentes: ao alterar uma, replique na outra.
O formulário de contato não tem backend. Ele monta um mailto: com o que foi preenchido e abre o programa de e-mail. Para trocar por um serviço como o Formspree, aponte o action do <form> para ele e remova o handler no fim de site.js.
Código e conteúdo são de Ronny de Arruda Pinho e Silva. O site não usa mais o template Creative CV nem qualquer código de terceiros, então não há exigência de atribuição no rodapé.