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
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)
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.
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.
Hope you find the overview useful.
Thank for reading 😄
Did you find this article valuable?
Support Yashasvi Singh by becoming a sponsor. Any amount is appreciated!