JSFoo: VueDay 2019

A day spent discussing Vue.js, developments in the Vue ecosystem and component architecture

Tickets

A modular approach to building large scale Vue apps

Submitted by Kunal Varma (@kunalvarma05) on Saturday, 11 May 2019

Section: Full talk (40 mins) Technical level: Intermediate

View proposal in schedule

Abstract

Vue has been gaining a lot of acclaim in the world of modern FrontEnd development - especially for being easy-to-learn and to get started with. Yet, its a common notion that Vue is only suitable for small to medium sized applications and/or limited to certain parts or modules of a large application.

In this talk, we will look at what goes in to building a large-scale Vue app by leveraging modularity, addressing common pitfalls, (design) patterns to solve recurrent problems, and nifty tips/tricks to enhance your development experience. Everything covered during the talk is sourced from the learnings derived out of building fairly large-scale applications in Vue over the last 4 years, with each topic accompanied by one or more scenarios.

Outline

  • Introduction
  • What is a Large Scale Application
  • Anatomy of a typical Vue app
  • What’s a Module?
  • Conventions are good
  • Demo
  • End

Requirements

Have a cup of coffee before the talk ;)

Speaker bio

Kunal is an early Vue adopter (when v-for was v-repeat) and an ardent evangelist of Vue. He is notorious for his dark humor, and pulling pranks on his peers. Amongst other things, he is the co-founder and CTO of ClearGlass Analytics.

Links

Slides

https://docs.google.com/presentation/d/1Y35GNEb02WxtaS_KorMlpkgjtNU2tR7ruq6xHPQczO0/edit?usp=sharing

Comments

  • Abhishek Balaji (@booleanbalaji) Reviewer 5 months ago (edited 5 months ago)

    Hi Kunal,

    We need your slides and preview video to evaluate your proposal. I see you’ve added the slides from a previous conference. If you’d be using the same deck, please add the following to the slide deck along with the preview video by editing it, on or before 21 May.

    Your slides need to cover the following:

    • Clear problem statement, about a challenge that is generally applicable and not a company specific problem.
    • Approach to solving the problem.
    • Deep dive.
    • One clear takeaway.
  • Abhishek Balaji (@booleanbalaji) Reviewer 4 months ago

    Kunal, please make your slides accessible to the public for your proposal to be evaluated.

  • Abhishek Balaji (@booleanbalaji) Reviewer 4 months ago

    Moving this to reject, since proposer hasnt responded.

    • Kunal Varma (@kunalvarma05) Proposer 4 months ago

      Abhishek, apologies for the delay but I only just saw the comment. The slides have been made public and hope that the proposal is put back up :)

      • Abhishek Balaji (@booleanbalaji) Reviewer 4 months ago

        Thanks, updated.

  • Zainab Bawa (@zainabbawa) Reviewer 2 months ago

    Kunal, these slides are work in progress in that these aren’t finished. We can make a decision on your proposal if you submit complete slides by 5 August. You have to address the following feedback in your slides:

    1. Is this a talk where you share war stories and experiences that you have gathered or are you just abstracting from your experiences to give participants a high-level view of modularity for large-scale Vue apps? In either case, you have to give examples and metrics substantiating your recommendations. Plain recommendations without grounded evidence is not useful for practitioners.
    2. The fonts on this slide are visually disturbing. Use simple fonts like Helvetica Nue or Lato or Fira Sans so that your slides are more readable.
    3. Black background is a no-no because it doesn’t render on the screen at auditorium scale. Use lighter background colour such a white or light blue/green.
    4. Why does Vue Middleware suddenly appear in between slides?
    5. Tips and tricks slide is incomplete. Add details.
    6. Conclusion slide is missing.
    7. Also, is there anything peculiar about modularity with Vue app as compared with say React apps?

    As mentioned, revised slides have to be submitted by 5 August to close the decision on your proposal.

  • Swapnil Agarwal (@swapagarwal) 2 months ago

    Hi Kunal! 👋
    The current content is good. Do you plan to include the rest of the things mentioned in the outline as well? 🙂

  • Abhishek Balaji (@booleanbalaji) Reviewer 2 months ago

    Hi Kunal,

    Thanks for going through the rehearsal. Here’s the feedback from the call:

    • Reduce the amount of text in the slides, in general.
    • Use the text on the slides as a guiding point. Don’t read off the slides.
    • Add a few points on the impact caused
    • Avoid repetition in the slides when explaining about large scale vue applications
    • Talk about what is it you’re using with VueX store and other possibilities.
    • For someone coming from a React background, the architecture would be pretty familiar.
    • Clarify more aspects of the data fetching models, between responsibility based or page based

    Please update your slides based on the feedback shared and add the updated link by Monday. We’ll do a final review of the proposal then.

  • Abhishek Balaji (@booleanbalaji) Reviewer 2 months ago

    Hi Kunal,

    Thanks for going through the rehearsal. Here’s the feedback from the call:

    • Reduce the amount of text in the slides, in general.
    • Use the text on the slides as a guiding point. Don’t read off the slides.
    • Add a few points on the impact caused
    • Avoid repetition in the slides when explaining about large scale vue applications
    • Talk about what is it you’re using with VueX store and other possibilities.
    • For someone coming from a React background, the architecture would be pretty familiar.
    • Clarify more aspects of the data fetching models, between responsibility based or page based

    Please update your slides based on the feedback shared and add the updated link by Monday. We’ll do a final review of the proposal then.

Login with Twitter or Google to leave a comment