https://github.com/vagyasri/image-gallery

In this Project, I am creating a picture gallery using CSS Flexbox.
https://github.com/vagyasri/image-gallery

Last synced: 30 days ago
JSON representation

In this Project, I am creating a picture gallery using CSS Flexbox.

• Host: GitHub
• URL: https://github.com/vagyasri/image-gallery
• Owner: Vagyasri
• License: mit
• Created: 2021-10-31T20:33:59.000Z (about 3 years ago)
• Default Branch: Develop
• Last Pushed: 2021-11-03T11:03:26.000Z (about 3 years ago)
• Last Synced: 2023-03-06T18:02:35.332Z (over 1 year ago)
• Language: CSS
• Homepage:
• Size: 20.5 MB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Image Gallery

In this Project, I am creating a picture gallery using CSS Flexbox.

## Built With

- HTML

- CSS

- JavaScipt

- Webpack

- ES6

## Screenshot

![Gallery](src/Images/img1.png)

![Gallery](src/Images/img2.png)

## Live Demo

[Live View!!](https://vagyasri.github.io/Image-Gallery/dist/)

## Author

👤 **Bhagyashree Patra**

- GitHub: [@Vagyasri](https://github.com/Vagyasri)

- Twitter: [@Vagyasri](https://twitter.com/Vagyasri)

- LinkedIn: [Bhagyashree Patra](https://www.linkedin.com/in/bhagyashree-patra-029bb059/)

## Getting Started

### Prerequisites:

- Web browser

- Code Editor (VS Code)

- Live Server Extension

### Cloning the repo to your local system (If you already have git, installed in your system):

- [Copy this link](https://github.com/Vagyasri/Image-Gallery.git)

- Open your terminal or command line

- Run "git clone [Paste this link](https://github.com/Vagyasri/Image-Gallery.git)"

- Open the folder with your code editor

- Now You can edit the code and check the changes in the browser using Live Server

### Webpack Setup:

- Initialize `npm`: Run `npm init -y`

- Install `webpack` and  `webpack-cli` locally: Run `npm install webpack webpack-cli --save-dev`

### Implement the changes and Get Live View in Localhost:

- Run: `npm run build`

- Run: `npm start`

### Install Jest using NPM:

- Run: `npm install --save-dev jest`

### For Running Jest:

- Run: `npm run test or npm test`

### Check linter errors:

- Install npm

- For HTML: Run npx hint .

- For CSS: Run npx stylelint "**/*.{css,scss}"

- For JS: Run npx eslint .

## 🤝 Contributing

Contributions, issues, and feature requests are welcome!

Start by:

- Forking the project

- Cloning the project to your local machine

- cd into the Youtube-Replica project directory

- Run git checkout -b your-branch-name

- Make your contributions

- Push your branch up to your forked repository

- Open a Pull Request with a detailed description to the development branch of the original project for a review

Feel free to check the [issues page](https://github.com/Vagyasri/Image-Gallery/issues), contribute to the Project by creating an issue.

## Show your support

Give a ⭐️ if you like this project!