https://github.com/yoavniran/react-performance-demo
demo app showcasing performance issues and solutions
https://github.com/yoavniran/react-performance-demo
Last synced: 8 months ago
JSON representation
demo app showcasing performance issues and solutions
- Host: GitHub
- URL: https://github.com/yoavniran/react-performance-demo
- Owner: yoavniran
- Created: 2018-10-16T14:33:15.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-11-22T16:43:30.000Z (over 7 years ago)
- Last Synced: 2025-03-15T12:16:38.590Z (over 1 year ago)
- Language: JavaScript
- Size: 465 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
This code was used for my presentation @ React-Next (Nov) 2018
[Talk on youtube](https://www.youtube.com/watch?v=O6pLZK3R2II)
[](https://www.youtube.com/watch?v=O6pLZK3R2II)
[Slides on SlideShare](https://www.slideshare.net/yoavniran/react-responsively-render-responsibly)
## How to Run
### Client Side
After cloning this repo run (from the root of the project):
> yarn
After that run:
> yarn start
This will start the webpack dev server and serve the client side of this app.
### Server Side
The images for the app are fetched from a Cloudinary Cloud. Therefore you'll need to have a
registered account first. You can register for free [here](https://cloudinary.com/users/register/free).
run (from the root of the project)
> cd server
You will need to configure the server with details from your Cloudinary account as the app fetches
photos from Cloudinary based on a specified tag.
You pass these as environment params when starting the server code like so:
> CLD_KEY="[key]" CLD_SECRET="[secret]" CLD_TAG="[tag]" DEBUG="smocker" node server.js
* Replace '[key]' with your API Key
* Replace '[secret]' with your API Secret
* Replace '[tag]' with a tag you used on your photos
The first two parameters you can get from your [account's dashboard](https://cloudinary.com/console)