Giter Site home page Giter Site logo

antingle / responsive-gallery Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 30.14 MB

A responsive gallery intended to serve as an elegant way for a photographer to present their photos.

Home Page: responsive-gallery-chi.vercel.app

JavaScript 78.11% CSS 21.89%

responsive-gallery's Introduction

Responsive Gallery

  • Created using Unsplash API to generate a unique gallery for a user upon every load
  • Used Masonry to create a moziac of photos that displays number of columns based on the size of a device
  • Focused on creating a beautiful user experience with images

Why This Project?

As a photographer myself, I have to find ways to share my finished photos with my clients. The most accessible option is some form of cloud drive service such as Google Drive or Dropbox. Although these solutions get the job done, they do not project your brand and identity in a professional manner, as you are relying on third-party services to share your polished, finished photos on. The experience of looking at the photos on these platforms does not feel unique. It just feels like a way to give your photos out.

I wanted to find a way to share photos in a beautiful way that feels special to each person that receives them. I drew inspiration from Pixieset, that allows you to do this, however I wanted an open source, reusable version for my own use, and anyone else wishing for such a product. I wanted that when clients open up a link to their photos, that it was like an elegant, digital photo album of their memories and moments from the shoot. I created this web app using Next.js for the easily accessible backend api and the built-in image optimizations that work even better when deployed on Vercel. I used the Unsplash Production API to deliver photos for endless scrolling of galleries of unique portfolios (all with credits and links to their profiles and images on Unsplash).

Running Locally

First, install the dependencies with:

npm install

Then, run the development server:

npm run dev

Open http://localhost:3000 with your browser to see the result.

Center Image Gallery Section

responsive-gallery's People

Contributors

antingle avatar imgbotapp avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.