diff --git a/docs/onboarding/10 Auth/1 How Auth Works/0 Overview.mdx b/docs/onboarding/10 Auth/1 How Auth Works/0 Overview.mdx index fabab1b83..797098c53 100644 --- a/docs/onboarding/10 Auth/1 How Auth Works/0 Overview.mdx +++ b/docs/onboarding/10 Auth/1 How Auth Works/0 Overview.mdx @@ -15,7 +15,7 @@ Being able to authenticate and authorize users is a critical part of any web app A common web2 authentication method involves using JSON Web Tokens (JWTs) to send authentication data between clients and servers. A standard JWT flow looks like the following: -![how-auth-works-1](../assets/how-auth-works-1.png) +![how-auth-works-1](../assets/web2auth-diagram.svg) Typically, the flow is initiated by a user sending a request to login to an application. This request must contain some data that proves to the server that the user is who they claim to be, which we'll call a **proof-of-identity.** An example of a proof-of-identity is a user sending the server a _username_ and _password_. @@ -55,7 +55,7 @@ This is exactly the pattern specified in the Sign-in with Ethereum ([EIP4361](ht So with this information, we can update the first the simplified diagram we made above to clarify how Auth works: -![how-auth-works-2](../assets/how-auth-works-2.png) +![how-auth-works-2](../assets/web3auth-diagram.svg) ### Authority @@ -67,7 +67,7 @@ However, Auth eliminates this dependence on third-parties by using web3 wallets This enables a truly **self-custodied** authentication flow with no external dependencies. With this information, we can now visualized the Auth flow most accurately: -![how-auth-works-3](../assets/how-auth-works-3.png) +![how-auth-works-3](../assets/auth-diagram.svg) ## Putting it all together diff --git a/docs/onboarding/10 Auth/assets/auth-diagram.svg b/docs/onboarding/10 Auth/assets/auth-diagram.svg new file mode 100644 index 000000000..0a34e94da --- /dev/null +++ b/docs/onboarding/10 Auth/assets/auth-diagram.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/onboarding/10 Auth/assets/how-auth-works-1.png b/docs/onboarding/10 Auth/assets/how-auth-works-1.png deleted file mode 100644 index 58eac945e..000000000 Binary files a/docs/onboarding/10 Auth/assets/how-auth-works-1.png and /dev/null differ diff --git a/docs/onboarding/10 Auth/assets/how-auth-works-2.png b/docs/onboarding/10 Auth/assets/how-auth-works-2.png deleted file mode 100644 index a8ac3c4ad..000000000 Binary files a/docs/onboarding/10 Auth/assets/how-auth-works-2.png and /dev/null differ diff --git a/docs/onboarding/10 Auth/assets/how-auth-works-3.png b/docs/onboarding/10 Auth/assets/how-auth-works-3.png deleted file mode 100644 index 461c5e5a7..000000000 Binary files a/docs/onboarding/10 Auth/assets/how-auth-works-3.png and /dev/null differ diff --git a/docs/onboarding/10 Auth/assets/web2auth-diagram.svg b/docs/onboarding/10 Auth/assets/web2auth-diagram.svg new file mode 100644 index 000000000..daf63a4b5 --- /dev/null +++ b/docs/onboarding/10 Auth/assets/web2auth-diagram.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/onboarding/10 Auth/assets/web3auth-diagram.svg b/docs/onboarding/10 Auth/assets/web3auth-diagram.svg new file mode 100644 index 000000000..34254cc6a --- /dev/null +++ b/docs/onboarding/10 Auth/assets/web3auth-diagram.svg @@ -0,0 +1,30 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/onboarding/11 Storage/1 How-it-works.mdx b/docs/onboarding/11 Storage/1 How-it-works.mdx index ba2bc3405..81efbf9c0 100644 --- a/docs/onboarding/11 Storage/1 How-it-works.mdx +++ b/docs/onboarding/11 Storage/1 How-it-works.mdx @@ -27,6 +27,6 @@ Learn how to upload to IPFS using Storage in the Upload Files to IPFS guide. To read data from IPFS, you need an [IPFS Gateway](https://docs.ipfs.tech/concepts/ipfs-gateway/). This allows you to access data from the IPFS protocol on browsers and other HTTP clients, such as when building an application using the Contract [SDK](https://portal.thirdweb.com/sdks). -![Screenshot of Gateway diagram](./assets/gateway.png) +![Screenshot of Gateway diagram](./assets/storage-diagram.svg) When a user requests data from the network, the request is sent to the gateway. The gateway then retrieves the data from the decentralized storage network and returns it to the user. diff --git a/docs/onboarding/11 Storage/assets/gateway.png b/docs/onboarding/11 Storage/assets/gateway.png deleted file mode 100644 index 8a2906f7d..000000000 Binary files a/docs/onboarding/11 Storage/assets/gateway.png and /dev/null differ diff --git a/docs/onboarding/11 Storage/assets/storage-diagram.svg b/docs/onboarding/11 Storage/assets/storage-diagram.svg new file mode 100644 index 000000000..434929d68 --- /dev/null +++ b/docs/onboarding/11 Storage/assets/storage-diagram.svg @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +