In addition to the Gradient Text, DARK Mode and a great responsive mobile experience, the New Vue Docs have some good really things to unpack.

In this article, we will briefly cover the MAJOR changes in different sections of the Vue 3 docs.

New Features in the Vue 3 Docs

The "Complete Scope" in the Introduction

The Introduction of this guide has been majorly changed.

The Introduction of previous docs began with the basics and ended on the component section and didn't mention the Single Page Application use of Vue given that most of the Apps in production use SPA.

The New Introduction starts with the basics and gives the full scope of what Vue can do.

It takes you from What Vue is, the Progressive Nature of Vue touching briefly on Single File Components and comparing the API choices provided by the Framework.

Choosing between the API

This is the most amazing feature of the docs!

For any code snippet given in the docs ,you can choose between the Options and the Composition API .

Here below, we are switching between the v-for directive code.

A lot of refactoring

As stated by Evan You, almost 70% of the docs have been rewritten according to the whole flow.

This includes a lot of dedicated sections like

• Vue 3 with TypeScript( with Options and Composition API)
• A high level overview of Server Side Rendering (SSR)
• Composables in Composition API

Tutorials Section

Instead of reading through the docs one can also learn hands on in the Tutorial section.

It starts with the basics and goes explaining all the Essentials in the Guide with a live editor.

Here you get the choice to switch between

• Options and Composition API
• HTML and SFC (Single File Component)

Examples Section

This section contains a list of Basic and Practical examples which were already present in the previous docs as well.

A new addition is the 7GUI project which defines Seven tasks that represent typical challenges in GUI programming.

This section also has the option to switch between API reference and Component type.

---

API Section

Instead a small list of clickable items as in the https://v3.vuejs.org/api/ API section of the docs,

The new and enriched API reference section has a searchable section for the

• Global API
• Composition API
• Options API
• and more...

---

Vue SFC(Single File Component) Playground

The playground is the same playground as used in the Tutorial and Example sections above but this one is able to persists the state in the URL.

So this can be used to share code as well as share bug reports.

You can even download the files from here and run them on your local system.

---

Conclusion

Hope you find the overview useful.

Thank for reading 😄

---