├── .meteor ├── .finished-upgraders ├── .gitignore ├── .id ├── packages ├── platforms ├── release └── versions ├── app ├── components │ ├── comments.jsx │ ├── post_list.jsx │ ├── post_page.jsx │ └── user_info.jsx ├── containers │ ├── post_list.js │ ├── post_page.js │ └── user_info.js ├── layouts │ └── blog.jsx └── router.jsx ├── lib └── collections.jsx ├── package.json ├── server ├── config.js └── publications.js └── style.css /.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 | -------------------------------------------------------------------------------- /.meteor/.gitignore: -------------------------------------------------------------------------------- 1 | local 2 | -------------------------------------------------------------------------------- /.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 | 1ajknmhsy05n714urb9s 8 | -------------------------------------------------------------------------------- /.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 # Packages every Meteor app needs to have 8 | mobile-experience # Packages for a great mobile UX 9 | mongo # The database Meteor supports right now 10 | blaze-html-templates # Compile .html files into Meteor Blaze views 11 | session # Client-side reactive dictionary for your app 12 | jquery # Helpful client-side library 13 | tracker # Meteor's client-side reactive programming library 14 | 15 | standard-minifiers # JS/CSS minifiers run for production mode 16 | es5-shim # ECMAScript 5 compatibility for older browsers. 17 | ecmascript # Enable ECMAScript2015+ syntax in app code 18 | 19 | kadira:flow-router-ssr 20 | audit-argument-checks 21 | check 22 | random 23 | accounts-password 24 | kadira:dochead 25 | -------------------------------------------------------------------------------- /.meteor/platforms: -------------------------------------------------------------------------------- 1 | server 2 | browser 3 | -------------------------------------------------------------------------------- /.meteor/release: -------------------------------------------------------------------------------- 1 | METEOR@1.3-beta.11 2 | -------------------------------------------------------------------------------- /.meteor/versions: -------------------------------------------------------------------------------- 1 | accounts-base@1.2.3-beta.11 2 | accounts-password@1.1.5-beta.11 3 | allow-deny@1.0.1-beta.11 4 | audit-argument-checks@1.0.4 5 | autoupdate@1.2.5-beta.11 6 | babel-compiler@6.4.0-beta.11 7 | babel-runtime@0.1.5-beta.11 8 | base64@1.0.5-beta.11 9 | binary-heap@1.0.5-beta.11 10 | blaze@2.1.4-beta.11 11 | blaze-html-templates@1.0.1 12 | blaze-tools@1.0.5-beta.11 13 | boilerplate-generator@1.0.5-beta.11 14 | caching-compiler@1.0.1-beta.11 15 | caching-html-compiler@1.0.3-beta.11 16 | callback-hook@1.0.5-beta.11 17 | check@1.1.1-beta.11 18 | chuangbo:cookie@1.1.0 19 | coffeescript@1.0.12-beta.11 20 | cosmos:browserify@0.9.3 21 | ddp@1.2.2 22 | ddp-client@1.2.2-beta.11 23 | ddp-common@1.2.2 24 | ddp-rate-limiter@1.0.1-beta.11 25 | ddp-server@1.2.3-beta.11 26 | deps@1.0.9 27 | diff-sequence@1.0.2-beta.11 28 | ecmascript@0.4.0-beta.11 29 | ecmascript-runtime@0.2.7-beta.11 30 | ejson@1.0.8-beta.11 31 | email@1.0.9-beta.11 32 | es5-shim@4.3.2-beta.11 33 | fastclick@1.0.8-beta.11 34 | geojson-utils@1.0.5-beta.11 35 | hot-code-push@1.0.1-beta.11 36 | html-tools@1.0.6-beta.11 37 | htmljs@1.0.6-beta.11 38 | http@1.1.2-beta.11 39 | id-map@1.0.4 40 | jquery@1.11.5-beta.11 41 | kadira:dochead@1.4.0 42 | kadira:flow-router-ssr@3.11.0 43 | launch-screen@1.0.6-beta.11 44 | livedata@1.0.15 45 | localstorage@1.0.6-beta.11 46 | logging@1.0.9-beta.11 47 | meteor@1.1.11-beta.11 48 | meteor-base@1.0.1 49 | meteor-env-dev@0.0.1-beta.11 50 | meteor-env-prod@0.0.1-beta.11 51 | meteorhacks:fast-render@2.12.0 52 | meteorhacks:inject-data@2.0.0 53 | meteorhacks:picker@1.0.3 54 | minifier-css@1.1.8-beta.11 55 | minifier-js@1.1.8-beta.11 56 | minimongo@1.0.11-beta.11 57 | mobile-experience@1.0.1 58 | mobile-status-bar@1.0.8-beta.11 59 | modules@0.5.0-beta.11 60 | modules-runtime@0.5.0-beta.11 61 | mongo@1.1.4-beta.11 62 | mongo-id@1.0.1 63 | npm-bcrypt@0.7.8_2 64 | npm-mongo@1.4.40-beta.11 65 | observe-sequence@1.0.8-beta.11 66 | ordered-dict@1.0.4 67 | promise@0.5.2-beta.11 68 | random@1.0.6-beta.11 69 | rate-limit@1.0.1-beta.11 70 | reactive-dict@1.1.4-beta.11 71 | reactive-var@1.0.6 72 | reload@1.1.5-beta.11 73 | retry@1.0.4 74 | routepolicy@1.0.7-beta.11 75 | service-configuration@1.0.6-beta.11 76 | session@1.1.2-beta.11 77 | sha@1.0.4 78 | spacebars@1.0.8-beta.11 79 | spacebars-compiler@1.0.8-beta.11 80 | srp@1.0.5-beta.11 81 | standard-minifier-css@1.0.3-beta.11 82 | standard-minifier-js@1.0.3-beta.11 83 | standard-minifiers@1.0.3-beta.11 84 | templating@1.1.6-beta.11 85 | templating-tools@1.0.1-beta.11 86 | tracker@1.0.10-beta.11 87 | ui@1.0.8 88 | underscore@1.0.5-beta.11 89 | url@1.0.6-beta.11 90 | webapp@1.2.5-beta.11 91 | webapp-hashing@1.0.6-beta.11 92 | -------------------------------------------------------------------------------- /app/components/comments.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | export const Waiting = () => ( 4 |
5 | Waiting for comments ... 6 |
7 | ); 8 | 9 | const Comments = () => (
10 | No comments yet! 11 |
); 12 | 13 | export default Comments; 14 | -------------------------------------------------------------------------------- /app/components/post_list.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const PostList = ({posts}) => ( 4 |
5 | This is the post list 6 | 13 |
14 | ); 15 | 16 | export default PostList; 17 | -------------------------------------------------------------------------------- /app/components/post_page.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import NoSSR from 'react-no-ssr'; 3 | import Comments from './comments.jsx'; 4 | import { Waiting } from './comments.jsx'; 5 | 6 | const PostPage = ({post}) => ( 7 |
8 | Back 9 |

{post.title}

10 |

{post.content}

11 |
12 | 13 | }> 14 | 15 | 16 |
17 | ); 18 | 19 | export default PostPage; 20 | -------------------------------------------------------------------------------- /app/components/user_info.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | class UserInfo extends React.Component { 4 | render() { 5 | const {user, logout, login} = this.props; 6 | return ( 7 |
8 | {user? this.renderGreeting(user, logout) : this.renderLogin(login)} 9 |
10 | ) 11 | } 12 | 13 | renderGreeting(user, logout) { 14 | return ( 15 |

16 | Hello, {user.username}. 17 | 18 |

19 | ); 20 | } 21 | 22 | renderLogin(login) { 23 | return ( 24 |

25 | 26 |

27 | ); 28 | } 29 | } 30 | 31 | export default UserInfo; 32 | -------------------------------------------------------------------------------- /app/containers/post_list.js: -------------------------------------------------------------------------------- 1 | import {composeWithTracker} from 'react-komposer'; 2 | import PostList from '../components/post_list.jsx'; 3 | import { DocHead } from 'meteor/kadira:dochead'; 4 | 5 | function composer(props, onData) { 6 | const handle = Meteor.subscribe('posts'); 7 | if(handle.ready()) { 8 | const posts = Posts.find({}, {sort: {_id: 1}}).fetch(); 9 | onData(null, {posts}); 10 | }; 11 | 12 | DocHead.setTitle('My Blog'); 13 | }; 14 | 15 | export default composeWithTracker(composer)(PostList); 16 | -------------------------------------------------------------------------------- /app/containers/post_page.js: -------------------------------------------------------------------------------- 1 | import { composeWithTracker } from 'react-komposer'; 2 | import PostPage from '../components/post_page.jsx'; 3 | import { DocHead } from 'meteor/kadira:dochead'; 4 | 5 | function composer(props, onData) { 6 | const handle = Meteor.subscribe('singlePost', props._id); 7 | 8 | if(handle.ready()) { 9 | const post = Posts.findOne({_id: props._id}); 10 | onData(null, {post}); 11 | 12 | // Make our blog posts SEO friendly 13 | DocHead.setTitle(post.title); 14 | DocHead.addMeta({ 15 | name: 'description', content: post.content.substr(0, 20) 16 | }); 17 | } 18 | }; 19 | 20 | export default composeWithTracker(composer)(PostPage); 21 | -------------------------------------------------------------------------------- /app/containers/user_info.js: -------------------------------------------------------------------------------- 1 | import {composeWithTracker} from 'react-komposer'; 2 | import UserInfo from '../components/user_info.jsx'; 3 | 4 | function login() { 5 | const username = `user: ${Random.id()}`; 6 | const password = 'password'; 7 | Accounts.createUser({username, password}); 8 | } 9 | 10 | function logout() { 11 | Meteor.logout(); 12 | } 13 | 14 | function composer(props, onData) { 15 | const user = Meteor.user(); 16 | onData(null, {user, login, logout}); 17 | }; 18 | 19 | export default composeWithTracker(composer)(UserInfo); 20 | -------------------------------------------------------------------------------- /app/layouts/blog.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import UserInfo from '../containers/user_info'; 3 | 4 | const BlogLayout = ({content}) => ( 5 |
6 |
7 | Home 8 |
9 |

My Blog

10 | 11 | {content} 12 |
13 | ); 14 | 15 | export default BlogLayout; 16 | -------------------------------------------------------------------------------- /app/router.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import {mount} from 'react-mounter'; 3 | 4 | import BlogLayout from './layouts/blog.jsx'; 5 | import PostList from './containers/post_list'; 6 | import PostPage from './containers/post_page'; 7 | 8 | FlowRouter.route("/", { 9 | name: "home", 10 | action() { 11 | mount(BlogLayout, { 12 | content: 13 | }); 14 | } 15 | }); 16 | 17 | FlowRouter.route('/post/:_id', { 18 | name: 'post', 19 | action(params) { 20 | mount(BlogLayout, { 21 | content: 22 | }); 23 | } 24 | }); 25 | -------------------------------------------------------------------------------- /lib/collections.jsx: -------------------------------------------------------------------------------- 1 | Posts = new Meteor.Collection('posts'); 2 | if(Meteor.isServer) { 3 | Posts.remove({}); 4 | Posts.insert({ 5 | _id: 'one', title: 'New Meteor Rocks', content: 'Yeah! Check our Meteor Blog for more!' 6 | }); 7 | Posts.insert({_id: 'two', title: 'MeteorHacks + Kadira => Kadira++', content: 'Something new soon.'}); 8 | Posts.insert({_id: 'three', title: 'My Secret Post', category: 'private'}); 9 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "meteor-data-and-react", 3 | "version": "0.0.0", 4 | "dependencies": { 5 | "react": "^0.14.6", 6 | "react-dom": "^0.14.6", 7 | "react-komposer": "^1.3.0", 8 | "react-mounter": "^1.1.0", 9 | "react-no-ssr": "^1.0.1" 10 | }, 11 | "private": true 12 | } 13 | -------------------------------------------------------------------------------- /server/config.js: -------------------------------------------------------------------------------- 1 | FlowRouter.setDeferScriptLoading(true); 2 | 3 | // We cache SSR pages for 10 minutes. 4 | const TEN_MINUTES = 1000 * 60 * 10; 5 | FlowRouter.setPageCacheTimeout(TEN_MINUTES); 6 | -------------------------------------------------------------------------------- /server/publications.js: -------------------------------------------------------------------------------- 1 | Meteor.publish('posts', () => { 2 | const selector = {category: {$ne: "private"}}; 3 | return Posts.find(selector); 4 | }); 5 | 6 | Meteor.publish('singlePost', _id => { 7 | check(_id, String); 8 | return Posts.find({_id}); 9 | }); 10 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | body, div, a, p, ul, li { 2 | font-family: 'Helvetica Neue', Helvetica, 'Segoe UI', Arial, freesans, sans-serif; 3 | } 4 | 5 | body { 6 | margin: 20px; 7 | } 8 | 9 | .navigation a { 10 | padding-right: 20px; 11 | } 12 | 13 | li { 14 | margin-bottom: 10px; 15 | } 16 | 17 | h1 { 18 | margin-bottom: 0px; 19 | padding-bottom: 0px; 20 | } 21 | 22 | #userinfo { 23 | margin-bottom: 15px; 24 | font-size: 13px; 25 | } 26 | 27 | #logout { 28 | margin-left: 10px; 29 | } 30 | 31 | hr { 32 | border: 0px; 33 | border-bottom: 1px solid #DDD; 34 | } 35 | --------------------------------------------------------------------------------