Generate UX metrics report for any webpage
#snapshots
Search Result : Single/Multiple query
![image](https://private-user-images.githubusercontent.com/17022643/294745192-55a95dc0-d8c8-4ec6-a958-48962ad730fc.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI2Njg5NTEsIm5iZiI6MTcyMjY2ODY1MSwicGF0aCI6Ii8xNzAyMjY0My8yOTQ3NDUxOTItNTVhOTVkYzAtZDhjOC00ZWM2LWE5NTgtNDg5NjJhZDczMGZjLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MDMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODAzVDA3MDQxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTNmNTU0NGZkNTAyOWM3OTk5ZGJiNGQ2ZmFmYTE2Y2RlZGFiMzI2OWNkZDBmNDcwMTE0MmNkZTQ0YjRiNmY2OWYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.dGb5eOJNn_GtIBPyWS1RHNSnI9gQyLeSnsDcya9Wa50)
![image](https://private-user-images.githubusercontent.com/17022643/294745666-9accab54-9f95-4c01-bdce-04081bdc2825.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI2Njg5NTEsIm5iZiI6MTcyMjY2ODY1MSwicGF0aCI6Ii8xNzAyMjY0My8yOTQ3NDU2NjYtOWFjY2FiNTQtOWY5NS00YzAxLWJkY2UtMDQwODFiZGMyODI1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MDMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODAzVDA3MDQxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTUyZTliODUyZmY0MDI0NzY2ODFkYTlmNDcyMjg2NzdiMTZiMjE2ZmFmYzQwMTQ3MWZhZWUzNGNiNjQ1ZTg2ZmQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.2RdPWgqWe3Q3jyJwwRy1qdSzfDtOqHR3zc7ghG4krY8)
Random Filter
![image](https://private-user-images.githubusercontent.com/17022643/294745230-00723d8b-c336-43b5-b641-1cddb66d56a7.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI2Njg5NTEsIm5iZiI6MTcyMjY2ODY1MSwicGF0aCI6Ii8xNzAyMjY0My8yOTQ3NDUyMzAtMDA3MjNkOGItYzMzNi00M2I1LWI2NDEtMWNkZGI2NmQ1NmE3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MDMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODAzVDA3MDQxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWJmNTRkYzA0YTY4NGJiMzllNDg0NDYxN2M4ZDA0NmNjNWYxNWQxZjNhYzI2MWU3ZjY3NjgyMGE0ZWY0MGY1OTcmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.WrpJx0DjsJmE04P6eBXt8M7g56eCQHHlIjgkhYmw4A0)
Mobile Device
![image](https://private-user-images.githubusercontent.com/17022643/294745980-32409716-7fd1-4d97-a2c2-972f6bffaee8.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI2Njg5NTEsIm5iZiI6MTcyMjY2ODY1MSwicGF0aCI6Ii8xNzAyMjY0My8yOTQ3NDU5ODAtMzI0MDk3MTYtN2ZkMS00ZDk3LWEyYzItOTcyZjZiZmZhZWU4LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MDMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODAzVDA3MDQxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWJkNGEwMGIwMTUwYjdlNWQxNDkxMzhiM2Q3ZGI5NzQzYTJlZDRhNWYyYjA2OTRiN2VlZDg2MTZhZWE0OWNiNWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.HuZt8w1__zLRyzhitSrutsOzrp_ESIvoVbI2LdPHSrA)
Tab Device
![image](https://private-user-images.githubusercontent.com/17022643/294746042-79ecbd68-1772-4dab-abc4-91f6f2c69957.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI2Njg5NTEsIm5iZiI6MTcyMjY2ODY1MSwicGF0aCI6Ii8xNzAyMjY0My8yOTQ3NDYwNDItNzllY2JkNjgtMTc3Mi00ZGFiLWFiYzQtOTFmNmYyYzY5OTU3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MDMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODAzVDA3MDQxMVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTY5ZDU2MTYxMGI5OGUwMjViNWFmNTlhNGM5NDJhMTE4ZTNmZjkwOWYxYzI4NWM4ZWVkMTYwYTVlNDAyZGE1ZGImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.-K6Qnkfo6Poo9CsSfvYsajKyG1FJ9nvTGl6agZGi6Hg)
#Instructions
How to run in local ?
- Clone this repo
- Execute npm install
- Update config/cruxApi.ts : ApiConfig.API_KEY =
${YOUR_API_KEY}
- Execute npm run dev
- Navigate to http://localhost:5173/
Note : Make sure to generate API key before using CRUX API. How to get a key ? Click Herehttps://developer.chrome.com/docs/crux/bigquery
Resources :
- https://developer.chrome.com/docs/crux/bigquery
- https://developer.chrome.com/docs/crux/api
- https://redux-toolkit.js.org/
- https://tailwindcss.com/docs/installation
- https://react.dev/learn
- https://vitejs.dev/
Designed by Saurabh Shankariya