introduction.vue

<template>
  <div class='tutorial'>
    <br><br>
    <h2>🦄 What's the buzz around Vue.js, anyway?</h2>
    Vue (pronounced like view) is a progressive framework for building user interfaces.
    <br><br>
    <h2>🤔 Umm, what do you mean by progressive?</h2>
    So the idea behind calling Vue a progressive framework (and not just another javascript framework) is that you can start small and gradually build something bigger. Basically you can just drop Vue.js into your project and adopt it incrementally.
    <br><br>
    <h2>👻 Well, is that all..?</h2>
    Glad you asked! Vue is also reactive - so when any data changes, Vue takes care of updating it at all the places it's being used.
    <br><br>
    But wait... there's more! Vue is also:
    <ol>
      <li>🤗 Approachable - If you know HTML, CSS, and JavaScript, you can get onboarded in no time.</li>
      <li>💪 Versatile - Vue can be used as a library as well as a framework.</li>
      <li>⚡ Performant - It's blazing fast and adds only 20KB to your bundle size.</li>
      <li>✍️ Maintainable - As you'll see in the "Single File Component" tutorial, Vue makes it effortless to manage complex interfaces as well.</li>
      <li>🧪 Testable - This is more like a prerequisite for any new framework nowadays.</li>
    </ol>
    <br>
    You'll fall in love with Vue's simplicity, I promise! 👊
    <br><br>
    <h2>🤑 I'm sold! What now?</h2>
    Head over to the <nuxt-link to="/hello-world">next tutorial</nuxt-link> and enjoy the vue! (see what I did there? 😏)
    <br><br>
    <h2>🤪 Fun Facts</h2>
    <ul>
      <li>
        Vue was created by Evan You after working for Google using AngularJS in a number of projects.
        <br>
        In his own words, <q>I figured, what if I could just extract the part that I really liked about Angular and build something really lightweight.</q> And voila, Vue was born.
      </li>
      <li>
        It does not have any corporate backing and is run on community funds via Patreon.
      </li>
      <li>
        In mid 2018, Vue surpassed React's star count on GitHub. In early 2019, Vue became the second most starred project on GitHub (only behind freeCodeCamp)!
      </li>
      <li>
        The code names of Vue releases are, well... <a href="https://github.com/egoist/always-bet-on-vue" target="_blank" rel="noopener noreferrer">see for yourself</a>. 😉
      </li>
    </ul>
    <TutorialNavigation/>
  </div>
</template>

<script>
  import TutorialNavigation from '~/components/TutorialNavigation.vue'
  export default {
    components: {
      TutorialNavigation
    }
  }
</script>

<style scoped>
.tutorial {
  width: 80%;
  margin: auto;
}
</style>