# Vue resources/references

## Javascript

Babel ES2015 guide (good overview to JS)
<https://babeljs.io/docs/en/learn>

## Interesting projects/things

### Strapi

<https://strapi.io/>

Strapi is a opensource headless CMS. You can self-host and use it as an admin page to generate content. You can then write a front-end, and have it consume your Strapi endpoints to display content.

A good tutorial to follow is:

<https://strapi.io/blog/build-a-blog-using-nuxt-strapi-and-apollo/>

This will use Nuxt and Strapi to create a blog.

### Pug

<https://itnext.io/pug-js-to-make-your-life-easier-with-html-templates-9c62273626e0?gi=1d44eb088155>

Pug is a HTML templating engine that lets you write simplified HTML which it will render into full html. It has additional features, like loops/condititons/includes to do fancier stuff than with pure HTML.

## Vuejs

### General (vue)

Awesome Vue
<https://github.com/ais-one/vue-crud-x>

### Extensions

Real time data-table editing in Vue:
<https://www.freecodecamp.org/news/how-to-build-a-real-time-editable-data-table-in-vue-js-46b7f0b11684/>

Integrating a datetime into a datatable CRUD:
<https://www.reddit.com/r/vuejs/comments/apdm4u/how_to_integrate_a_datepicker_like_this_in/>

Vuetify CRUD datatables:
<https://github.com/ais-one/vue-crud-x>

Loading bar component for top of page:
<https://medium.com/js-dojo/how-to-visualize-application-loading-state-in-vuetify-44f0f0242094>
<https://gist.github.com/AlexeyIsavnin/c24d7ae75bfdb599907bd36d6bfc0344>

### Tutorials/Guides (vue)

Using AJAX and rate limiting with lodash:
<https://vuejs.org/v2/guide/computed.html#Watchers>

### References

Composition API in Vue3:
<https://css-tricks.com/an-early-look-at-the-vue-3-composition-api-in-the-wild/?ref=madewithvuejs.com>

## Interesting designs

### Sites

- <https://binbytes.com>

### Fonts

- `Rene bieder campton`

## Nuxt

### General (nuxt)

<https://github.com/nuxt-community/awesome-nuxt>

### Tutorials/Guides (nuxt)

<https://strapi.io/blog/build-a-blog-using-nuxt-strapi-and-apollo/>

## Design

Good free HQ images:
<https://unsplash.com/s/photos/random>