narcello / vocequisdizerlustre

Lutre web page made with Reactjs

Lutre's Web Site

Site da Lutre feito com:

• Reactjs
• Fullpage

Contribuições

Caso você queira contribuir com o projeto faça o seguinte:

• Você deve fazer o fork

• npm install dentro do projeto

• Comente as linhas a seguir:

import * as serviceWorker from './serviceWorker';
// import configFirebase from './firebase/index'
// import firebase from "firebase";

import React from 'react';
import ReactDOM from 'react-dom';
import ReactFullpage from '@fullpage/react-fullpage';
import './index.css';

import { Provider } from './languages/ProviderLang'

import Home from './components/home/Home';
import Bio from './components/bio/Bio';
import Albuns from './components/albuns/Albuns';
// import Mapa from './components/mapa/Mapa';

// firebase.initializeApp(configFirebase);

• Remova:

<div className='section' id='mapaComponent'><Mapa /></div>

• Run

npm start

• Depois que tiver modificado, me faça um pull-request.

TESTE .gitattributes

vocequisdizerlustre's Issues

Features on Google Maps API

• Remover informações desnecessárias. (Nomes de prédios, comércios, ruas talvez)
• Disponibilizar modo, visão noturna.
• Adicionar novo Marker apenas quando a pessoa fechar o popup de confirmação
• Permitir que um Marker seja removido pela pessoa que o adicionou.
• TODO list de o que é feito após clicar no botão de "EU QUERO"
• Adicionar as top 5 cidades com mais pedidos, apenas no browser, entre a pergunta e o botão, na parteSemMapa.

Integrar com api do YouTube

Colocar player do YouTube em um Section

Implementar e implantar functions do firebase

Passar toda a parte de banco de dados para functions chamando-as sempre por https.

Fazer rotate do album no desktop

Fazer rotate do album e mostrar detalhes tipo esse código: https://codepen.io/MrAndrewMcG/pen/dzmyeb?editors=1010

Apenas no browser

TESTES

Adicionar testes no site para verificar a renderização correta no browser dos componentes.
A princípio usar:

• TestRenderer
• Shallow

Site com erro no mobile

Erros que acontecem no mobile:

Quando renderiza, o site não consegue renderizar no tamanho da tela toda. Falha causada provavelmente por causa do fullpagejs. Para que fique certo é necessário girar o celular, mudar a orientação e voltar para o Portrait.

O que estou pensando é tirar o fullpagejs quando for mobile ou exibir tudo numa section e ir passando slides.

Ao sair da section Home e voltar, o ícone das linguagens some.

Permitir multi idiomas

Ter a opção de vários idiomas começando por:

• Inglês
• Espanhol
• Português

Perde sessão ativa ao recarregar a página

Ao atualizar a página perde a sessão ativa e volta pro home. Achar uma forma com que volte na sessão que o usuário estava.

Arrumar links dos ícones dos álbuns

Está abrindo uma página em branco e o ep só possui link para youtube.

Integrar com api do Spotify

Colocar o play do Spotify em uma Section

Criar section de contato

Criar, após o mapa, sessão para contato com a banda.

• Email
• Redes sociais
• Repositório no GitHub

Permitir o usuário fazer sign out

Criar talvez, no topo da section home, uma área com a foto do usuário logado que permite o sign out da aplicação.

Ajustar tamanhos de imagens e carga de componentes

Analisar o que mais demora ser carregado no site, desde imagens à marcadores no mapa e buscar soluções que viabilizem a aplicação rodar de maneira confortável em uma conexão lenta de 3g.

Modo de testar e analisar as cargas:

• Na aba Network na pare de desenvolvedor do navegador
  
• Escolha a opção Slow 3G
  

Colocar Parallax no home

Colocar parallax na imagem do home do mobile, já que o que me impedia de ter era a biblioteca fullpage.js. Agora no mobile não estou usando-a mais.