Versão final dos slides da palestra
11
README.md
|
@ -0,0 +1,11 @@
|
|||
# Welcome to [Slidev](https://github.com/slidevjs/slidev)!
|
||||
|
||||
To start the slide show:
|
||||
|
||||
- `npm install`
|
||||
- `npm run dev`
|
||||
- visit http://localhost:3030
|
||||
|
||||
Edit the [slides.md](./slides.md) to see the changes.
|
||||
|
||||
Learn more about Slidev on [documentations](https://sli.dev/).
|
37
components/Counter.vue
Normal file
|
@ -0,0 +1,37 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
count: {
|
||||
default: 0,
|
||||
},
|
||||
})
|
||||
|
||||
const counter = ref(props.count)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div flex="~" w="min" border="~ main rounded-md">
|
||||
<button
|
||||
border="r main"
|
||||
p="2"
|
||||
font="mono"
|
||||
outline="!none"
|
||||
hover:bg="gray-400 opacity-20"
|
||||
@click="counter -= 1"
|
||||
>
|
||||
-
|
||||
</button>
|
||||
<span m="auto" p="2">{{ counter }}</span>
|
||||
<button
|
||||
border="l main"
|
||||
p="2"
|
||||
font="mono"
|
||||
outline="!none"
|
||||
hover:bg="gray-400 opacity-20"
|
||||
@click="counter += 1"
|
||||
>
|
||||
+
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
16
netlify.toml
Normal file
|
@ -0,0 +1,16 @@
|
|||
[build.environment]
|
||||
NODE_VERSION = "18"
|
||||
|
||||
[build]
|
||||
publish = "dist"
|
||||
command = "npm run build"
|
||||
|
||||
[[redirects]]
|
||||
from = "/.well-known/*"
|
||||
to = "/.well-known/:splat"
|
||||
status = 200
|
||||
|
||||
[[redirects]]
|
||||
from = "/*"
|
||||
to = "/index.html"
|
||||
status = 200
|
8076
package-lock.json
generated
Normal file
19
package.json
Normal file
|
@ -0,0 +1,19 @@
|
|||
{
|
||||
"name": "pybr2023-sem-janelas-quebradas",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "slidev build",
|
||||
"dev": "slidev --open",
|
||||
"export": "slidev export"
|
||||
},
|
||||
"dependencies": {
|
||||
"@slidev/cli": "^0.43.15",
|
||||
"@slidev/theme-default": "latest",
|
||||
"@slidev/theme-seriph": "latest",
|
||||
"create-slidev": "^51.6.2",
|
||||
"slidev-theme-vuetiful": "^0.3.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"playwright-chromium": "^1.52.0"
|
||||
}
|
||||
}
|
27
pages/multiple-entries.md
Normal file
|
@ -0,0 +1,27 @@
|
|||
# Multiple Entries
|
||||
|
||||
You can split your slides.md into multiple files and organize them as you want using the `src` attribute.
|
||||
|
||||
#### `slides.md`
|
||||
|
||||
```markdown
|
||||
# Page 1
|
||||
|
||||
Page 2 from main entry.
|
||||
|
||||
---
|
||||
src: ./subpage.md
|
||||
---
|
||||
```
|
||||
|
||||
<br>
|
||||
|
||||
#### `subpage.md`
|
||||
|
||||
```markdown
|
||||
# Page 2
|
||||
|
||||
Page 2 from another file.
|
||||
```
|
||||
|
||||
[Learn more](https://sli.dev/guide/syntax.html#multiple-entries)
|
BIN
public/acampamento.jpg
Normal file
After Width: | Height: | Size: 123 KiB |
BIN
public/agenda-lhc.png
Normal file
After Width: | Height: | Size: 431 KiB |
BIN
public/bicycle.jpg
Normal file
After Width: | Height: | Size: 1.6 MiB |
BIN
public/broken-window.jpg
Normal file
After Width: | Height: | Size: 129 KiB |
BIN
public/capybara.jpg
Normal file
After Width: | Height: | Size: 113 KiB |
BIN
public/design-patterns.png
Normal file
After Width: | Height: | Size: 26 KiB |
BIN
public/desorganizada-de-novo.jpeg
Normal file
After Width: | Height: | Size: 134 KiB |
BIN
public/desorganizada.jpeg
Normal file
After Width: | Height: | Size: 123 KiB |
BIN
public/discourse.png
Normal file
After Width: | Height: | Size: 75 KiB |
BIN
public/email-cryptorave.png
Normal file
After Width: | Height: | Size: 54 KiB |
BIN
public/mastodon.png
Normal file
After Width: | Height: | Size: 243 KiB |
BIN
public/organizada.jpg
Normal file
After Width: | Height: | Size: 147 KiB |
BIN
public/peertube.png
Normal file
After Width: | Height: | Size: 572 KiB |
BIN
public/qr-code-atlantic.png
Normal file
After Width: | Height: | Size: 22 KiB |
BIN
public/question-mark.jpg
Normal file
After Width: | Height: | Size: 73 KiB |
BIN
public/sala-lhc-arrumada.jpeg
Normal file
After Width: | Height: | Size: 113 KiB |
BIN
public/sopa-pedra.jpg
Normal file
After Width: | Height: | Size: 178 KiB |
BIN
public/tdd.png
Normal file
After Width: | Height: | Size: 14 KiB |
330
slides.md
Normal file
|
@ -0,0 +1,330 @@
|
|||
---
|
||||
title: 'Sem Janelas Quebradas: Mantendo Seu Ambiente Organizado'
|
||||
transition: slide-left
|
||||
layout: cover
|
||||
download: true
|
||||
---
|
||||
|
||||
# Sem Janelas Quebradas: Mantendo Seu Ambiente Organizado
|
||||
|
||||
## CryptoRave 2025 - São Paulo - SP
|
||||
|
||||
---
|
||||
layout: center
|
||||
background: './broken-window.jpg'
|
||||
class: 'text-white'
|
||||
---
|
||||

|
||||
|
||||
Photo by <a href="https://unsplash.com/@pawel_czerwinski?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Pawel Czerwinski</a> on <a href="https://unsplash.com/photos/brown-wooden-open-window-T3XUccTgw7s?utm_content=creditCopyText&utm_medium=referral&utm_source=unsplash">Unsplash</a>
|
||||
|
||||
---
|
||||
|
||||
# Renne Rocha
|
||||
|
||||
* Co-fundador do **Laboratório Hacker de Campinas** (https://lhc.net.br)
|
||||
|
||||
* Desenvolvedor Python 15+ anos
|
||||
|
||||
* Mantenedor do **Querido Diário** (https://queridodiario.ok.org.br/)
|
||||
|
||||
* <a href="https://go.rocha.social/@renne/">@rocha@rocha.social</a> 🐘 (Fediverso)
|
||||
|
||||
* @rennerocha (outras redes sociais)
|
||||
|
||||
* Marceneiro e Cervejeiro Caseiro (quando dá tempo)
|
||||
|
||||
* Slides em https://git.rocha.dev.br/rennerocha/talk-cryptorave-2025
|
||||
|
||||
---
|
||||
layout: center
|
||||
class: text-center
|
||||
---
|
||||
|
||||
> Psicólogos sociais e policiais tendem a concordar que **se uma janela de um prédio for quebrada e deixada
|
||||
> sem reparo, todo o resto das janelas logo estará quebrado**. Isto é tão verdadeiro em bairros agradáveis como em bairros degradados.
|
||||
> A quebra de janelas não ocorre necessariamente em grande escala porque algumas áreas são habitadas por
|
||||
> determinados quebradores de janelas, enquanto outros são habitados por amantes de janelas; em vez
|
||||
> disso, **uma janela quebrada não reparada é um
|
||||
> sinal de que ninguém se importa e, portanto, quebrar mais janelas não custa nada**.
|
||||
|
||||
**Broken Windows**
|
||||
|
||||
*por James Q. Wilson e George L. Kelling*
|
||||
|
||||
https://www.theatlantic.com/magazine/archive/1982/03/broken-windows/304465/
|
||||
|
||||
<img src="qr-code-atlantic.png" width="150px" />
|
||||
|
||||
<!--
|
||||
Artigo publicado em 1982 na revista The Atlantic Monthly
|
||||
-->
|
||||
|
||||
---
|
||||
layout: image-right
|
||||
image: /broken-window.jpg
|
||||
---
|
||||
# Entropia
|
||||
|
||||
* **Desordem** em um sistema
|
||||
|
||||
* De acordo com as leis da termodinâmica, ela sempre tende a **aumentar**
|
||||
---
|
||||
layout: center
|
||||
background: './desorganizada.jpeg'
|
||||
class: 'text-white'
|
||||
---
|
||||

|
||||
---
|
||||
layout: center
|
||||
background: './organizada.jpg'
|
||||
class: 'text-white'
|
||||
---
|
||||

|
||||
---
|
||||
layout: center
|
||||
background: './desorganizada-de-novo.jpeg'
|
||||
class: 'text-white'
|
||||
---
|
||||

|
||||
---
|
||||
layout: image-left
|
||||
image: /broken-window.jpg
|
||||
---
|
||||
|
||||
# Débito Técnico (ou Dívida Técnica)
|
||||
|
||||
* **Desordem** em um projeto que no longo prazo dificulta a sua evolução e manutenção
|
||||
|
||||
* Surge de decisões incorretas e/ou incompletas tomadas devido aos mais diferentes fatores como:
|
||||
* Pressões por prazo
|
||||
* Problemas em produção
|
||||
* Inexperiência da equipe
|
||||
|
||||
* É uma dívida que **provavelmente** não será paga
|
||||
|
||||
* Termo comum em projetos de software
|
||||
|
||||
---
|
||||
|
||||
# O que são janelas quebradas em software?
|
||||
|
||||
- Falta de visibilidade das tarefas
|
||||
|
||||
- Arquiteturas inadequadas
|
||||
|
||||
- Código sem testes
|
||||
|
||||
- Código mal escrito
|
||||
|
||||
- Falta de documentação
|
||||
|
||||
---
|
||||
layout: image-right
|
||||
image: /question-mark.jpg
|
||||
---
|
||||
|
||||
# Uma comunidade também tem suas "janelas" quebradas?
|
||||
|
||||
---
|
||||
layout: image-right
|
||||
image: /question-mark.jpg
|
||||
---
|
||||
|
||||
# Comunidades
|
||||
|
||||
- Um hackerspace
|
||||
|
||||
- Um projeto de código livre
|
||||
|
||||
- Organização de um evento
|
||||
|
||||
- Um canal em uma rede social
|
||||
|
||||
- ...
|
||||
|
||||
---
|
||||
layout: image-right
|
||||
image: /question-mark.jpg
|
||||
---
|
||||
|
||||
# Uma comunidade também tem suas "janelas" quebradas?
|
||||
|
||||
- Dificuldade de decisões
|
||||
|
||||
- Uso de ferramentas inadequadas
|
||||
|
||||
- Falta de comprometimento
|
||||
|
||||
- Falta de continuidade
|
||||
|
||||
- Pessoas agindo de maneira inadequada
|
||||
|
||||
---
|
||||
layout: center
|
||||
class: text-center
|
||||
---
|
||||
|
||||
# Como não quebrar mais janelas?
|
||||
|
||||
---
|
||||
layout: image-right
|
||||
image: /sopa-pedra.jpg
|
||||
---
|
||||
# Sopa de Pedra
|
||||
---
|
||||
|
||||
# Seja um catalisador de mudanças
|
||||
|
||||
- Pequenos passos, não tente corrigir tudo de uma vez
|
||||
|
||||
- Comece com o que você pode mudar sem pedir permissão
|
||||
|
||||
- **Pessoas preferem apoiar algo que já esteja funcionando com sucesso**
|
||||
|
||||
<br/><br/>
|
||||
<hr/>
|
||||
|
||||
>É mais fácil pedir perdão do que pedir permissão
|
||||
|
||||
*Grace Hopper*
|
||||
|
||||
---
|
||||
|
||||
# Lembre-se do quadro geral
|
||||
|
||||
- A maioria dos desastre começam muito pequeno para se notar
|
||||
|
||||
- Revise constantemente o que está acontecendo ao seu redor
|
||||
|
||||
- **Consciência situacional**
|
||||
|
||||
---
|
||||
layout: center
|
||||
class: text-center
|
||||
---
|
||||
|
||||
# Como começar?
|
||||
|
||||
---
|
||||
|
||||
# Documentação
|
||||
|
||||
- Inexistente
|
||||
|
||||
- Desatualizada
|
||||
|
||||
- Incompleta
|
||||
|
||||
- A comunidade precisa ter registro de suas regras, processos, decisões
|
||||
|
||||
- Não importa a ferramenta, comece a escrever, e dê pequenos passos para ir melhorando
|
||||
|
||||
- As pessoas precisam de tempo para se acostumar a ler e escrever. É necessário resiliência até se tornar algo cultural na comunidade
|
||||
|
||||
---
|
||||
|
||||
<img src="discourse.png" width="70%" />
|
||||
|
||||
https://discourse.lhc.net.br/
|
||||
|
||||
---
|
||||
|
||||
# Organização do Espaço (físico)
|
||||
|
||||
- Meu contexto principal de comunidade é em um espaço físico (hackerspace)
|
||||
|
||||
- Pequenas atitudes aos poucos vão alterando e melhorando o local
|
||||
|
||||
- Colocar *uma* coisa no lugar toda vez que estiver no espaço
|
||||
|
||||
- Não precisa querer organizar/limpar tudo de uma vez (mas as vezes é necessário fazer grandes organizações de uma vez)
|
||||
|
||||
- Um espaço organizado faz com que as pessoas queiram frequentá-lo
|
||||
|
||||
---
|
||||
layout: image-left
|
||||
image: /acampamento.jpg
|
||||
---
|
||||
|
||||
# Regra do Escoteiro
|
||||
|
||||
>Deixe o seu local de acampamento melhor do que quando o encontrou
|
||||
|
||||
---
|
||||
|
||||
<img src="sala-lhc-arrumada.jpeg" width="65%" />
|
||||
|
||||
---
|
||||
|
||||
# Código de Conduta
|
||||
|
||||
- Documento que estabelece comportamentos esperados das pessoas em sua comunidade/projeto
|
||||
|
||||
- Não era comum a alguns anos atrás, agora é mais fácil
|
||||
|
||||
- Importante não se tornar um documento que ninguém lê, nem aplica
|
||||
|
||||
- Definir processo para tomar atitudes em caso de quebra
|
||||
|
||||
- Revisões frequentes
|
||||
|
||||
- *Aqui não fazemos isso desta maneira*
|
||||
|
||||
---
|
||||
layout: image-left
|
||||
image: /bicycle.jpg
|
||||
---
|
||||
|
||||
# Tomada de decisões
|
||||
|
||||
- Discussões intermináveis
|
||||
|
||||
- O "não-padrão" do bicicletário
|
||||
|
||||
- Não é sempre que o consenso é a melhor maneira para se tomar uma decisão
|
||||
|
||||
<img src="design-patterns.png" width="100px" />
|
||||
Padrões de Projeto de Hackerspaces
|
||||
|
||||
---
|
||||
|
||||
# Plataformas abertas
|
||||
|
||||
- Plataformas abertas como cidadãs de primeira classe
|
||||
|
||||
- As vezes, você é o único que pensa em usar esta plataforma. Crie a conta, use! Insista!
|
||||
|
||||
<img src="email-cryptorave.png" width="200px" />
|
||||
|
||||
- **POSSE** dos nossos dados
|
||||
|
||||
---
|
||||
|
||||
<img src="agenda-lhc.png" width="60%" />
|
||||
https://eventos.lhc.net.br
|
||||
|
||||
---
|
||||
|
||||
<img src="mastodon.png" width="45%" />
|
||||
https://mastodon.com.br/@lhc
|
||||
|
||||
---
|
||||
|
||||
<img src="peertube.png" width="70%" />
|
||||
https://peertube.lhc.net.br
|
||||
|
||||
---
|
||||
|
||||
# Pequenos passos
|
||||
|
||||
<img src="tdd.png" width="400px" />
|
||||
|
||||
(mas não esqueça onde você quer chegar)
|
||||
|
||||
---
|
||||
layout: image-right
|
||||
image: /capybara.jpg
|
||||
---
|
||||
|
||||
# Obrigado!
|
BIN
slides.pdf
Normal file
7
vercel.json
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"rewrites": [
|
||||
{ "source": "/(.*)", "destination": "/index.html" }
|
||||
],
|
||||
"buildCommand": "npm run build",
|
||||
"outputDirectory": "dist"
|
||||
}
|