The Vue 3 Masterclass
This repository contains the source code for the supercharged, remastered 2021 Vue.js 3 Masterclass course.
Weāve taken all the feedback we got from The Vue.js 2 Masterclass, and supercharged The Vue.js Masterclass with all the new goodies from Vue.js 3 and the ecosystem.
This is our signature course. It is probably the most thorough Vue.js course available online.
The Vue.js Masterclass is so comprehensive that we can not cover everything on this page. Thus weāve created a separate page where you can learn more about it.
In our Masterclass you'll learn Vue.js by building a real-world application. Together weāll create a complete forum from scratch using exciting technologies that synergize with Vue.
The goal of the Masterclass is to teach you Vue.js along with Best Practices, Modern Javascript, and other exciting technologies, by building a Real World application - a forum.
We cover the fundamentals, like:
- Vue cli, router, and State management with Vuex
- Modern Javascript (ES6/7/8)
- User permissions & Route Guards
- Third party authentication
- Google Cloud Firestore
- Automatic code review with ESLint
- Consuming REST API
- Application architecture and best practices
We also dive into harder topics, like:
- Higher Order Functions
- Creating Vue Plugins
- Code Splitting
- Support for older Browsers
- Webpack configuration
- SEO and pre-rendering
- Deployments
By completing the Vue.js Masterclass, you will be able to land any Vue related job or optimize/improve your own projects!
Intrigued? Enroll now
Project setup
yarn install
Compiles and hot-reloads for development
yarn serve
Compiles and minifies for production
yarn build
Lints and fixes files
yarn lint
Customize configuration
Project setup
npm install
Compiles and hot-reloads for development
npm run serve
Compiles and minifies for production
npm run build
Lints and fixes files
npm run lint
Strange behavior of the VueSchool.io
Hello! You, Vue School, provide the functionality of subscriptions to your courses and link a bank card to payment methods, but you do not give the functionality of unsubscribing from courses and deleting a bank card from my personal account on your site. Or you have deliberately hidden this functionality so that it is difficult to find it on your site. This looks like a scam, because you are trying to charge money from my card and do not respond to an email about how to unsubscribe from subscriptions to your courses. How do I unsubscribe from your courses? How can I stop your attempts to debit money from my bank card? How do I delete a bank card from my personal account on your website?
API Key Expired
When I run the app locally and try to Register I get an error in Dev Tools console:
message: "{\"error\":{\"code\":400,\"message\":\"API key expired. Please renew the API key.\",\"errors\":[{\"message\":\"API key expired. Please renew the API key.\",\"domain\":\"global\",\"reason\":\"badRequest\"}],\"status\":\"INVALID_ARGUMENT\",\"details\":[{\"@type\":\"type.googleapis.com/google.rpc.ErrorInfo\",\"reason\":\"API_KEY_INVALID\",\"domain\":\"googleapis.com\",\"metadata\":{\"service\":\"identitytoolkit.googleapis.com\"}}]}}"
Do I need to make any changes on my side? Thanks!Source code portions relying on firebase doesn't work with firebase v9
The whole Firebase series in the videos is not working (as of December 2021). Thatās because the install instructions provided in these Vue School videos (ānpm install āsave firebaseā) now installs version 9 of Firebase. Version 9 (I have discovered after grinding through research the past several hours), now installs what is named āModular SDKā. That version uses different terminology than previous versions, so nothing with firebase as described in these Vue School videos works with version 9 installed.
For instance, writing āimport firebase from āfirebaseā and āfirebase.initializeAppā in main.js DOES NOT WORK with version 9. Instead, you have to type āimport { initializeApp } from 'firebase/app'ā and āinitializeApp(firebaseConfig).
Likewise, the video (and source code) instructions for ThreadShow in this video returns an error because you canāt use āimport firebase from āfirebaseāā in the script tag. I havenāt figured out what you do instead.
To code along with the videos, you need to install firebase v 8. After 3 hours of research, I havenāt figured out how to install version 8 (Googleās site is devoid of info on this). Iām guessing itās something like npm i firebase@8 or something like that.
This is defcon 1 stuff that Vue School needs to fix right away. The series comes to a screeching halt otherwise
Catching possible erros inside /thread routes (404)
I just add this after the last router path { path: '/thread/:id/:pathMatch(.)', name: 'NotFound', component: PageNotFound } //
It will catch all wrong routes inside /thread and redirect to the Not Found page
Licensing
Hi there,
Thanks for the amazing detailed course. Just wanted to understand the licensing of this final repo - MIT?
Are you able to update the licensing details? Thanks bunch!