{"id":18886420,"url":"https://github.com/ronaldprofile/simple-gallery-photos","last_synced_at":"2026-04-12T17:47:38.512Z","repository":{"id":124088285,"uuid":"420291088","full_name":"ronaldprofile/simple-gallery-photos","owner":"ronaldprofile","description":"uploading photos to Firebase Storage.","archived":false,"fork":false,"pushed_at":"2021-11-01T14:34:54.000Z","size":72,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-05-31T15:58:21.869Z","etag":null,"topics":["firebase","reactjs","storage","styled-components"],"latest_commit_sha":null,"homepage":"https://simple-gallery-photos.vercel.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ronaldprofile.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-10-23T02:07:37.000Z","updated_at":"2022-04-06T16:26:22.000Z","dependencies_parsed_at":null,"dependency_job_id":"51b54153-5b69-46e8-9848-15959caee55c","html_url":"https://github.com/ronaldprofile/simple-gallery-photos","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ronaldprofile/simple-gallery-photos","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ronaldprofile%2Fsimple-gallery-photos","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ronaldprofile%2Fsimple-gallery-photos/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ronaldprofile%2Fsimple-gallery-photos/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ronaldprofile%2Fsimple-gallery-photos/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ronaldprofile","download_url":"https://codeload.github.com/ronaldprofile/simple-gallery-photos/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ronaldprofile%2Fsimple-gallery-photos/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266822190,"owners_count":23989823,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-24T02:00:09.469Z","response_time":99,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["firebase","reactjs","storage","styled-components"],"created_at":"2024-11-08T07:27:23.097Z","updated_at":"2026-04-12T17:47:38.418Z","avatar_url":"https://github.com/ronaldprofile.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003eGallery Photos\u003c/h1\u003e\n\n\u003cimg src=\"https://ik.imagekit.io/gczsuhmv3/avanz/Storage_Photos/screenshot-update.png?updatedAt=1635288886735\" alt=\"screenshot\"\u003e\n\n## 💻 Projeto\n\naplicação simples que faz upload de imagens para o storage do firebase.\n\n## 🚀 Tecnologias\n\n- ReactJS\n- Firebase\n- Typescript\n\n## :zap: Novidades\n\n- Fiz pequenas alterações no layout, antes cada imagem era acompanhada com um botão _remover foto_ e pra deixar algo mais suave retirei. Agora basta passar o mouse sobre a foto e um icone para excluir a foto vai aparecer.\n- Quando passar o mouse sobre a foto, também vai aparecer outro icone para expandir a visualização da imagem.\n- Quando você estiver com a imagem expandida, passe o mouse sobre a imagem para ver mais detalhes como: **name, size e contentType**. \n\n- Fazer um slider com todas as imagens da galeria (Em breve) 💥💥\n\n## 😍 Detalhes\n\n- Para rodar o projeto na sua máquina será preciso que você crie seu próprio projeto firebase e configure seu cloud storage.\n\n- Depois dessa etapa você precisa configurar as regras do seu storage, por padrão você vai ver algo parecido com isso:\n  ```js\n    rules_version = '2';\n    service firebase.storage {\n      match /b/{bucket}/o {\n        match /{allPaths=**} {\n          allow read, write: if request.auth != null;\n        }\n      }\n    }\n  ```\n  o que você precisa mudar é essa condição: `if request.auth != null`. Depois de ter feito isso basta **publicar essa atualização**\n\n- Sua próxima tarefa é criar uma pasta chamada **images** na seção **files**, e pronto nosso storage está configurado.\n- Mas depois disso tudo é preciso que você adicione suas credenciais do projeto firebase no arquivo **.env.EXAMPLE**, só assim ele vai funcionar corretamente.\n  Você vai ver algo assim:\n  ```js\n  VITE_APP_KEY=\n  VITE_AUTH_DOMAIN=\n  VITE_PROJECT_ID=\n  VITE_STORAGE_BUCKET=\n  VITE_MESSAGING_SENDER_ID=\n  VITE_APP_ID=\n  ```\n  basta adicionar seus resepctivos valores.\n\n## ✨ Execute o projeto\n\n- clone o repo: `git clone https://github.com/ronaldprofile/simple-gallery-photos`\n- instale as dependências do projeto: `yarn`\n- rode o servidor: `yarn dev`\n- veja a aplicação funcionado: [localhost:3000]()\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fronaldprofile%2Fsimple-gallery-photos","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fronaldprofile%2Fsimple-gallery-photos","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fronaldprofile%2Fsimple-gallery-photos/lists"}