https://github.com/mathrb22/nlw-journey-frontend
Plann.er é uma aplicação web para criação de planos de viagem com amigos, registro de atividades e links úteis. Projeto desenvolvido durante o NLW Journey
https://github.com/mathrb22/nlw-journey-frontend
frontend reactjs tailwindcss typescript web
Last synced: about 2 months ago
JSON representation
Plann.er é uma aplicação web para criação de planos de viagem com amigos, registro de atividades e links úteis. Projeto desenvolvido durante o NLW Journey
- Host: GitHub
- URL: https://github.com/mathrb22/nlw-journey-frontend
- Owner: mathrb22
- License: mit
- Created: 2024-07-10T03:40:13.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-07-21T05:35:00.000Z (almost 2 years ago)
- Last Synced: 2024-07-21T06:34:08.736Z (almost 2 years ago)
- Topics: frontend, reactjs, tailwindcss, typescript, web
- Language: TypeScript
- Homepage:
- Size: 2.62 MB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[**Sobre**](#-sobre) **|**
[**Objetivo**](#-objetivo) **|**
[**Tecnologias e ferramentas**](#-tecnologias-e-ferramentas) **|**
[**Features**](#-features) **|**
[**Demonstração**](#-demonstração) **|**
[**Protótipo**](#-protótipo) **|**
[**Referência da API**](#-referência-da-api) **|**
[**Instalação e execução**](#-instalação-e-execução) **|**
[**Como contribuir**](#-como-contribuir) **|**
[**Licença**](#-licença)
## 📃 Sobre

**Plann.er** é o projeto desenvolvido durante a trilha de React da **Next Level Week Journey**, um evento online produzido pela [**Rocketseat**](https://github.com/Rocketseat).
Trata-se de uma aplicação web que permite aos usuários convidar seus amigos e planejar suas próximas viagens de uma forma simples e intuitiva.
## 🎯 Objetivo
O objetivo principal do **Plann.er** é criar uma plataforma que permita aos usuários planejar suas viagens, cadastrar atividades, e links úteis para a viagem, além de poder convidar amigos para acompanhar o planejamento.
## 🚀 Tecnologias e ferramentas
React
TypeScript
Tailwind CSS
Vite.js
## ✨ Features
✅ Criação de viagens
✅ Seleção de convidados para a viagem
✅ Cadastro de atividades
✅ Validação de datas disponíveis para atividades
✅ Cadastro de links úteis
✅ Skeleton loader para carregamento de informações
✅ Design responsivo
✅ Cópia de link para a área de transferência
## 💻 Demonstração
[plann-er-demo.webm](https://github.com/mathrb22/nlw-journey-frontend/assets/62413443/3d8dcfa3-9fb8-47d0-80d6-e9f55627f19e)
Criação de uma viagem:

Inclusão de convidados:

Confirmar criação de uma viagem:

Skeleton loader para as informações da viagem:

Detalhes do plano de viagem:

Cadastro de atividade:

Cadastro de link:

## 🎨 Protótipo
O protótipo do projeto foi desenvolvido utilizando a ferramenta [**Figma**](https://www.figma.com/). Você pode acessá-lo [aqui](https://www.figma.com/community/file/1392276515495389646/nlw-journey-planejador-de-viagem).
## ⚙ Referência da API
A API utilizada neste projeto foi desenvolvida pela trilha de Nodejs do NLW Journey. Você pode acessar o repositório do backend [aqui](https://github.com/mathrb22/nlw-journey-nodejs).
🔗 Documentação da API base: [NLW Journey Nodejs API](https://nlw-journey.apidocumentation.com/reference)
> **Nota:** Para rodar o frontend em sua máquina, será necessário ter o backend rodando localmente para conexão dos recursos do banco de dados. Siga as instruções no repositório do backend para configurá-lo em sua máquina.
## 🔧 Instalação e execução
Para baixar o código-fonte do projeto em sua máquina, primeiramente terá que ter instalado o [**Git**](https://git-scm.com/).
Com o Git instalado, em seu terminal execute o seguinte comando:
```bash
git clone https://github.com/mathrb22/nlw-journey-frontend.git
```
Para instalar as dependências e executar o projeto terá que ter instalado em sua máquina o [**node.js**](https://nodejs.org/en/), que vem acompanhado do npm. Instale as dependências usando o comando abaixo:
```bash
npm install
```
Executar o projeto:
```bash
npm run dev
```
A aplicação estará disponível em http://localhost:5173. Você poderá acessá-la a partir do seu navegador.
## 💡 Como contribuir
- Faça um **_fork_** desse repositório;
- Crie um **branch** para a sua feature: `git checkout -b minha-feature`;
- Faça um **commit** com suas alterações: `git commit -m 'feat: Minha nova feature'`;
- Faça um **push** para o seu branch: `git push origin minha-feature`;
- Faça um **pull request** com sua feature;
Pull requests são sempre bem-vindos. Em caso de dúvidas ou sugestões, crie uma _**issue**_ ou entre em contato comigo.
## 📝 Licença
Esse projeto está sob a licença **MIT**. Veja o arquivo _**LICENSE**_ para mais detalhes.
---
Desenvolvido com 💚 por mathrb22