Update README

README.md

@@ -1,46 +1,57 @@
-# Getting Started with Create React App
+# Cryptopasser
+![alt text](./screenshots/valid.png "valid")
+![alt text](./screenshots/issue.png "Issue")
+![alt text](./screenshots/saved.png "saved")
+![alt text](./screenshots/diagram.png "diagram")
 
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+Cryptopasser is a mobile friendly web app to **issue, sign, store and verify** [EIP-4361 Sign-In with Ethereum](https://eips.ethereum.org/EIPS/eip-4361) authentication token. 
 
-## Available Scripts
+Cryptopasser works similar to JWT web token. However, for signing and verifying, it uses Ethereum's [EIP-191](https://eips.ethereum.org/EIPS/eip-191), and for data communication, it uses an offline QR code.
 
-In the project directory, you can run:
+Two devices (signer and accesor) in an [air-gapped](https://en.wikipedia.org/wiki/Air_gap_%28networking%29) environment can share the access of a wallet from one account by creating a signed [EIP-4361](https://eips.ethereum.org/EIPS/eip-4361)  standard authentication certificate.
 
-### `npm start`
+## Usage
+This can be useful for the following usage. 
 
-Runs the app in the development mode.\
-Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+Imagine you need to prove an ownership of a NFT to gain access to a certain event. You have a hardware wallet that has a valuable NFT. However, you don't want to import your hardware wallet into your mobile device for security issues. 
 
-The page will reload if you make edits.\
-You will also see any lint errors in the console.
+With Cryptopasser, you just simply sign the token, save the signed token as a QR code image onto your phone. The event organizer scan the QR code, and verify that 1) you've signed the auth token and 2) you hold ownership of a NFT.  
 
-### `npm test`
+## Demo
 
-Launches the test runner in the interactive watch mode.\
-See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
+Fully working demo on [https://cryptopasser.netlify.app](https://cryptopasser.netlify.app)
 
-### `npm run build`
+## Security features
 
-Builds the app for production to the `build` folder.\
-It correctly bundles React in production mode and optimizes the build for the best performance.
+- Tokens expire after expiration date
+- User can specify the specific chain id to make sure the token is only valid for a certain network.
+- [CSRF protection](https://en.wikipedia.org/wiki/Cross-site_request_forgery). The auth token is only valid on the same domain as the issuing domain.
+- It run offline. Internet is used only for fetching the NFT ownership  
 
-The build is minified and the filenames include the hashes.\
-Your app is ready to be deployed!
+## Features to implement
 
-See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
+- [ ] Add ERC20 token verfication mode
+- [ ] Grant access to a certain NFT or token only not all NFT/token owned by the user
+- [ ] Invalidate the token to prevent replay attacks (requires database to keep track of nonce)
+- [ ] Implement own indexer API to check the NFT ownership instead of calling Opensea API 
 
-### `npm run eject`
+## Run locally
+`npm start`
 
-**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
+## Pages
+### `/issue` (Issue and Sign)
+![alt text](./screenshots/issue.png "Issue")
+![alt text](./screenshots/sign.png "Sign")
+![alt text](./screenshots/token.png "token")
 
-If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
+## `/view` (View and Save)
+![alt text](./screenshots/view_import.png "import")
+![alt text](./screenshots/scan.png "scan")
+![alt text](./screenshots/saved.png "saved")
 
-Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
+## `/verify` (Verify)
+![alt text](./screenshots/verify_select.png "verify_select")
+![alt text](./screenshots/nft.png "nft")
+![alt text](./screenshots/valid.png "valid")
+![alt text](./screenshots/invalid.png "invalid")
 
-You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
-
-## Learn More
-
-You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
-
-To learn React, check out the [React documentation](https://reactjs.org/).