bboy114crew / react-vue-comparison

Comparing the syntax of React.js/Next.js and Vue.js/Nuxt.js side by side

React-Vue-Comparison

This repo is for someone who already familiar with React.js or Vue.js, and wants to find out the relative syntax in another framework.

	⭐️	VERSION	OPEN ISSUES & PR	DOWNLOADS/wk
React: npm gh doc	159,663	17.0.1	655	8,711,983
Vue: npm gh doc	175,804	2.6.12	543	1,950,408
Next.js: npm gh doc	57,670	10.0.3	822	991,796
Nuxt.js: npm gh doc	32,252	2.14.7	397	265,907
React-Router: npm gh doc	42,097	5.2.0	47	3,945,331
Vue-Router: npm gh doc	17,395	3.4.9	109	1,411,546
redux: npm gh doc	54,751	4.0.5	43	4,609,465
react-redux: npm gh doc	20,294	7.2.2	31	3,693,782
vuex: npm gh doc	25,253	3.6.0	44	1,327,908

Update: 2020/11/27

---

Contents

React.js vs Vue.js

• Render
• Basic-Component
• Prop
• Event-Binding
• Custom-Event
• State
• Change-State
• Two-Way-Binding(Vue.js only)
• Compute
• Watch
• Children-and-Slot
• Render-HTML
• Conditional-Rendering
• List-Rendering
• Render-Props
• Lifecycle
• Error-Handling
• Ref
• Performance-Optimization

Next.js vs Nuxt.js

• Assets
• Basic-Routes
• Dynamic-Routes
• Link
• Fetch-On-Server
• Layout
• Error-Page
• Meta-Tag
• Context

Tools

• CLI
• DevTools

React-Router vs Vue-Router

• Basic-Routing
• Dynamic-Routing
• Nested-Routing
• Link
• NavLink
• Get-Location
• Push
• Replace
• Redirect
• Event
• Scroll
• Lazy-Loading-and-Code-Splitting

Redux vs Vuex

• Create-Store
• Action
• Async-Action
• Reducer | Mutation
• Combine-Reducers | Modules
• Connect-with-Component
• Middleware | Plugin
• Selector | Getter
• DevTools

---

Reference

• React.js
• Next.js
• React Router
• Vue.js
• Nuxt.js
• Vue Router
• Redux
• React-Redux
• Reselect
• Vuex