Porque a tela está sendo gravada somente no Tray, tá?

O problema que o material coloca

O material abre a restrição assim: Galera, esse vídeo tem como único objetivo te mostrar do zero como se usar o Tray, tá? Então a gente vai passar por todas as ferramentas que você vai utilizar aqui dentro, eu vou te mostrar tudo do zero, a parte das configurações, de como utilizar o agente, de como pedir as coisas, e nesse meio tempo a gente vai tentar criar um projeto aqui do zero e finalizar ele com vocês, tá? Então, se você está acostumado com plataformas estilo Lovable, estilo Bolt, V0, enfim, plataformas web, e você nunca utilizou algo assim, talvez você se sinta um pouco ansioso no começo, mas é por isso que você está aqui nesse vídeo e é nesse vídeo que eu vou te ensinar a mexer nisso aqui do zero, tá?

Então primeiramente, se você baixou o Tray já aí no seu PC, presumo que sim, e que você já tem a sua conta ou que você está pensando em começar a utilizar, mas nesse vídeo eu não vou te mostrar como que você baixa nem instala, até porque acho que isso é algo muito simples e que acredito que a gente pode pular essa parte, né? Bom então aqui é o visual inicial da sua ideia eu vou fazer um vídeo sem cortes tá então promete algumas coisas eu vou ficar vai ficar um pouco repetitivo mas aqui ó então aqui na parte de configurações tá é para abrir essa parte configurações eu vou onde aqui em cima você tem esse perfilzinho aqui ele é onde está as configurações a sua ideia do seu perfil e e aqui eu posso trocar de tema, trocar de língua Mas. E aqui está nossa nossa primeira configuração finalizada tá aqui na parte de configurações galera você não vai precisar mexer em nada tá porque hoje em dia as configurações já vem tudo pronto né você não precisa necessariamente mexer alguma coisa aqui também não tem muita coisa para você mexer sinceramente então se você vem aqui no tab você vai ver que tem coisas que provavelmente você nem vai entender o que que.

Então por exemplo se você trabalha em uma empresa, se você vai utilizar o Tray em uma empresa, talvez seja interessante você utilizar o modo privado, tá? Porque a tela está sendo gravada somente no Tray, tá? Então dessa forma você vai conseguir abrir o seu projeto localmente, sem você precisar usar o GitHub, que a gente vai ver daqui a pouquinho.

Para `abrir-projeto-github-codigo-exemplo-precisar`, preserve só o que muda uma decisão observável esta semana. Se o trecho for opinião, rotule como opinião — não fabrique métrica ausente do áudio.

Como o fluxo aparece na pratica

No miolo do episódio, o mecanismo fica explícito: Então se eu tenho um projeto que é somente um arquivo, por exemplo um site em HTML, por exemplo, um arquivo .md, que é um documento geralmente, Então eu posso abrir diretamente o arquivo sem precisar abrir a pasta e depois abrir o arquivo. GitHub é como se ele salvasse versões do seu código Então ele serve para você versionar o que a gente chama de seu código Então, para você não correr o risco de estar começando o seu projeto E perder alguma coisa, ou fazer alguma cagada e precisar voltar no código e não ter como O GitHub serve justamente para isso Nesse vídeo eu vou abordar o GitHub também, então pode ficar tranquilo quanto a isso Mas ele serve. E geralmente, quando a gente trabalha com projetos de SAS, de micro-SAS, aplicativos, a gente usa sempre o GitHub, tá?

Então por exemplo estou aqui no novo agora vocês estão vendo meu novo aí tá eu estou aqui com esse projeto em aberto é somente um site uma página de vendas que eu fiz eu fiz essa página de vendas aqui ontem com o coldre tá você quer ver o vídeo tá por aí também no meu canal mas qualquer ideia aqui vamos salvar esse projeto no novit hub que tá no caso já tá aqui tá então quando você inicia um projeto aqui no novo. Aqui eu tenho as pastas do meu código, que são essas pastas que você está vendo aqui, tá? E basicamente é isso, aqui ele vai salvar as versões do seu código, a gente não precisa ver isso profundamente agora, mas aqui, por exemplo, nas branches, as branches servem justamente para isso.

Então o GitHub vai ter o seguinte, as branches, ele começa com uma branch especificamente, que é a main, que você está vendo aqui na tela, essa main é onde fica a versão principal do seu código. Então, se eu estou com o meu projeto em aberto no Trey, por exemplo, e eu quero criar, eu quero fazer uma nova implementação de uma nova função no meu aplicativo. Dessa forma eu vou salvar a versão do código anterior, que está na main, e vou desenvolver isso em uma outra versão do meu código, sem alterar a versão que eu já salvei.

