Client template proposal and needs

[rafibomb]

Proposal: We build a new client template that is future forward, webpack based, and simplifies integration for our clients regardless if they are building a site or an app.

We'll likely need two versions of this template both based on the same tech stack.

• Vue.js components and templating
  • SPA option
  • Prerender (Static Site Generation)
• ES2015+ with Babel
• webpack module bundling
• JS and Sass Linting
• Minify JS and CSS
• Netlify Deploy
• Browsersync like function
• Node Sass, PostCSS, Autoprefixer
• Styleguide generator
  • Contextual HEAD updates
  • multiple layouts

For websites, we can use jQuery and Foundation wrapped with vue directives. (Or if the client wants jQuery) For apps, we'll need to fill in some core plugins with Vue.js components or vanilla JS libraries.

Core plugins:

• [ ] Modal
  • https://github.com/euvl/vue-js-modal
  • https://vuejs.org/v2/examples/modal.html
• [ ] Off-canvas
  • https://github.com/toomuchdesign/offside
• [ ] Dropdown
  • https://vuejsexamples.com/dropdown-component-for-vuejs/
• [ ] Tooltips
  • https://atomiks.github.io/tippyjs/
• [ ] Accordion
  • https://vuejsexamples.com/simple-and-smooth-vue-accordion/
• [ ] Form validation
  • https://vuejs.org/v2/cookbook/form-validation.html
• [ ] Tabs
  • https://github.com/cferdinandi/tabby
  • https://van11y.net/accessible-tab-panel/
• [ ] SVG Injector
  • https://github.com/flobacher/SVGInjector2

Optional add-ons:

• Carousel
  • https://owlcarousel2.github.io/OwlCarousel2/
• Sticky
  • https://rgalus.github.io/sticky-js/
  • https://dollarshaveclub.github.io/stickybits/
• Animation triggers
  • https://github.com/michalsnik/aos/tree/v2
• Charts
  • https://www.chartjs.org/

[jnemeth]

Interesting read @tdhartwick shared: https://2018.stateofjs.com/front-end-frameworks/overview/

My preference is being agnostic to JS and JS frameworks. Nice to have something 'just for us' we can grab for apps like VUE, but not limit everyone else to use only vue