# Encurtador de links em Next.js Um encurtador de links pronto para publicar na [Dado](https://dado.cloud): cole um link comprido, receba um endereço curto e acompanhe quantas vezes ele foi aberto. Este repositório nasceu de um modelo da Dado. Cada `git push` na branch `main` publica uma versão nova do seu app, sozinho. ## O que tem aqui - `app/page.tsx`: a página (formulário, últimos links e "Sobre este deploy"). - `app/Encurtador.tsx`: a parte interativa da página (encurtar, copiar, lista). - `app/api/links/route.ts`: a API — `POST /api/links` cria, `GET /api/links` lista. - `app/[codigo]/route.ts`: a página de aviso `GET /`, que mostra para onde o link leva. - `app/[codigo]/ir/route.ts`: o redirecionamento `GET //ir` (302) e a contagem de cliques. - `lib/links.ts`: onde os links ficam guardados (na memória). - `lib/paginas.ts`: o HTML da página de aviso e da página de link que não existe. - `app/globals.css`: o visual. Mude à vontade. Não tem banco de dados: os links ficam na memória do app e **somem quando ele é publicado de novo**. Veja no fim como guardar de vez. ## Rodar no seu computador Precisa de Node.js 20.9 ou mais novo. ```bash git clone https://git.dado.cloud//encurtador-nextjs.git cd encurtador-nextjs npm install npm run dev ``` Abra http://localhost:3000. Quando o `git clone` pedir usuário e senha, use o usuário da sua conta de Repositórios e, como senha, o **token de Repositórios** (no painel da Dado, em Repositórios). O comando certinho do seu app aparece no painel, em Deploys, na visão geral do app. ## Mudar e publicar Edite o que quiser e mande para a Dado: ```bash git add . git commit -m "Minha primeira mudança" git push ``` O push na branch `main` publica uma versão nova. Dá para acompanhar o andamento em Deploys, no painel. ## Variável de ambiente de exemplo A mensagem em "Sobre este deploy" vem da variável `MENSAGEM_BOAS_VINDAS`. Para trocar, abra Deploys no painel, clique em "Variáveis de ambiente" no seu app, salve e publique de novo. No seu computador: ```bash MENSAGEM_BOAS_VINDAS="Oi, mundo" npm run dev ``` ## API ```bash # Encurtar curl -X POST https:///api/links \ -H 'Content-Type: application/json' \ -d '{"url": "https://exemplo.com.br/uma-pagina"}' # 201 {"codigo":"a1b2c3","url":"https://exemplo.com.br/uma-pagina","curto":"https:///a1b2c3","cliques":0,"criadoEm":"..."} # Últimos 20 links curl https:///api/links # 200 {"links":[...]} ``` `GET /` abre uma página de aviso com o endereço de destino e o botão "Continuar", que leva a `GET //ir`: ali o app soma um clique e redireciona (302) para o link original. O aviso existe porque o encurtador é público — sem ele, qualquer pessoa poderia usar o endereço do seu app para disfarçar um link de golpe. A API aceita chamadas de qualquer site (CORS aberto só em `/api/*`), então outro app seu pode usá-la. Para evitar abuso, cada IP cria no máximo 30 links a cada 10 minutos. ## Guardar os links de vez Para os links sobreviverem a uma nova publicação, ligue um Postgres no app (painel, em Deploys, aba "Banco de dados" do app). A conexão chega ao app na variável `DATABASE_URL`; aí é trocar o que está em `lib/links.ts` por consultas ao banco.