Expectations vs Reality When Implementing vue.js

•

0 recomendaciones•199 vistas

Presented at: Open Source 101 - Columbia 2019 Presented by: Taylor Kimmett, Cognito Forms April 18th, 2019 Columbia, SC, USA

Tecnología

Expectations vs Reality
When Implementing Vue.js
Taylor Kimmett
Software developer at Cognito Forms

Aging client technology
▪ jQuery – 12 years old
▪ MSAjax – 10 years old
▪ ExoWeb
▪ open source library we built

Maintenance
▪ Loosely connected scripts
▪ JS + HTML in C#

Limited community
▪ Third party software
▪ Documentation, learning resources

Size
▪ jQuery: 91KB
▪ MsAjax: 121KB
▪ Vue + compiler: 92KB
212KB
jQuery + MsAjax
92KB
Vue + compiler

From the docs
Vue is a progressive framework for building user interfaces. Unlike other monolithic
frameworks, Vue is designed from the ground up to be incrementally adoptable. The
core library is focused on the view layer only, and is easy to pick up and integrate with
other libraries or existing projects. On the other hand, Vue is also perfectly capable of
powering sophisticated Single-Page Applications when used in combination with
modern tooling and supporting libraries.

Single File
Components
▪ Organization
▪ Clarity
▪ Separation of Concerns?

Where to start?
▪ Two sides of Cognito
▪ More complex first
Admin Public Form

The build step
▪ A necessary evil?
▪ Webpack
▪ Modules
▪ Configuration galore
▪ A force for good

Optimize requests
▪ Code generation approach
▪ Vue + Webpack approach

Testing
▪ An unexpected gift
▪ Current testing strategy
▪ Jest
▪ Easy, fast, fun

Development
community
▪ vuejs.org/
▪ github.com/chrisvfritz/vue-
enterprise-boilerplate
▪ element.eleme.io

The future
▪ Beta
▪ Compatibility
▪ Admin
▪ Optimistic

Más contenido relacionado

Similar a Expectations vs Reality When Implementing vue.js

Why Choose Vue.js For Web Development Projects.pptxScala Code

JavaScript - Kristiansand PHPholeedave

Benefits of vue.js technology for business9 series

Vue Or React - Which One is the Best_.pptx75waytechnologies

React vs. vue which framework to select and when Moon Technolabs Pvt. Ltd.

9 Best JavaScript Frameworks To ChooseAlbiorix Technology

React vs Vue: Which is the front-end development Choice?Dream Cyber Infoway

React vs. vue which framework to select and when MoonTechnolabsPvtLtd

Why do JavaScript enthusiast think of Vue.js for building real-time web appli...Katy Slemon

Javascript frameworksRajkumarJangid7

Vuejs and Web components - current stateMikhail Kuznetcov

Installing Webpack with React JS from Scratch.pdfSufalam Technologies

Is Vue catching up with React.pdfMindfire LLC

Selecting the Best Javascript Web FrameworkRajitha Pathiraja

React Js vs Node Js_ Which Framework to Choose for Your Next Web Applicationadityakumar2080

React Vs Vue.js Which One is Better.pdfLaura Miller

Vue.js vs. React.js: How to Choose the Right JavaScript TechnologyCapital Numbers

ReactJS vs Vue.js — What to choose in 2019?Pixel Crayons

Vue.Js Integrated with .Net Core_ A Modern Web Development in 2024.pdfPolyxer Systems

Angular vs React vs Vue – The Right Framework For You.pdfWPWeb Infotech

Similar a Expectations vs Reality When Implementing vue.js (20)

Why Choose Vue.js For Web Development Projects.pptx

JavaScript - Kristiansand PHP

Benefits of vue.js technology for business

Vue Or React - Which One is the Best_.pptx

React vs. vue which framework to select and when

9 Best JavaScript Frameworks To Choose

React vs Vue: Which is the front-end development Choice?

React vs. vue which framework to select and when

Why do JavaScript enthusiast think of Vue.js for building real-time web appli...

Javascript frameworks

Vuejs and Web components - current state

Installing Webpack with React JS from Scratch.pdf

Is Vue catching up with React.pdf

Selecting the Best Javascript Web Framework

React Js vs Node Js_ Which Framework to Choose for Your Next Web Application

React Vs Vue.js Which One is Better.pdf

Vue.js vs. React.js: How to Choose the Right JavaScript Technology

ReactJS vs Vue.js — What to choose in 2019?

Vue.Js Integrated with .Net Core_ A Modern Web Development in 2024.pdf

Angular vs React vs Vue – The Right Framework For You.pdf

Más de All Things Open

