SEAPHOTOS

Uma galeria de fotos e vídeos virtual com sistema CRUD das mídias e dos perfis cadastrados no banco de dados.

Tecnologias 💻

As tecnologias e linguagens utilizadas durante o desenvolvimento deste projeto, foram:

• PHP 8.3.3
• MySql 8.0
• JavaScript
• SQL
• HTML
• CSS

Serviços usados ☁️

• Font Awesome

Como o site funciona? 🤔

1 - Index 📷

Ao entrar no site, teremos acesso a index, a galeria que reúne imagens de todos os usuários

Nela, pode-se visualizar o título da mídia, a data imposta pelo usuário(opcional) e o nome do usuário que a enviou

Além disso, ao clicar na lupa acima, pode ser feita a pesquisa de alguma mídia baseada no título

Search.System.mp4

Ao observar o canto superior direito, notamos que há uma imagem de perfil "default", o que indica que o usuário não está logado. Porém, ao clicar no menu lateral, temos acesso ao login e cadastro de usuários, além de diversas abas que necessitam de login para serem acessadas.

menu.mp4

2 - Login 🔐

Ao clicar no login pelo menu, em alguma outra aba privada ou na foto de perfil no canto superior direito, teremos acesso à página de login

SEAPHOTOS.login.-.Brave.2024-02-25.20-25-21.mp4

O login necessita de dois fatores: email e senha, sujos quais foram cadastrador pelo usuário. Basta preencher os campos e clicar no botão

login.mp4

3 - Cadastro ➕

Através do menu de navegação ou da página de login, pode-se acessar a página de cadastro

cadastro.mp4

Para se cadastrar, são necessárias informações básicas: nome e sobrenome, email e senha. Após tais dados serem preenchidos, o usuário será imediatamente redirecionado para a aba de perfil privado.

cadastro.mp4

4 - Perfil de usuário ⚙️

Podendo ser acessada pelo sucesso no login ou cadastro, a página de perfil de usuário é uma página voltada para o controle dos dados do usuário por ele mesmo

Para alterar os dados, basta clicar no botão "Alterar Informações e os campos serão liberados.

profile.mp4

5 - Adicionar mídias 🎞️

Seguindo pelo menu lateral, teremos acesso a área de adicionar mídias

Para utilizá-la, basta digitar o número de campos para imposição de mídia de que deseja, e, então, eles serão renderizados abaixo

addfiles.mp4

Então, basta enviar a mídia e colocar uma descrição e uma data que desejar

sending.files.mp4

6 - Meus arquivos 🖼️

Através da caixa de sucesso após adicionar a mídia ou pelo menu lateral, pode-se ter acesso à página de controle de mídias enviadas

Nesta página, podemos alterar ou apagar alguma mídia que desejarmos. Basta deslizar a tela e clicar no botão desejado

myfiles.mp4