• Stars
    star
    234
  • Rank 171,630 (Top 4 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 6 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Easy coupling of firestore and a vuex module. 2-way sync with 0 boilerplate!

Vuex Easy Firestore πŸ”₯

In just 4 lines of code, get your vuex module in complete 2-way sync with firestore:

const userModule = {
  firestorePath: 'users/{userId}/data',
  firestoreRefType: 'collection', // or 'doc'
  moduleName: 'user',
  statePropName: 'docs',
  // the rest of your module here
}
// add userModule as vuex plugin wrapped in vuex-easy-firestore

and Alakazam! Now you have a vuex module called user with state: {docs: {}}. All firestore documents in your collection will be added with the doc's id as key inside docs in your state.

Now you just update and add docs with dispatch('user/set', newItem) and forget about the rest!

Other features include hooks, fillables (limit props to sync), default values (add props on sync), a fetch function and much more...

Installation and setupγ€€β†’

Motivation

I didn't like writing an entire an API wrapper from scratch for firestore every single project. If only a vuex module could be in perfect sync with firestore without having to code all the boilerplate yourself...

And that's how Vuex Easy Firestore was born.

Documentation

See the all new documentation made with VuePress!

Full documentation

Support

If you like what I built, you can say thanks by buying me a coffee! :)

Buy Me A Coffee

Thank you so much!! Every little bit helps.

More Repositories

1

merge-anything

Merge objects & other types recursively. A simple & small integration.
TypeScript
336
star
2

is-what

JS type check (TypeScript supported) functions like `isPlainObject() isArray()` etc. A simple & small integration.
TypeScript
170
star
3

case-anything

camelCase, kebab-case, PascalCase... a simple integration with nano package size. (SMALL footprint!)
TypeScript
92
star
4

vuex-easy-access

Unified syntax for accessing your Vuex store through simple set() and get() functions + auto generate mutations
JavaScript
52
star
5

quasar-app-extension-draggable

A Quasar extension that makes elements draggable and movable with keyboard.
Vue
48
star
6

copy-anything

An optimised way to copy'ing (cloning) an Object or Array. A small and simple integration
TypeScript
40
star
7

filter-anything

A simple (TypeScript) integration of "pick" and "omit" to filter props of an object
TypeScript
31
star
8

quasar-ui-easy-forms

A Quasar extension to easily generate forms by only defining a "schema" object.
JavaScript
31
star
9

quasar-app-extension-swipe-to-close

A Quasar extension that allows you to close dialogs by swiping.
Vue
29
star
10

flatten-anything

Flatten objects and replace nested props with 'prop.subprop'. A simple and small integration.
TypeScript
25
star
11

find-and-replace-anything

Replace one val with another or all occurrences in an object recursively. A simple & small integration.
TypeScript
21
star
12

is-where

JS environment check functions like `isWebkit() isSafari() isBrowser() isNode()` etc. A simple & small integration.
TypeScript
19
star
13

quasar-ui-easy-tables

JavaScript
10
star
14

vuex-easy-firestore-sample-app

This is a sample app for vuex-easy-firestore
Vue
9
star
15

compare-anything

Compares objects and tells you which props are duplicate, and props are only present once.
TypeScript
9
star
16

remove-anything

An optimised way to remove any prop value (eg. undefined, empty objects, ...) from an object. A small and simple integration
TypeScript
8
star
17

map-anything

Array.map but for objects with good TypeScript support. A small and simple integration.
TypeScript
7
star
18

getorset-anything

Gets a value from a Map/Obj or sets an initial value when not found and returns that. TypeScript supported.
TypeScript
7
star
19

nestify-anything

Recreates an object from any `nested.props`. A simple and small integration.
TypeScript
5
star
20

check-anything

Checks anything from URLs to email addresses. A small and simple integration.
TypeScript
4
star
21

SwiftDataSugar

🌯 A collection of utilities that make it easier to work with SwiftData in a SwiftUI environment
Swift
4
star
22

sha-anything

A tiny TS utility to sha256 anything, including objects
TypeScript
3
star
23

SwiftVsTypeScript

A cheatsheet for those dabbling in both languages πŸ‘πŸ»
Vue
3
star
24

quasar-app-extension-draggable-demo

Demo for: A Quasar extension that makes elements draggable and movable with keyboard.
Vue
2
star
25

lucaban.com

Portal website lucaban.com
JavaScript
2
star
26

JustSugar

🍰 JS-inspired Syntax Sugar on top of Swift to make working with Arrays/Strings/... easier
Swift
2
star
27

CaseAnything

🐫 Swift Case Conversions β€” camelCase PascalCase UpperCamelCase kebab-case snake_case CONSTANT_CASE Train-Case Ada_Case COBOL-CASE Dot.notation Path/case Space case Capital Case lower case UPPER CASE
Swift
2
star
28

commafy-anything

Return a number as string with , or K. A simple and small integration
TypeScript
2
star
29

roll-anything

This is a very tiny dice util. 🎲 You can roll a dice with any amount of sides.
TypeScript
1
star
30

path-to-prop

Retrieves a property from an object based on a path.to.that.prop
TypeScript
1
star
31

MicroMaxOnAppleSilicon

β™ŸοΈ The Β΅-Max C Chess engine to play Chess games. Built as multi-platform Swift Package for iOS, visionOS, macOS
C++
1
star
32

SwiftStringCatalogsPOC

A proof of concept that combines the String Catalog of a Swift Package together with a host app's.
Swift
1
star