Google Doc - Clone

Endpoint

https://frontend-omega-ochre.vercel.app/

When you hit this endpoint. It will redirect to you /document/id. Where id will be generated randomly for every document.

Share

You can generate share link by clicking on Share button. it will pop up a modal where you will get button with the text "Copy link". When you click on that button. link will be copeid in your clipboard.

Pages

Editor

This page shows some text styling options. you can make bold, italic, underline your text and also give some color to the text. You can add heading, quote, super script, sub script, some font style. You can upload images with a limited size.

Screenshot (350)


! Important

If you want to save your document. you have to press ctrl+s

after that you can see status of your document in the navbar

Screenshot (353)

Navbar

In the navbar section, you can change your document name. and there is status which is shows only when you change your document name or document status, when you will press ctrl+s for saving the document.

Screenshot (351)

ShareModal

In this component, I implemented a copy link feature. where you can see a pop up with the button "Copy link".

Screenshot (354)

Screenshot (358)

view

When you hit the url that you got by clicking on "Copy link" button. It will show the view pages. where you can only see the document. you will not be able to make any changes even you cannot change your document name.

Screenshot (357)

components/Icons

In this component you can see other products of google



Thank You