Building Reliability - The Realities of ObservabilityAll Things Open

Modern Database Best PracticesAll Things Open

Open Source and Public PolicyAll Things Open

Weaving Microservices into a Unified GraphQL Schema with graph-quilt - Ashpak...All Things Open

The State of Passwordless Auth on the Web - Phil NashAll Things Open

Total ReDoS: The dangers of regex in JavaScriptAll Things Open

What Does Real World Mass Adoption of Decentralized Tech Look Like?All Things Open

How to Write & Deploy a Smart ContractAll Things Open

Spinning Your Drones with Cadence Workflows, Apache Kafka and TensorFlowAll Things Open

DEI Challenges and SuccessAll Things Open

Scaling Web Applications with BackgroundAll Things Open

Supercharging tutorials with WebAssemblyAll Things Open

Using SQL to Find Needles in HaystacksAll Things Open

Configuration Security as a Game of Pursuit InterceptAll Things Open

Scaling an Open Source Sponsorship ProgramAll Things Open

Build Developer Experience Teams for Open SourceAll Things Open

Deploying Models at Scale with Apache BeamAll Things Open

Sudo – Giving access while staying in controlAll Things Open

Fortifying the Future: Tackling Security Challenges in AI/ML ApplicationsAll Things Open

Securing Cloud Resources Deployed with Control Planes on Kubernetes using Gov...All Things Open

Más de All Things Open (20)

Building Reliability - The Realities of Observability

Modern Database Best Practices

Open Source and Public Policy

Weaving Microservices into a Unified GraphQL Schema with graph-quilt - Ashpak...

The State of Passwordless Auth on the Web - Phil Nash

Total ReDoS: The dangers of regex in JavaScript

What Does Real World Mass Adoption of Decentralized Tech Look Like?

How to Write & Deploy a Smart Contract

Spinning Your Drones with Cadence Workflows, Apache Kafka and TensorFlow

DEI Challenges and Success

Scaling Web Applications with Background

Supercharging tutorials with WebAssembly

Using SQL to Find Needles in Haystacks

Configuration Security as a Game of Pursuit Intercept

Scaling an Open Source Sponsorship Program

Build Developer Experience Teams for Open Source

Deploying Models at Scale with Apache Beam

Sudo – Giving access while staying in control

Fortifying the Future: Tackling Security Challenges in AI/ML Applications

Securing Cloud Resources Deployed with Control Planes on Kubernetes using Gov...

Último

CNv6 Instructor Chapter 6 Quality of Servicegiselly40

Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1

The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge

The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los

Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer

Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer

08448380779 Call Girls In Greater Kailash - I Women Seeking MenDelhi Call girls

How to convert PDF to text with Nanonetsnaman860154

Presentation on how to chat with PDF using ChatGPT code interpreternaman860154

Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUK Journal

Histor y of HAM Radio presentation slidevu2urc

What Are The Drone Anti-jamming Systems Technology?Antenna Manufacturer Coco

Boost PC performance: How more available memory can improve productivityPrincipled Technologies

Handwritten Text Recognition for manuscripts and early printed textsMaria Levchenko

IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge

Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2

Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC

Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung

08448380779 Call Girls In Diplomatic Enclave Women Seeking MenDelhi Call girls

Driving Behavioral Change for Information Management through Data-Driven Gree...Enterprise Knowledge

Expectations vs Reality When Implementing vue.js

1. Expectations vs Reality When Implementing Vue.js Taylor Kimmett Software developer at Cognito Forms

3. Powerful, beautiful forms

6. Addressing Technical Debt

7. Aging client technology ▪ jQuery – 12 years old ▪ MSAjax – 10 years old ▪ ExoWeb ▪ open source library we built

8. Maintenance ▪ Loosely connected scripts ▪ JS + HTML in C#

10.

11.

12. Packaging

13. Limited community ▪ Third party software ▪ Documentation, learning resources

14. Size ▪ jQuery: 91KB ▪ MsAjax: 121KB ▪ Vue + compiler: 92KB 212KB jQuery + MsAjax 92KB Vue + compiler

15. The Promise of Vue

16. From the docs Vue is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries.

17. Incremental inclusion

18. Components

19. Single File Components ▪ Organization ▪ Clarity ▪ Separation of Concerns?

20. The Realities of Refactor

21. Where to start? ▪ Two sides of Cognito ▪ More complex first Admin Public Form

22. The build step ▪ A necessary evil? ▪ Webpack ▪ Modules ▪ Configuration galore ▪ A force for good

23. Mapping components

24. Translating MSAjax

25. Integrating ExoWeb

26. Simplify code generation

27.

28. Improve cashing