Para `abrir-projeto-github-codigo-exemplo-precisar`, preserve só o que muda uma decisão observável esta semana. Se o trecho for opinião, rotule como opinião — não fabrique métrica ausente do áudio.

Decisoes e trade-offs do episodio

As decisões práticas que aparecem no áudio: Se você não salvar o seu código, se você não prestar atenção nisso, a chance de você fazer alguma cagada depois é muito grande. Você não consegue ter a versão, não consegue voltar e tal, então não comete esse erro, por isso que eu esqueci que essa parte do GitHub tá logo no começo da aula, porque é super importante que você use GitHub, tá? Então se eu copiar esse link aqui, ó, e eu vim no meu tray, vim no meu tray e vim aqui, ó, clone em Git repositório, eu vou colar aqui o link ó nesse momento ele abriu uma pasta do meu Windows aqui tá vocês não estão vendo porque não tá mostrando para vocês mas eu vou criar a pasta que agora no meu Windows que ele me pediu colocar aqui o nome de site tá só para gente ter um exemplo vou deixar lá site e vou.

Cada projeto que você tem no LoveBall, no V0, no Bolt, você pode usar o link do KitHub e sempre que você usar esse link e trazer isso de lá pra cá, seja do Tray, pro cursor, pro WindSurfer, é sempre da mesma forma você vai poder fazer modificações daqui e depois enviar de novo para o lovable, para o zero e para o bolt se você quiser continuar de lá então como é que eu faço isso? Enviar daqui do trail lá para o lovable de novo é pelo commit e pelo push, mas depois a gente vê isso não se preocupe com isso agora então eu estou aqui com esse projeto em aberto então você vê que se eu. A primeira coisa que eu faço quando abro um projeto é instalar as dependências desse projeto e aprender a ver a preview do projeto, aqui no no play ele já vai para ele automaticamente que eu tenho o browser aqui dentro né mas para instalar dependência a gente faz como eu vou aqui em terminal vou aqui em novo terminal e aqui eu dou um npm e é esse comando aqui tá há uma coisa que eu esqueci de falar que a gente.

Então sempre que você for usar npm run dev, que é para ver a preview do seu aplicativo, npm run build, enfim coisas que você vai utilizar lá mais pra frente, você vai precisar ter o Node.js instalado no seu computador inclusive se você não instalar, o próprio trem vai pedir pra você instalar, então instalei aí, tá? Não precisa esperar pra instalar, instale agora antes que você esqueça de fazer isso então vai lá nodegs.tech barra download e já baixa lá, tá? Então baixem aí e vamos agora voltar para o tray aqui tá então aqui no tray para a gente instalar as dependências como eu falei você vai dar o npm é por isso que eu pausei a aula para te mostrar que você vai precisar instalar esse node.js tá então dei o npm aqui ele vai carregar ele vai carregar ele vai agora nesse momento ele tá lendo o package.json que é essa pasta aqui tá essa pasta tá vendo que ela tem várias.

Para `abrir-projeto-github-codigo-exemplo-precisar`, preserve só o que muda uma decisão observável esta semana. Se o trecho for opinião, rotule como opinião — não fabrique métrica ausente do áudio.

Armadilhas que o transcript revela

Onde o fluxo costuma quebrar, segundo a fonte: É só a questão de dar o comando ali para ele abrir o servidor. Eu estou aqui com o meu terminal aberto, com esse terminal aberto aqui eu dou um npm run dev npm run dev, então você simplesmente dá esse comandinho aí, acho que você tá vendo bem aí, e dar enter, ele vai abrir esse link para você aqui, tá vendo? Funciona também, vai funcionar do mesmo jeito que você funcionaria aqui dentro do Trey, mas vamos aproveitar que o Trey tem isso nativamente, e a gente vai usar isso a nosso favor daqui a pouco que vocês vão ver.

E você vai aqui ó do ladinho aqui tá vendo que tem um preview então aqui nessa nesse menuzinho que a gente já já já veio também quer eu vou aqui em preview ele abriu esse esse navegador aqui tá vendo então eu só vou aqui ó na barra de pesquisa e vou dar um local roxa e tá dois dois traços 8080 ó tá vendo que ele abriu o meu projeto aqui dentro então dessa forma eu consigo ver tudo tudo Tá? E aqui, galera, dentro dessa preview do navegador, do Trey, eu tenho acesso ao que lá no cursor a gente chama de MCP do navegador, né? Se, por exemplo, vou dar um exemplo que eu sempre vejo na minha comunidade.

