Search code examples
javascriptphplaravelfrontendlaravel-spark

Custom Tags in Laravel Spark Templates?

In Laravel Spark, many of the vendor templates contain what look like custom tags. For example, the <spark-update-profile-photo/> tag below.

#File: resources/views/vendor/spark/settings/profile/update-profile-photo.blade.php
<spark-update-profile-photo :user="user" inline-template>
    <!-- ... -->
</spark-update-profile-photo>

Are these tags hooks for some external front-end system? How do they work? Where would an experience PHP/Javascript programmer go to understand what these tags are doing?

Solution

  • They're Vue components. You'll find the docs for that js framework here: https://vuejs.org/, and here's a little info on extending Spark's Vue components: https://spark.laravel.com/docs/4.0/client-customization. Laracasts has a full series on Vue which is free: https://laracasts.com/series/learn-vue-2-step-by-step.