https://github.com/ranjeet2311/multi-layered-image-gallery

NodeJs, ExpressJs, Java script/jQuery, Ajax, Media query, Html, Css, Scss,
https://github.com/ranjeet2311/multi-layered-image-gallery

ajax-call css endpoints expressjs html5 jquery jquery-ajax media-queries nested-loops nodejs-server scss-styles serverside-rendering

Last synced: about 18 hours ago
JSON representation

NodeJs, ExpressJs, Java script/jQuery, Ajax, Media query, Html, Css, Scss,

• Host: GitHub
• URL: https://github.com/ranjeet2311/multi-layered-image-gallery
• Owner: Ranjeet2311
• Created: 2024-01-22T11:48:28.000Z (almost 1 year ago)
• Default Branch: main
• Last Pushed: 2024-01-24T08:10:18.000Z (12 months ago)
• Last Synced: 2024-11-20T09:34:36.381Z (2 months ago)
• Topics: ajax-call, css, endpoints, expressjs, html5, jquery, jquery-ajax, media-queries, nested-loops, nodejs-server, scss-styles, serverside-rendering
• Language: JavaScript
• Homepage:
• Size: 17.6 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Multi layered gallery

Project displays images in grid format, with max 5 images on large screen and reduces the number of image in a row when screen size gets small, hence makes is responsive. All images are covered by an overlay and overlay is toggled on hover.

This project repo contains all components such as FE & BE. FE includes HTML, SCSS (later converted into css and consumed) and javascript/Jquery. Technology used in backend is Node + expressJS, `backend builds the project from public folder`

## Api endpoints:

`image Ids :` http://localhost:3000/api/images

`Inquire Image details with params :` http://localhost:3000/api/image/:param

---

# To serve the project locally, run the following commands:

`Please install NodeJs from https://nodejs.org/en , in case you don't have it already installed on your system.`

1. Install dependencies/modules: `$ npm install`

2. Run the project: `$ nodemon .\index.js`

This will start a development server, that enables us to `test the app` and see our `changes in real-time` on **http://localhost:3000.**