Surfbot concluído 🚀

About | Layout | How It Works | Technologies | Author | Deploy | License

💻 About

O Surfbot foi projetado e desenvolvido durante o curso Advanced UI Design na plataforma Origamid. É um clone do design original de André Rafael.

Decidi recriar a interface usando React + TailwindCSS, para estudar essa forma de desenhar interfaces, e estou muito surpreso com a facilidade do TailwindCSS.

Futuramente pretendo estender um pouco o projeto, integrando ele ao GraphCMS com GraphQL, apenas para fins didáticos.

---

🎨 Layout

Você pode visualizar o layout do projeto através desse link. É necessário ter conta no Figma para acessá-lo.

Web

---

🚀 How it works

Pré-requisitos

Antes de baixar o projeto você vai precisar ter instalado na sua máquina as seguintes ferramentas:

• Git
• NodeJS
• Yarn ou NPM

Além disto é bom ter um editor para trabalhar com o código como VSCode

🧭 Rodando a aplicação web (Frontend)

# Clone este repositório
$ git clone https://github.com/joao0pedro0alves/surfbot.git

# Acesse a pasta do projeto no terminal/cmd
$ cd surfbot

# Instale as dependências
$ npm install

# Execute a aplicação em modo de desenvolvimento
$ npm run dev

# A aplicação será aberta na porta:3000 - acesse http://localhost:3000

---

🛠 Technologies

As seguintes ferramentas foram usadas na construção do projeto:

Website (Vite + TypeScript)

• TailwindCSS
• PostCSS
• Clsx
• PhosporReact

Veja o arquivo package.json

---

💪 Como contribuir para o projeto

1. Faça um fork do projeto.
2. Crie uma nova branch com as suas alterações: git checkout -b my-feature
3. Salve as alterações e crie uma mensagem de commit contando o que você fez: git commit -m "feature: My new feature"
4. Envie as suas alterações: git push origin my-feature

Caso tenha alguma dúvida confira este guia de como contribuir no GitHub

---

Deploy

• Clique no link a seguir para acessar o projeto !! Surfbot

---

🦸 Author

João Alves

---

📝 License

Este projeto esta sobe a licença MIT.

Feito com 💜 por João Alves 👋🏽 Entre em contato!

---