Annotated Reading of the Vue.js Components Fundamentals Course of the Vue School

These are my notes written in pandoc markdown (Casiano 2021) from watching the (VueSchool 2018) and (VueSchool 2019) courses and other references.

These notes have been ellaborated using pandoc to translate it the markdown to HTML.

At the current time (December 2021), this notes are experimental, since the HTML generated by pandoc has some incompatibilities with Vue and I had to resort to some awful tricks to made them work.

  1. I’m using the pandoc-include filter
  2. The citation styles have been taken from (Org 2021).
  3. The HTML generation is reached using (Mushiyo 2017), a Pandoc HTML template that has a navbar on the top of the page for website navigation, and a TOC (table of contents) on the sidebar for page navigation

To see the result, you can

  1. Open the deployment in the GitHub pages https://crguezl.github.io/learning-vue-geting-started-guide/ of the repo crguezl/learning-vue-geting-started-guide containing the notes or
  2. To install it locally, fork the repo. You have to have pandoc installed and then
    1. Run npm install-pandoc-dependencies to install pandoc-include
    2. Run npm start to compile the sources and open the resulting index.html file.

You can download the pdf version of this document here or by clicking in the left upper corner.

The goals. Workflow

We have three branches in this repo

  1. main has the initial structure
  2. solution has the final solution developed by the authors of the course
  3. teacher is the branch I used when I took the course

Use the main branch while you take the course

Component’s Template

Components in Depth

3 lessons • 17 min

Component Naming Best Practices 6:52 Component Lifecycle Hooks 2:14 Component Slots 7:57 3

Component Exercises

References

Casiano. 2021. “Annotated Reading of the Essentials Section of the Vue.js Guide. From Section Introduction to Section Computed Properties and Watchers.” https://github.com/crguezl/learning-vue-geting-started-guide.
Mushiyo. 2017. “Pandoc-Toc-Sidebar.” https://github.com/Mushiyo/pandoc-toc-sidebar.
Org, Citation-Style-Language GitHub. 2021. “GitHub Repo with Citation Styles.” https://github.com/citation-style-language/styles.
VueSchool. 2018. “Vue.js Fundamentals.” In. VueSchool. https://vueschool.io/courses/vuejs-fundamentals.
———. 2019. “Vue.js Component Fundamentals.” In. VueSchool. https://vueschool.io/courses/vuejs-components-fundamentals.