mirror of
https://github.com/kamranahmedse/developer-roadmap.git
synced 2026-03-13 02:01:57 +08:00
Compare commits
6 Commits
interactiv
...
vue-roadma
| Author | SHA1 | Date | |
|---|---|---|---|
|
83091f1024 | ||
|
|
e071544898 | ||
|
|
bda94ed15d | ||
|
|
18d472503d | ||
|
|
92e823f17c | ||
|
|
cb3c760bcd |
@@ -275,7 +275,6 @@
|
||||
"isCommunity": false,
|
||||
"featured": true,
|
||||
"jsonUrl": "/project/vue.json",
|
||||
"landingPath": "/roadmaps/105-vue/landscape.md",
|
||||
"resourcesPath": "/roadmaps/105-vue/resources.md",
|
||||
"versions": [
|
||||
"latest",
|
||||
@@ -287,6 +286,7 @@
|
||||
"url": "https://twitter.com/kamranahmedse"
|
||||
},
|
||||
"pdfUrl": "/pdfs/vue.pdf",
|
||||
"contentPathsFilePath": "/roadmaps/105-vue/content-paths.json",
|
||||
"id": "vue",
|
||||
"metaPath": "/roadmaps/105-vue/meta.json",
|
||||
"isUpcoming": false
|
||||
|
||||
70
content/roadmaps/105-vue/content-paths.json
Normal file
70
content/roadmaps/105-vue/content-paths.json
Normal file
@@ -0,0 +1,70 @@
|
||||
{
|
||||
"home": "/roadmaps/105-vue/content/readme.md",
|
||||
"fundamental-topics": "/roadmaps/105-vue/content/100-fundamental-topics/readme.md",
|
||||
"fundamental-topics:vue-cli": "/roadmaps/105-vue/content/100-fundamental-topics/100-vue-cli.md",
|
||||
"fundamental-topics:components": "/roadmaps/105-vue/content/100-fundamental-topics/101-components/readme.md",
|
||||
"fundamental-topics:components:single-file-components": "/roadmaps/105-vue/content/100-fundamental-topics/101-components/100-single-file-components.md",
|
||||
"fundamental-topics:components:component-registration": "/roadmaps/105-vue/content/100-fundamental-topics/101-components/101-component-registration.md",
|
||||
"fundamental-topics:components:props": "/roadmaps/105-vue/content/100-fundamental-topics/101-components/102-props.md",
|
||||
"fundamental-topics:components:events": "/roadmaps/105-vue/content/100-fundamental-topics/101-components/103-events.md",
|
||||
"fundamental-topics:components:attribute-inheritance": "/roadmaps/105-vue/content/100-fundamental-topics/101-components/104-attribute-inheritance.md",
|
||||
"fundamental-topics:templates": "/roadmaps/105-vue/content/100-fundamental-topics/102-templates.md",
|
||||
"fundamental-topics:directives": "/roadmaps/105-vue/content/100-fundamental-topics/103-directives.md",
|
||||
"fundamental-topics:api-styles": "/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/readme.md",
|
||||
"fundamental-topics:api-styles:options-api": "/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/100-options-api.md",
|
||||
"fundamental-topics:api-styles:composition-api": "/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/101-composition-api.md",
|
||||
"fundamental-topics:app-configurations": "/roadmaps/105-vue/content/100-fundamental-topics/105-app-configurations.md",
|
||||
"fundamental-topics:rendering-lists": "/roadmaps/105-vue/content/100-fundamental-topics/106-rendering-lists.md",
|
||||
"fundamental-topics:conditional-rendering": "/roadmaps/105-vue/content/100-fundamental-topics/107-conditional-rendering.md",
|
||||
"fundamental-topics:lifecycle-hooks": "/roadmaps/105-vue/content/100-fundamental-topics/108-lifecycle-hooks.md",
|
||||
"fundamental-topics:forms-handling": "/roadmaps/105-vue/content/100-fundamental-topics/109-forms-handling.md",
|
||||
"fundamental-topics:events-handling": "/roadmaps/105-vue/content/100-fundamental-topics/110-events-handling.md",
|
||||
"fundamental-topics:computed-properties": "/roadmaps/105-vue/content/100-fundamental-topics/111-computed-properties.md",
|
||||
"advanced-topics": "/roadmaps/105-vue/content/101-advanced-topics/readme.md",
|
||||
"advanced-topics:ref": "/roadmaps/105-vue/content/101-advanced-topics/100-ref.md",
|
||||
"advanced-topics:torefs": "/roadmaps/105-vue/content/101-advanced-topics/101-torefs.md",
|
||||
"advanced-topics:reactive": "/roadmaps/105-vue/content/101-advanced-topics/102-reactive.md",
|
||||
"advanced-topics:computed": "/roadmaps/105-vue/content/101-advanced-topics/103-computed.md",
|
||||
"advanced-topics:watch": "/roadmaps/105-vue/content/101-advanced-topics/104-watch.md",
|
||||
"advanced-topics:next-tick": "/roadmaps/105-vue/content/101-advanced-topics/105-next-tick.md",
|
||||
"advanced-topics:composables": "/roadmaps/105-vue/content/101-advanced-topics/106-composables.md",
|
||||
"advanced-topics:async-components": "/roadmaps/105-vue/content/101-advanced-topics/107-async-components.md",
|
||||
"advanced-topics:teleport-components": "/roadmaps/105-vue/content/101-advanced-topics/108-teleport-components.md",
|
||||
"advanced-topics:provide-inject": "/roadmaps/105-vue/content/101-advanced-topics/109-provide-inject.md",
|
||||
"advanced-topics:custom-directives": "/roadmaps/105-vue/content/101-advanced-topics/110-custom-directives.md",
|
||||
"advanced-topics:custom-events": "/roadmaps/105-vue/content/101-advanced-topics/111-custom-events.md",
|
||||
"advanced-topics:plugins": "/roadmaps/105-vue/content/101-advanced-topics/112-plugins.md",
|
||||
"advanced-topics:watchers": "/roadmaps/105-vue/content/101-advanced-topics/113-watchers.md",
|
||||
"advanced-topics:slots": "/roadmaps/105-vue/content/101-advanced-topics/114-slots.md",
|
||||
"advanced-topics:transition": "/roadmaps/105-vue/content/101-advanced-topics/115-transition.md",
|
||||
"advanced-topics:transition-group": "/roadmaps/105-vue/content/101-advanced-topics/116-transition-group.md",
|
||||
"ecosystem": "/roadmaps/105-vue/content/102-ecosystem/readme.md",
|
||||
"ecosystem:routing": "/roadmaps/105-vue/content/102-ecosystem/100-routing/readme.md",
|
||||
"ecosystem:routing:vue-router": "/roadmaps/105-vue/content/102-ecosystem/100-routing/100-vue-router.md",
|
||||
"ecosystem:forms": "/roadmaps/105-vue/content/102-ecosystem/101-forms/readme.md",
|
||||
"ecosystem:forms:vue-formulate": "/roadmaps/105-vue/content/102-ecosystem/101-forms/100-vue-formulate.md",
|
||||
"ecosystem:forms:vee-validate": "/roadmaps/105-vue/content/102-ecosystem/101-forms/101-vee-validate.md",
|
||||
"ecosystem:forms:vuelidate": "/roadmaps/105-vue/content/102-ecosystem/101-forms/102-vuelidate.md",
|
||||
"ecosystem:ssr": "/roadmaps/105-vue/content/102-ecosystem/102-ssr/readme.md",
|
||||
"ecosystem:ssr:quasar": "/roadmaps/105-vue/content/102-ecosystem/102-ssr/100-quasar.md",
|
||||
"ecosystem:ssr:nuxt-js": "/roadmaps/105-vue/content/102-ecosystem/102-ssr/101-nuxt-js.md",
|
||||
"ecosystem:ssg": "/roadmaps/105-vue/content/102-ecosystem/103-ssg/readme.md",
|
||||
"ecosystem:ssg:gridsome": "/roadmaps/105-vue/content/102-ecosystem/103-ssg/100-gridsome.md",
|
||||
"ecosystem:ssg:vuepress": "/roadmaps/105-vue/content/102-ecosystem/103-ssg/101-vuepress.md",
|
||||
"ecosystem:state-management": "/roadmaps/105-vue/content/102-ecosystem/104-state-management/readme.md",
|
||||
"ecosystem:state-management:pinia": "/roadmaps/105-vue/content/102-ecosystem/104-state-management/100-pinia.md",
|
||||
"ecosystem:mobile-apps": "/roadmaps/105-vue/content/102-ecosystem/105-mobile-apps/readme.md",
|
||||
"ecosystem:mobile-apps:capacitor": "/roadmaps/105-vue/content/102-ecosystem/105-mobile-apps/100-capacitor.md",
|
||||
"ecosystem:api-calls": "/roadmaps/105-vue/content/102-ecosystem/106-api-calls/readme.md",
|
||||
"ecosystem:api-calls:apollo": "/roadmaps/105-vue/content/102-ecosystem/106-api-calls/100-apollo.md",
|
||||
"ecosystem:api-calls:vue-relay": "/roadmaps/105-vue/content/102-ecosystem/106-api-calls/101-vue-relay.md",
|
||||
"ecosystem:api-calls:axios": "/roadmaps/105-vue/content/102-ecosystem/106-api-calls/102-axios.md",
|
||||
"ecosystem:api-calls:unfetch": "/roadmaps/105-vue/content/102-ecosystem/106-api-calls/103-unfetch.md",
|
||||
"ecosystem:api-calls:superagent": "/roadmaps/105-vue/content/102-ecosystem/106-api-calls/104-superagent.md",
|
||||
"ecosystem:jest": "/roadmaps/105-vue/content/102-ecosystem/107-jest.md",
|
||||
"ecosystem:vue-testing-library": "/roadmaps/105-vue/content/102-ecosystem/108-vue-testing-library.md",
|
||||
"ecosystem:cypress": "/roadmaps/105-vue/content/102-ecosystem/109-cypress.md",
|
||||
"ecosystem:tailwind-css": "/roadmaps/105-vue/content/102-ecosystem/110-tailwind-css.md",
|
||||
"ecosystem:vuetify": "/roadmaps/105-vue/content/102-ecosystem/111-vuetify.md",
|
||||
"ecosystem:element-ui": "/roadmaps/105-vue/content/102-ecosystem/112-element-ui.md"
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
# Vue cli
|
||||
@@ -0,0 +1 @@
|
||||
# Single file components
|
||||
@@ -0,0 +1 @@
|
||||
# Component registration
|
||||
@@ -0,0 +1 @@
|
||||
# Props
|
||||
@@ -0,0 +1 @@
|
||||
# Events
|
||||
@@ -0,0 +1 @@
|
||||
# Attribute inheritance
|
||||
@@ -0,0 +1 @@
|
||||
# Components
|
||||
@@ -0,0 +1 @@
|
||||
# Templates
|
||||
@@ -0,0 +1 @@
|
||||
# Directives
|
||||
@@ -0,0 +1 @@
|
||||
# Options api
|
||||
@@ -0,0 +1 @@
|
||||
# Composition api
|
||||
@@ -0,0 +1 @@
|
||||
# Api styles
|
||||
@@ -0,0 +1 @@
|
||||
# App configurations
|
||||
@@ -0,0 +1 @@
|
||||
# Rendering lists
|
||||
@@ -0,0 +1 @@
|
||||
# Conditional rendering
|
||||
@@ -0,0 +1 @@
|
||||
# Lifecycle hooks
|
||||
@@ -0,0 +1 @@
|
||||
# Forms handling
|
||||
@@ -0,0 +1 @@
|
||||
# Events handling
|
||||
@@ -0,0 +1 @@
|
||||
# Computed properties
|
||||
@@ -0,0 +1 @@
|
||||
# Fundamental topics
|
||||
@@ -0,0 +1 @@
|
||||
# Ref
|
||||
@@ -0,0 +1 @@
|
||||
# Torefs
|
||||
@@ -0,0 +1 @@
|
||||
# Reactive
|
||||
@@ -0,0 +1 @@
|
||||
# Computed
|
||||
@@ -0,0 +1 @@
|
||||
# Watch
|
||||
@@ -0,0 +1 @@
|
||||
# Next tick
|
||||
@@ -0,0 +1 @@
|
||||
# Composables
|
||||
@@ -0,0 +1 @@
|
||||
# Async components
|
||||
@@ -0,0 +1 @@
|
||||
# Teleport components
|
||||
@@ -0,0 +1 @@
|
||||
# Provide inject
|
||||
@@ -0,0 +1 @@
|
||||
# Custom directives
|
||||
@@ -0,0 +1 @@
|
||||
# Custom events
|
||||
@@ -0,0 +1 @@
|
||||
# Plugins
|
||||
@@ -0,0 +1 @@
|
||||
# Watchers
|
||||
@@ -0,0 +1 @@
|
||||
# Slots
|
||||
@@ -0,0 +1 @@
|
||||
# Transition
|
||||
@@ -0,0 +1 @@
|
||||
# Transition group
|
||||
@@ -0,0 +1 @@
|
||||
# Advanced topics
|
||||
@@ -0,0 +1 @@
|
||||
# Vue router
|
||||
@@ -0,0 +1 @@
|
||||
# Routing
|
||||
@@ -0,0 +1 @@
|
||||
# Vue formulate
|
||||
@@ -0,0 +1 @@
|
||||
# Vee validate
|
||||
@@ -0,0 +1 @@
|
||||
# Vuelidate
|
||||
@@ -0,0 +1 @@
|
||||
# Forms
|
||||
@@ -0,0 +1 @@
|
||||
# Quasar
|
||||
@@ -0,0 +1 @@
|
||||
# Nuxt js
|
||||
@@ -0,0 +1 @@
|
||||
# Ssr
|
||||
@@ -0,0 +1 @@
|
||||
# Gridsome
|
||||
@@ -0,0 +1 @@
|
||||
# Vuepress
|
||||
@@ -0,0 +1 @@
|
||||
# Ssg
|
||||
@@ -0,0 +1 @@
|
||||
# Pinia
|
||||
@@ -0,0 +1 @@
|
||||
# State management
|
||||
@@ -0,0 +1 @@
|
||||
# Capacitor
|
||||
@@ -0,0 +1 @@
|
||||
# Mobile apps
|
||||
@@ -0,0 +1 @@
|
||||
# Apollo
|
||||
@@ -0,0 +1 @@
|
||||
# Vue relay
|
||||
@@ -0,0 +1 @@
|
||||
# Axios
|
||||
@@ -0,0 +1 @@
|
||||
# Unfetch
|
||||
@@ -0,0 +1 @@
|
||||
# Superagent
|
||||
@@ -0,0 +1 @@
|
||||
# Api calls
|
||||
@@ -0,0 +1 @@
|
||||
# Jest
|
||||
@@ -0,0 +1 @@
|
||||
# Vue testing library
|
||||
@@ -0,0 +1 @@
|
||||
# Cypress
|
||||
@@ -0,0 +1 @@
|
||||
# Tailwind css
|
||||
@@ -0,0 +1 @@
|
||||
# Vuetify
|
||||
@@ -0,0 +1 @@
|
||||
# Element ui
|
||||
1
content/roadmaps/105-vue/content/102-ecosystem/readme.md
Normal file
1
content/roadmaps/105-vue/content/102-ecosystem/readme.md
Normal file
@@ -0,0 +1 @@
|
||||
# Ecosystem
|
||||
1
content/roadmaps/105-vue/content/readme.md
Normal file
1
content/roadmaps/105-vue/content/readme.md
Normal file
@@ -0,0 +1 @@
|
||||
#
|
||||
@@ -1,7 +0,0 @@
|
||||
The intent of this guide is to give you an idea about the Vue ecosystem and to help guide your learning if you are confused. We have another [roadmap on the Frontend Development](/frontend) that focuses on the frontend development if you are interested in that.
|
||||
|
||||
Also, please note that the list below is exhaustive, and the items are listed in no particular order. You don't need to learn everything listed in the picture, however knowing what you don't know is as important as knowing things.
|
||||
|
||||
|
||||
|
||||
Please note that the list is opinionated, and you might have different opinions than those of the author. Having said that, [we would love to hear your opinions](https://github.com/kamranahmedse/developer-roadmap/issues/new) and incorporate them in the picture if suitable.
|
||||
@@ -36,7 +36,6 @@
|
||||
"isCommunity": false,
|
||||
"featured": true,
|
||||
"jsonUrl": "/project/vue.json",
|
||||
"landingPath": "./landscape.md",
|
||||
"resourcesPath": "./resources.md",
|
||||
"versions": [
|
||||
"latest",
|
||||
@@ -47,5 +46,6 @@
|
||||
"name": "Kamran Ahmed",
|
||||
"url": "https://twitter.com/kamranahmedse"
|
||||
},
|
||||
"pdfUrl": "/pdfs/vue.pdf"
|
||||
"pdfUrl": "/pdfs/vue.pdf",
|
||||
"contentPathsFilePath": "./content-paths.json"
|
||||
}
|
||||
|
||||
@@ -43,5 +43,5 @@ export function getFeaturedRoadmaps(): RoadmapType[] {
|
||||
}
|
||||
|
||||
export function isInteractiveRoadmap(id: string): boolean {
|
||||
return ['frontend', 'backend', 'devops'].includes(id);
|
||||
return ['frontend', 'backend', 'devops', 'vue'].includes(id);
|
||||
}
|
||||
|
||||
@@ -125,6 +125,10 @@ export function InteractiveRoadmapRenderer(props: RoadmapProps) {
|
||||
minHeight = ['870px', '1920px', '2505px', '2591px', '2591px', '2591px'];
|
||||
}
|
||||
|
||||
if (roadmap.id === 'vue') {
|
||||
minHeight = ['600px', '820px', '1340px', '1680px', '1750px', '1750px'];
|
||||
}
|
||||
|
||||
return (
|
||||
<Container maxW={'container.lg'} position="relative" minHeight={minHeight}>
|
||||
{(isLoading || isRendering) && <RoadmapLoader />}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -33,43 +33,43 @@
|
||||
<url>
|
||||
<loc>https://roadmap.sh/vue</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<lastmod>2022-08-08T14:27:17.274Z</lastmod>
|
||||
<lastmod>2022-08-08T14:56:45.396Z</lastmod>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://roadmap.sh/android</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<lastmod>2022-08-04T11:37:35.837Z</lastmod>
|
||||
<lastmod>2022-08-08T14:33:53.387Z</lastmod>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://roadmap.sh/python</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<lastmod>2022-08-04T11:37:35.844Z</lastmod>
|
||||
<lastmod>2022-08-08T14:33:53.388Z</lastmod>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://roadmap.sh/golang</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<lastmod>2022-08-04T11:37:35.847Z</lastmod>
|
||||
<lastmod>2022-08-08T14:33:53.389Z</lastmod>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://roadmap.sh/java</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<lastmod>2022-08-04T11:37:35.840Z</lastmod>
|
||||
<lastmod>2022-08-08T14:33:53.389Z</lastmod>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://roadmap.sh/postgresql-dba</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<lastmod>2022-08-04T11:37:35.848Z</lastmod>
|
||||
<lastmod>2022-08-08T14:33:53.390Z</lastmod>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://roadmap.sh/qa</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<lastmod>2022-08-04T11:37:35.836Z</lastmod>
|
||||
<lastmod>2022-08-08T14:33:53.391Z</lastmod>
|
||||
<priority>1.0</priority>
|
||||
</url>
|
||||
<url>
|
||||
|
||||
@@ -43,6 +43,7 @@ const roadmaps: Record<string, RoadmapType> = {
|
||||
java: require('../public/project/java.json'),
|
||||
python: require('../public/project/python.json'),
|
||||
react: require('../public/project/react.json'),
|
||||
vue: require('../public/project/vue.json'),
|
||||
angular: require('../public/project/angular.json'),
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user