E nesse select, eu tenho acesso aos elementos que estão em HTML, salvos em HTML. Alterar esse botão para uma fonte maiúscula, por exemplo. Aqui ele abriu outro servidor, mas eu já tenho um servidor em aberto, né?

Para `abrir-projeto-github-codigo-exemplo-precisar`, preserve só o que muda uma decisão observável esta semana. Se o trecho for opinião, rotule como opinião — não fabrique métrica ausente do áudio.

Como levar isso para o seu contexto

Traduzindo o trecho para um time que não viu o vídeo: Vocês estão vendo a tela do meu notebook aqui na frente, tá? Como que eu aceito e como que eu rejeito? Seria a gente ficar pedindo, pedindo, pedindo, pedindo a mesma coisa e não conseguir fazer aquilo que você está pedindo.

Então você não quer que ele faça isso, você quer modificar e criar coisas que são específicas. Como você é iniciante, você provavelmente não vai utilizar muito essa função de file, tá? Para ir lá porque ela vai saber onde eu quero modificar aquilo que eu estou solicitando então se por exemplo eu sei onde é o arquivo que por exemplo eu sei onde é a pasta que eu tenho que modificar uma coisa eu faço isso entrega isso como contexto para a ata então é super importante que você entrega o contexto show e aqui em box é eu posso adicionar um doc aqui você não vai utilizar isso aqui porque você vai.

Eu tenho um vídeo sobre isso aqui no canal, tá? Até eu não utilizo isso, até porque eu não sou programador, então dificilmente você vai utilizar se você não for programador, tá? É um exemplo chulo, mas é mais ou menos isso aí.

Para `abrir-projeto-github-codigo-exemplo-precisar`, preserve só o que muda uma decisão observável esta semana. Se o trecho for opinião, rotule como opinião — não fabrique métrica ausente do áudio.

Sinais de que a aplicacao funcionou

Para fechar o ciclo com evidência do próprio material: E nesse documento tem uma lista de fases para implementar aquilo que eu pedi para ela. Enfim, o prompt em si não é somente a mensagem que você escreve, sim o contexto que você entrega para a IA. Um mcp de design, por exemplo, magic wire, enfim, mcp do contact 7, você vai ter que utilizar o builder with mcp porque é só ali que ele vai conseguir ter mcp tá, então vamos clicar aqui para a gente ver, e aqui ó, mcp servers need to be added, o que ele tá falando, para você utilizar mcp você precisa adicionar os mcp né, obviamente, então vamos aqui, go to add, e aqui ele vai ter uma lista de marketplace de mcp.

Galera, esse vídeo tem como único objetivo te mostrar do zero como se usar o Tray, tá? Então a gente vai passar por todas as ferramentas que você vai utilizar aqui dentro, eu vou te mostrar tudo do zero, a parte das configurações, de como utilizar o agente, de como pedir as coisas, e nesse meio tempo a gente vai tentar criar um projeto aqui do zero e finalizar ele com vocês, tá? Então, se você está acostumado com plataformas estilo Lovable, estilo Bolt, V0, enfim, plataformas web, e você nunca utilizou algo assim, talvez você se sinta um pouco ansioso no começo, mas é por isso que você está aqui nesse vídeo e é nesse vídeo que eu vou te ensinar a mexer nisso aqui do zero, tá?

Então primeiramente, se você baixou o Tray já aí no seu PC, presumo que sim, e que você já tem a sua conta ou que você está pensando em começar a utilizar, mas nesse vídeo eu não vou te mostrar como que você baixa nem instala, até porque acho que isso é algo muito simples e que acredito que a gente pode pular essa parte, né? Bom então aqui é o visual inicial da sua ideia eu vou fazer um vídeo sem cortes tá então promete algumas coisas eu vou ficar vai ficar um pouco repetitivo mas aqui ó então aqui na parte de configurações tá é para abrir essa parte configurações eu vou onde aqui em cima você tem esse perfilzinho aqui ele é onde está as configurações a sua ideia do seu perfil e e aqui eu posso trocar de tema, trocar de língua Mas. E aqui está nossa nossa primeira configuração finalizada tá aqui na parte de configurações galera você não vai precisar mexer em nada tá porque hoje em dia as configurações já vem tudo pronto né você não precisa necessariamente mexer alguma coisa aqui também não tem muita coisa para você mexer sinceramente então se você vem aqui no tab você vai ver que tem coisas que provavelmente você nem vai entender o que que.

Para `abrir-projeto-github-codigo-exemplo-precisar`, preserve só o que muda uma decisão observável esta semana. Se o trecho for opinião, rotule como opinião — não fabrique métrica ausente do áudio.

