Worm Notes

Aplicação em React que permite criar e editar notas. Busquei inpiração no App Ideas e cobri as principais funcionalidade sugeridas e também adicionei novas.

💻Projeto

🔨 Principais funcionalidades do app-ideas

• Criar, editar e deletar notas

🔨 Funcionalidades adicionais

• Tema Light e Dark
• Responsividade com mobile
• Login com google
• Firebase Realtime Database
• Data que a nota foi criada e modificada
• Visualizar em Markdown

✨ Desenvolvido com as seguintes tecnologias:

• [React] (https://reactjs.org)
• [Firebase] (https://firebase.google.com/)
• [TypeScript] (https://www.typescriptlang.org/)

🏃‍♂️Instruções

Clone o projeto e acesse a pasta.

$ git clone https://github.com/mujapira/WormNotes.git
$ cd WormNotes

Para iniciá-lo, siga os passos abaixo:

# Instalar as dependências
$ yarn
# Iniciar o projeto
$ yarn start

O app estará disponível no seu browser pelo endereço http://localhost:3000.

Lembrando que será necessário criar uma conta no Firebase e um projeto para disponibilizar um Realtime Database. É de suma importância que se crie um arquivo .env.local a fim de realizar a comunicação com o Real Time Database.

REACT_APP_API_KEY= preencher com dados do firebase
REACT_APP_AUTH_DOMAIN= preencher com dados do firebase
REACT_APP_DATABASE_URL= preencher com dados do firebase
REACT_APP_PROCT_ID= preencher com dados do firebase
REACT_APP_STORAGE_BUCKET= preencher com dados do firebase
REACT_APP_MESSAGING_SENDER_ID= preencher com dados do firebase
REACT_APP_APP_ID= preencher com dados do firebase

📚Aprendizados

- useEffect - useState - useContext - Tipagem com TypeScript - Renderização condicional - CSS compatível com usuários mobile - Hooks - ReacRouterDOM - StyledComponents e Icons

🔗Links úteis

Acesse o projeto online! https://worm-notes.vercel.app/

Guia para Markdown https://www.markdownguide.org/basic-syntax/

app-ideas https://github.com/florinpop17/app-ideas/blob/master/Projects/1-Beginner/Notes-App.md