Skip to content

Immerse in a captivating gallery SPA, enabling photo exploration, search, and personalized saves.

Notifications You must be signed in to change notification settings

drazomo/galeriaApp

Repository files navigation

Galería App

**Link to project this project (current): Galería App
**Mock-up

DEMO

site gif demo


Overview 🕶🕶🕶

An instagram-like single page application where users can view, search and save photos.


Features ✨✨✨

The features of the Galería app are -
⭐ A home page that displays popular photos daily.
⭐ Image onLoad Skeletons
⭐ Users are able to
* Search Photos & Collections
* Favorite and Save Photos
* Download Photo
* View Artists & Other user's collection
* View Photo's Likes


Optimizations 🔧🔧🔧

🔧 User Accounts & Authnetication for access to saved photos
🔧 Unit testing & Intergration Testing


How to run 🚀🚀🚀

  • First, copy the url of this project
  • Then open your terminal on your local computer and -
    • navigate to the location you want to create the project in (eg - home or c:/)
    • enter the command git clone <url-of-this-project>. Alternatively, you can provide the name of the folder you want git to clone the project to with git clone <url-of-this-project> <name-of-folder>
    • cd into the project folder
    • Run npm install to install the packages for the frontend
    • Run npm run dev to start the development server

Lessons Learned 🏫🏫🏫

✅ Create a modal via ReactDOM.createPortal.
✅ Skeleton for images.
✅ Giving props to created custom components.
✅ Provide predetermined sizes in styled-components.


DEPENDECIES 📦📦📦

The list of dependencies used in the frontend are :

    "@bakunya/react-masonry"
    "@reduxjs/toolkit"
    "react"
    "react-dom"
    "react-infinite-scroll-component"
    "react-masonry-css"
    "react-redux"
    "react-router-dom"
    "react-scripts"
    "react-spinners"
    "react-top-loading-bar"
    "styled-components"
    "typescript"
    "web-vitals"

The list of dependencies used for code quality and test are :

    "@testing-library/jest-dom"
    "@testing-library/react"
    "@testing-library/user-event"
    "@types/jest"
    "@types/node"
    "@types/react"
    "@types/react-dom"
    "@types/styled-components"
    "cypress"

Where to find more:

Personal Website: https://markrasavong.com/
Galería App Repository: https://github.com/drazomo/galeriaApp
My Github Repositories: https://github.com/drazomo?tab=repositories
Email: rasavong.mark@gmail.com
Mobile / WhatsApp: +1 661 606 0866 / +34 666 996 519

About

Immerse in a captivating gallery SPA, enabling photo exploration, search, and personalized saves.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published