Primeiros passos com o ScreenLaps

Bem-vindo ao blog do ScreenLaps! Esta primeira publicação também serve como um tour pelo próprio mecanismo do blog — cada título, lista, bloco de código e imagem abaixo está aqui para demonstrar um recurso real do pipeline de Markdown que alimenta esta página, não apenas para ocupar espaço.

#Por que o ScreenLaps

O ScreenLaps combina uma extensão de navegador leve com um painel na nuvem construído sobre o Laravel, para que cada captura de tela e gravação que você fizer fique organizada, pesquisável e compartilhável em um só lugar. Se tiver alguma dúvida no caminho, nossa página de contato é a forma mais rápida de falar com a equipe.

"A melhor ferramenta de captura é aquela que você esquece que ainda está rodando em segundo plano." — todo usuário do ScreenLaps, mais cedo ou mais tarde.

#Capturando sua primeira tela

Existem duas formas de trazer mídia para sua biblioteca:

#Usando a extensão do navegador

1. Instale a extensão na loja do seu navegador.
2. Clique no ícone do ScreenLaps e escolha capturar área, página inteira ou gravar tela.
3. Sua captura é enviada automaticamente e aparece na biblioteca do painel em poucos segundos.

#Usando upload por arrastar e soltar

• Abra a página Biblioteca no seu painel.
• Arraste qualquer arquivo .png, .jpg ou .webm para a página.
• Organize-o em uma pasta assim que o upload terminar.

#Blocos de código e destaque de sintaxe

Todo bloco de código deste blog é destacado no servidor — nenhum JavaScript do lado do cliente é necessário. É basicamente assim que as próprias ações de backend deste site são estruturadas:

 1final class ShowBlogPostAction
 2{
 3    public function execute(string $locale, string $slug): array
 4    {
 5        $document = Prezet::getDocumentModelFromSlug("{$locale}/{$slug}");
 6
 7        return [
 8            'document' => Prezet::getDocumentDataFromFile($document->filepath),
 9            'body' => Prezet::parseMarkdown(
10                Prezet::getMarkdown($document->filepath)
11            )->getContent(),
12        ];
13    }
14}

#Componentes Blade dentro do Markdown

Depois deste parágrafo há um componente Blade real, renderizado no servidor de dentro deste arquivo Markdown:

Esse é o tour completo — do frontmatter e das tags até imagens, destaque de código e Blade dentro do Markdown. Boa escrita!