Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/german-zarate/snapshot
Snap Shot is a gallery created using React,React Hooks, React Router and Context API. The Routes were setup for four default pages and a search page. Also the images were displayed using the Flickr API and axios to fetch data.
https://github.com/german-zarate/snapshot
context hooks react react-router
Last synced: about 2 months ago
JSON representation
Snap Shot is a gallery created using React,React Hooks, React Router and Context API. The Routes were setup for four default pages and a search page. Also the images were displayed using the Flickr API and axios to fetch data.
- Host: GitHub
- URL: https://github.com/german-zarate/snapshot
- Owner: german-zarate
- Created: 2024-05-14T06:24:29.000Z (9 months ago)
- Default Branch: master
- Last Pushed: 2024-05-14T06:25:04.000Z (9 months ago)
- Last Synced: 2024-05-17T12:46:56.992Z (8 months ago)
- Topics: context, hooks, react, react-router
- Language: JavaScript
- Homepage:
- Size: 3.1 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
# Snap Shot [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=See%20this%20react%20example&url=https://yog9.github.io/SnapShot/&hashtags=react,context-api,freecodecamp,developers)
[![Build Status](https://travis-ci.org/Yog9/SnapShot.svg?branch=master)](https://travis-ci.org/Yog9/SnapShot)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
[![HitCount](http://hits.dwyl.com/Yog9/SnapShot.svg)](http://hits.dwyl.com/Yog9/SnapShot)[Demo of Snap Shot](https://yog9.github.io/SnapShot/)
![](/snapscout.png)
### Summary
Snap Shot is a gallery created using React,React Hooks, React Router and Context API. The Routes were setup for four default pages and a search page. Also the images were displayed using the Flickr API and axios to fetch data.
### Motivation
The purpose of this project was to get familiar with React Hooks and Context API.
### Getting Started
Click the demo link or clone/download the repository on your local machine.
Create a config.js file in api folder inside src folders. In config.js file write
`export const apiKey = "YOUR_FLIKR_API_KEY";`##### Install dependencies
`yarn install`
##### Run Snap Shot from the root directory.
`yarn start`
### Built With
- React js
- React Router
- React Hooks
- Context API
- Flickr API### Features
**1. Responsive Design.**
**2. Search functionality added to search photos from API.**
### Coming Soon
- [ ] Cypress E2E Tests
### Contributing
Everyone is welcomed to contribute to this project. You can contribute either by submitting bugs or suggesting improvements by opening an issue on GitHub. Please see the [CONTRIBUTING](CONTRIBUTING.md) guidelines for more information.
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).