├── .meteor
├── .gitignore
├── release
├── platforms
├── .id
├── .finished-upgraders
├── packages
└── versions
├── .gitignore
├── client
├── layout.vue
├── app.scss
├── index.html
├── index.js
├── todos-list.vue
└── todos-display.vue
├── lib
├── collections.js
└── methods.js
├── .gitmodules
├── server
├── html-attributes.js
└── publications.js
├── README.md
└── package.json
/.meteor/.gitignore:
--------------------------------------------------------------------------------
1 | local
2 |
--------------------------------------------------------------------------------
/.meteor/release:
--------------------------------------------------------------------------------
1 | METEOR@2.5
2 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules/
2 | .cache/
3 |
--------------------------------------------------------------------------------
/.meteor/platforms:
--------------------------------------------------------------------------------
1 | server
2 | browser
3 |
--------------------------------------------------------------------------------
/client/layout.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/lib/collections.js:
--------------------------------------------------------------------------------
1 | Collections = {};
2 |
3 | Collections.Todos = new Meteor.Collection('todos');
4 |
--------------------------------------------------------------------------------
/.gitmodules:
--------------------------------------------------------------------------------
1 | [submodule "packages/tracker"]
2 | path = packages/tracker
3 | url = https://github.com/meteor-vue/tracker.git
4 |
--------------------------------------------------------------------------------
/client/app.scss:
--------------------------------------------------------------------------------
1 | @import "../../node_modules/todomvc-common/base.css";
2 | @import "../../node_modules/todomvc-app-css/index.css";
3 |
--------------------------------------------------------------------------------
/server/html-attributes.js:
--------------------------------------------------------------------------------
1 | Meteor.startup(function() {
2 | WebApp.addHtmlAttributeHook(function (request) {
3 | return {
4 | 'data-framework': 'meteor-vue'
5 | }
6 | });
7 | });
--------------------------------------------------------------------------------
/.meteor/.id:
--------------------------------------------------------------------------------
1 | # This file contains a token that is unique to your project.
2 | # Check it into your repository along with the rest of this directory.
3 | # It can be used for purposes such as:
4 | # - ensuring you don't accidentally deploy one app on top of another
5 | # - providing package authors with aggregated statistics
6 |
7 | 27et4r2t5hi07r35d0
8 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Meteor + Vue.js TodoMVC Example
2 |
3 | TodoMVC implementation using [Vue.js](http://vuejs.org/) with full Tracker and Meteor integration.
4 |
5 | You should use `git clone --recursive` to clone the repository.
6 |
7 | ## Credit
8 |
9 | This TodoMVC application was based on [Vue.js TodoMVC](https://vuejs.org/v2/examples/todomvc.html).
10 |
--------------------------------------------------------------------------------
/client/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 | Meteor + Vue.js • TodoMVC
4 |
5 |
6 |
7 |
8 |
9 |
14 |
15 |
--------------------------------------------------------------------------------
/client/index.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue';
2 | import {RouterFactory, nativeScrollBehavior} from 'meteor/akryum:vue-router2';
3 |
4 | Meteor.startup(() => {
5 | const router = new RouterFactory({
6 | mode: 'history',
7 | scrollBehavior: nativeScrollBehavior,
8 | }).create();
9 |
10 | new Vue({
11 | router,
12 | el: '#app',
13 | render: (createElement) => {
14 | return createElement(Vue.component('layout'));
15 | }
16 | });
17 | });
18 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "vue-todomvc",
3 | "private": true,
4 | "scripts": {
5 | "start": "meteor run"
6 | },
7 | "dependencies": {
8 | "@babel/runtime": "^7.6.2",
9 | "babel-runtime": "^6.26.0",
10 | "core-js": "^2.5.6",
11 | "meteor-node-stubs": "^0.3.3",
12 | "todomvc-app-css": "^2.1.2",
13 | "todomvc-common": "^1.0.5",
14 | "vue": "git://github.com/meteor-vue/vue.git#meteor",
15 | "vue-router": "^3.0.1",
16 | "vue-template-compiler": "2.6.14"
17 | },
18 | "meteor": {
19 | "vueVersion": 2
20 | },
21 | "devDependencies": {}
22 | }
23 |
--------------------------------------------------------------------------------
/.meteor/.finished-upgraders:
--------------------------------------------------------------------------------
1 | # This file contains information which helps Meteor properly upgrade your
2 | # app when you run 'meteor update'. You should check it into version control
3 | # with your project.
4 |
5 | notices-for-0.9.0
6 | notices-for-0.9.1
7 | 0.9.4-platform-file
8 | notices-for-facebook-graph-api-2
9 | 1.2.0-standard-minifiers-package
10 | 1.2.0-meteor-platform-split
11 | 1.2.0-cordova-changes
12 | 1.2.0-breaking-changes
13 | 1.3.0-split-minifiers-package
14 | 1.4.0-remove-old-dev-bundle-link
15 | 1.4.1-add-shell-server-package
16 | 1.4.3-split-account-service-packages
17 | 1.5-add-dynamic-import-package
18 | 1.7-split-underscore-from-meteor-base
19 | 1.8.3-split-jquery-from-blaze
20 |
--------------------------------------------------------------------------------
/server/publications.js:
--------------------------------------------------------------------------------
1 | Meteor.publish('todos', function (visibility) {
2 | check(visibility, Match.OneOf('all', 'active', 'completed'));
3 |
4 | this.enableScope();
5 |
6 | this.autorun((computation) => {
7 | this.setData('all', Collections.Todos.find({}).count());
8 | });
9 |
10 | this.autorun((computation) => {
11 | this.setData('remaining', Collections.Todos.find({completed: false}).count());
12 | });
13 |
14 | if (visibility === 'active') {
15 | return Collections.Todos.find({completed: false});
16 | }
17 | else if (visibility === 'completed') {
18 | return Collections.Todos.find({completed: true});
19 | }
20 | // visibility === 'all'
21 | else {
22 | return Collections.Todos.find({});
23 | }
24 | });
25 |
--------------------------------------------------------------------------------
/.meteor/packages:
--------------------------------------------------------------------------------
1 | # Meteor packages used by this project, one per line.
2 | # Check this file (and the other files in this directory) into your repository.
3 | #
4 | # 'meteor add' and 'meteor remove' will edit this file for you,
5 | # but you can also edit it by hand.
6 |
7 | meteor-base@1.5.1 # Packages every Meteor app needs to have
8 | mobile-experience@1.1.0 # Packages for a great mobile UX
9 | mongo@1.13.0 # The database Meteor supports right now
10 | reactive-var@1.0.11 # Reactive variable for tracker
11 | tracker@1.2.0 # Meteor's client-side reactive programming library
12 |
13 | standard-minifier-css@1.7.4 # CSS minifier run for production mode
14 | standard-minifier-js@2.7.1 # JS minifier run for production mode
15 | es5-shim@4.8.0 # ECMAScript 5 compatibility for older browsers.
16 | ecmascript@0.16.0 # Enable ECMAScript2015+ syntax in app code
17 | shell-server@0.5.0 # Server-side component of the `meteor shell` command
18 |
19 | dynamic-import@0.7.2
20 | static-html@1.3.2
21 |
22 | akryum:vue-component
23 | fourseven:scss
24 | akryum:vue-router2
25 | check@1.3.1
26 | audit-argument-checks@1.0.7
27 | mdg:validated-method
28 | peerlibrary:check-extension
29 | peerlibrary:subscription-scope
30 | peerlibrary:subscription-data
31 | peerlibrary:reactive-publish
32 | minimongo@1.7.0
33 | vuejs:meteor-integration
34 | underscore@1.0.10
35 |
--------------------------------------------------------------------------------
/lib/methods.js:
--------------------------------------------------------------------------------
1 | Methods = {};
2 |
3 | Methods.Todos = {};
4 |
5 | Methods.Todos.Add = new ValidatedMethod({
6 | name: 'todos.add',
7 | validate(args) {
8 | check(args, {
9 | todo: {
10 | title: Match.NonEmptyString,
11 | completed: Boolean,
12 | },
13 | });
14 | },
15 | run({todo}) {
16 | todo.timestamp = new Date();
17 | return Collections.Todos.insert(todo);
18 | },
19 | });
20 |
21 | Methods.Todos.Remove = new ValidatedMethod({
22 | name: 'todos.remove',
23 | validate(args) {
24 | check(args, {
25 | todoId: Match.DocumentId,
26 | });
27 | },
28 | run({todoId}) {
29 | return Collections.Todos.remove(todoId);
30 | },
31 | });
32 |
33 | Methods.Todos.SetTitle = new ValidatedMethod({
34 | name: 'todos.set-title',
35 | validate(args) {
36 | check(args, {
37 | todoId: Match.DocumentId,
38 | title: Match.NonEmptyString,
39 | });
40 | },
41 | run({todoId, title}) {
42 | return Collections.Todos.update(todoId, {$set: {title}});
43 | },
44 | });
45 |
46 | Methods.Todos.SetCompleted = new ValidatedMethod({
47 | name: 'todos.set-completed',
48 | validate(args) {
49 | check(args, {
50 | todoId: Match.DocumentId,
51 | completed: Boolean,
52 | });
53 | },
54 | run({todoId, completed}) {
55 | return Collections.Todos.update(todoId, {$set: {completed}});
56 | },
57 | });
58 |
59 | Methods.Todos.AllCompleted = new ValidatedMethod({
60 | name: 'todos.all-completed',
61 | validate(args) {
62 | check(args, {
63 | completed: Boolean,
64 | });
65 | },
66 | run({completed}) {
67 | return Collections.Todos.update({}, {$set: {completed}}, {multi: true});
68 | },
69 | });
70 |
71 | Methods.Todos.RemoveCompleted = new ValidatedMethod({
72 | name: 'todos.remove-completed',
73 | validate(args) {
74 | check(args, {});
75 | },
76 | run() {
77 | return Collections.Todos.remove({completed: true});
78 | },
79 | });
80 |
--------------------------------------------------------------------------------
/client/todos-list.vue:
--------------------------------------------------------------------------------
1 |
2 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/.meteor/versions:
--------------------------------------------------------------------------------
1 | akryum:npm-check@0.1.2
2 | akryum:vue-component@0.15.2
3 | akryum:vue-component-dev-client@0.4.7
4 | akryum:vue-component-dev-server@0.1.4
5 | akryum:vue-router2@0.2.3
6 | allow-deny@1.1.0
7 | audit-argument-checks@1.0.7
8 | autoupdate@1.8.0
9 | babel-compiler@7.7.0
10 | babel-runtime@1.5.0
11 | base64@1.0.12
12 | binary-heap@1.0.11
13 | blaze-tools@1.1.2
14 | boilerplate-generator@1.7.1
15 | caching-compiler@1.2.2
16 | caching-html-compiler@1.2.1
17 | callback-hook@1.4.0
18 | check@1.3.1
19 | coffeescript@2.4.1
20 | coffeescript-compiler@2.4.1
21 | ddp@1.4.0
22 | ddp-client@2.5.0
23 | ddp-common@1.4.0
24 | ddp-server@2.5.0
25 | diff-sequence@1.1.1
26 | dynamic-import@0.7.2
27 | ecmascript@0.16.0
28 | ecmascript-runtime@0.8.0
29 | ecmascript-runtime-client@0.12.1
30 | ecmascript-runtime-server@0.11.0
31 | ejson@1.1.1
32 | es5-shim@4.8.0
33 | fetch@0.1.1
34 | fourseven:scss@4.15.0
35 | geojson-utils@1.0.10
36 | hot-code-push@1.0.4
37 | html-tools@1.1.2
38 | htmljs@1.1.1
39 | id-map@1.1.1
40 | inter-process-messaging@0.1.1
41 | launch-screen@1.3.0
42 | logging@1.3.1
43 | mdg:validated-method@1.2.0
44 | meteor@1.10.0
45 | meteor-base@1.5.1
46 | minifier-css@1.6.0
47 | minifier-js@2.7.1
48 | minimongo@1.7.0
49 | mobile-experience@1.1.0
50 | mobile-status-bar@1.1.0
51 | modern-browsers@0.1.7
52 | modules@0.17.0
53 | modules-runtime@0.12.0
54 | mongo@1.13.0
55 | mongo-decimal@0.1.2
56 | mongo-dev-server@1.1.0
57 | mongo-id@1.0.8
58 | npm-mongo@3.9.1
59 | ordered-dict@1.1.0
60 | peerlibrary:assert@0.3.0
61 | peerlibrary:check-extension@0.7.0
62 | peerlibrary:computed-field@0.10.0
63 | peerlibrary:data-lookup@0.3.0
64 | peerlibrary:extend-publish@0.6.0
65 | peerlibrary:fiber-utils@0.10.0
66 | peerlibrary:reactive-mongo@0.4.0
67 | peerlibrary:reactive-publish@0.10.0
68 | peerlibrary:server-autorun@0.8.0
69 | peerlibrary:subscription-data@0.8.0
70 | peerlibrary:subscription-scope@0.5.0
71 | promise@0.12.0
72 | random@1.2.0
73 | react-fast-refresh@0.2.0
74 | reactive-var@1.0.11
75 | reload@1.3.1
76 | retry@1.1.0
77 | routepolicy@1.1.1
78 | shell-server@0.5.0
79 | socket-stream-client@0.4.0
80 | spacebars-compiler@1.3.0
81 | standard-minifier-css@1.7.4
82 | standard-minifier-js@2.7.1
83 | static-html@1.3.2
84 | templating-tools@1.2.1
85 | tracker@1.2.0
86 | underscore@1.0.10
87 | vuejs:meteor-integration@0.1.5
88 | webapp@1.13.0
89 | webapp-hashing@1.1.0
90 |
--------------------------------------------------------------------------------
/client/todos-display.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
7 |
8 |
12 |
13 |
24 |
25 |
26 |
27 |
158 |
--------------------------------------------------------------------------------