Recortes adicionais da fonte

Estes trechos reforçam o raciocínio sem resumir genérico:

Galera, esse vídeo tem como único objetivo te mostrar do zero como se usar o Tray, tá? Então a gente vai passar por todas as ferramentas que você vai utilizar aqui dentro, eu vou te mostrar tudo do zero, a parte das configurações, de como utilizar o agente, de como pedir as coisas, e nesse meio tempo a gente vai tentar criar um projeto aqui do zero e finalizar ele com vocês, tá? Então, se você está acostumado com plataformas estilo Lovable, estilo Bolt, V0, enfim, plataformas web, e você nunca utilizou algo assim, talvez você se sinta um pouco ansioso no começo, mas é por isso que você está aqui nesse vídeo e é nesse vídeo que eu vou te ensinar a mexer nisso aqui do zero, tá?

Então primeiramente, se você baixou o Tray já aí no seu PC, presumo que sim, e que você já tem a sua conta ou que você está pensando em começar a utilizar, mas nesse vídeo eu não vou te mostrar como que você baixa nem instala, até porque acho que isso é algo muito simples e que acredito que a gente pode pular essa parte, né? Bom então aqui é o visual inicial da sua ideia eu vou fazer um vídeo sem cortes tá então promete algumas coisas eu vou ficar vai ficar um pouco repetitivo mas aqui ó então aqui na parte de configurações tá é para abrir essa parte configurações eu vou onde aqui em cima você tem esse perfilzinho aqui ele é onde está as configurações a sua ideia do seu perfil e e aqui eu posso trocar de tema, trocar de língua Mas. E aqui está nossa nossa primeira configuração finalizada tá aqui na parte de configurações galera você não vai precisar mexer em nada tá porque hoje em dia as configurações já vem tudo pronto né você não precisa necessariamente mexer alguma coisa aqui também não tem muita coisa para você mexer sinceramente então se você vem aqui no tab você vai ver que tem coisas que provavelmente você nem vai entender o que que.

Então por exemplo se você trabalha em uma empresa, se você vai utilizar o Tray em uma empresa, talvez seja interessante você utilizar o modo privado, tá? Porque a tela está sendo gravada somente no Tray, tá? Então dessa forma você vai conseguir abrir o seu projeto localmente, sem você precisar usar o GitHub, que a gente vai ver daqui a pouquinho.

Então se eu tenho um projeto que é somente um arquivo, por exemplo um site em HTML, por exemplo, um arquivo .md, que é um documento geralmente, Então eu posso abrir diretamente o arquivo sem precisar abrir a pasta e depois abrir o arquivo. GitHub é como se ele salvasse versões do seu código Então ele serve para você versionar o que a gente chama de seu código Então, para você não correr o risco de estar começando o seu projeto E perder alguma coisa, ou fazer alguma cagada e precisar voltar no código e não ter como O GitHub serve justamente para isso Nesse vídeo eu vou abordar o GitHub também, então pode ficar tranquilo quanto a isso Mas ele serve. E geralmente, quando a gente trabalha com projetos de SAS, de micro-SAS, aplicativos, a gente usa sempre o GitHub, tá?

Então por exemplo estou aqui no novo agora vocês estão vendo meu novo aí tá eu estou aqui com esse projeto em aberto é somente um site uma página de vendas que eu fiz eu fiz essa página de vendas aqui ontem com o coldre tá você quer ver o vídeo tá por aí também no meu canal mas qualquer ideia aqui vamos salvar esse projeto no novit hub que tá no caso já tá aqui tá então quando você inicia um projeto aqui no novo. Aqui eu tenho as pastas do meu código, que são essas pastas que você está vendo aqui, tá? E basicamente é isso, aqui ele vai salvar as versões do seu código, a gente não precisa ver isso profundamente agora, mas aqui, por exemplo, nas branches, as branches servem justamente para isso.

Então o GitHub vai ter o seguinte, as branches, ele começa com uma branch especificamente, que é a main, que você está vendo aqui na tela, essa main é onde fica a versão principal do seu código. Então, se eu estou com o meu projeto em aberto no Trey, por exemplo, e eu quero criar, eu quero fazer uma nova implementação de uma nova função no meu aplicativo. Dessa forma eu vou salvar a versão do código anterior, que está na main, e vou desenvolver isso em uma outra versão do meu código, sem alterar a versão que eu já salvei.

Internalize com links reais do ecossistema CrazyStack: /blog, /curso-cursor-avancado-configuracoes-pro, /curso-claude-code-9-dicas-profissionais, /programa-crazystack e /checklist-independencia-cursor.