diff --git a/examples/react-starter/.meteor/.finished-upgraders b/examples/react-starter/.meteor/.finished-upgraders new file mode 100644 index 0000000000..cbcc9f90c6 --- /dev/null +++ b/examples/react-starter/.meteor/.finished-upgraders @@ -0,0 +1,11 @@ +# This file contains information which helps Meteor properly upgrade your +# app when you run 'meteor update'. You should check it into version control +# with your project. + +notices-for-0.9.0 +notices-for-0.9.1 +0.9.4-platform-file +notices-for-facebook-graph-api-2 +1.2.0-standard-minifiers-package +1.2.0-meteor-platform-split +1.2.0-cordova-changes diff --git a/examples/react-starter/.meteor/.gitignore b/examples/react-starter/.meteor/.gitignore new file mode 100644 index 0000000000..4083037423 --- /dev/null +++ b/examples/react-starter/.meteor/.gitignore @@ -0,0 +1 @@ +local diff --git a/examples/react-starter/.meteor/packages b/examples/react-starter/.meteor/packages new file mode 100644 index 0000000000..a7096bcd4f --- /dev/null +++ b/examples/react-starter/.meteor/packages @@ -0,0 +1,22 @@ +# Meteor packages used by this project, one per line. +# Check this file (and the other files in this directory) into your repository. +# +# 'meteor add' and 'meteor remove' will edit this file for you, +# but you can also edit it by hand. + +meteor-base # Packages every Meteor app needs to have +mobile-experience # Packages for a great mobile UX +mongo # The database Meteor supports right now +session # Client-side reactive dictionary for your app +jquery # Helpful client-side library +tracker # Meteor's client-side reactive programming library + +standard-minifiers # JS/CSS minifiers run for production mode +es5-shim # ECMAScript 5 compatibility for older browsers. +ecmascript # Enable ECMAScript2015+ syntax in app code + +autopublish # Publish all data to the clients (for prototyping) +insecure # Allow all DB writes from clients (for prototyping) + +static-html # Render static HTML content +react # Everything you need to use React with Meteor diff --git a/examples/react-starter/.meteor/platforms b/examples/react-starter/.meteor/platforms new file mode 100644 index 0000000000..efeba1b50c --- /dev/null +++ b/examples/react-starter/.meteor/platforms @@ -0,0 +1,2 @@ +server +browser diff --git a/examples/react-starter/.meteor/release b/examples/react-starter/.meteor/release new file mode 100644 index 0000000000..69acc9f344 --- /dev/null +++ b/examples/react-starter/.meteor/release @@ -0,0 +1 @@ +METEOR@1.2-rc.15 diff --git a/examples/react-starter/.meteor/versions b/examples/react-starter/.meteor/versions new file mode 100644 index 0000000000..1f51e9a214 --- /dev/null +++ b/examples/react-starter/.meteor/versions @@ -0,0 +1,73 @@ +autopublish@1.0.4-rc.0 +autoupdate@1.2.3-rc.1 +babel-compiler@5.8.22-rc.1 +babel-runtime@0.1.4-rc.0 +base64@1.0.4-rc.0 +binary-heap@1.0.4-rc.0 +blaze@2.1.3-rc.0 +blaze-tools@1.0.4-rc.0 +boilerplate-generator@1.0.4-rc.1 +caching-compiler@1.0.0-rc.0 +caching-html-compiler@1.0.1-rc.0 +callback-hook@1.0.4-rc.0 +check@1.0.6-rc.0 +coffeescript@1.0.8-rc.4 +cosmos:browserify@0.4.0 +ddp@1.2.1-rc.0 +ddp-client@1.2.1-rc.2 +ddp-common@1.2.1-rc.0 +ddp-server@1.2.1-rc.2 +deps@1.0.8-rc.0 +diff-sequence@1.0.1-rc.0 +ecmascript@0.1.3-rc.3 +ecmascript-collections@0.1.5-rc.1 +ejson@1.0.7-rc.0 +es5-shim@0.1.0-rc.0 +fastclick@1.0.7-rc.0 +geojson-utils@1.0.4-rc.0 +hot-code-push@1.0.0-rc.0 +html-tools@1.0.5-rc.0 +htmljs@1.0.5-rc.1 +http@1.1.1-rc.1 +id-map@1.0.4-rc.0 +insecure@1.0.4-rc.0 +jquery@1.11.4-rc.0 +jsx@0.2.1 +launch-screen@1.0.3-rc.1 +livedata@1.0.14-rc.0 +logging@1.0.8-rc.1 +meteor@1.1.7-rc.2 +meteor-base@1.0.1-rc.0 +minifiers@1.1.6-rc.1 +minimongo@1.0.9-rc.0 +mobile-experience@1.0.1-rc.0 +mobile-status-bar@1.0.5-rc.1 +mongo@1.1.1-rc.4 +mongo-id@1.0.1-rc.0 +npm-mongo@1.4.39-rc.0_1 +observe-sequence@1.0.7-rc.0 +ordered-dict@1.0.4-rc.0 +promise@0.4.8-rc.0 +random@1.0.4-rc.0 +react@0.1.12 +react-meteor-data@0.1.8 +react-runtime@0.13.3_6 +react-runtime-dev@0.13.3_5 +react-runtime-prod@0.13.3_4 +reactive-dict@1.1.1-rc.0 +reactive-var@1.0.6-rc.0 +reload@1.1.4-rc.0 +retry@1.0.4-rc.0 +routepolicy@1.0.6-rc.0 +session@1.1.1-rc.0 +spacebars@1.0.7-rc.0 +spacebars-compiler@1.0.7-rc.0 +standard-minifiers@1.0.0-rc.2 +static-html@1.0.0-rc.5 +templating-tools@1.0.0-rc.0 +tracker@1.0.8-rc.0 +ui@1.0.7-rc.0 +underscore@1.0.4-rc.0 +url@1.0.5-rc.0 +webapp@1.2.2-rc.3 +webapp-hashing@1.0.4-rc.0 diff --git a/examples/react-starter/index.html b/examples/react-starter/index.html new file mode 100644 index 0000000000..ee14011d45 --- /dev/null +++ b/examples/react-starter/index.html @@ -0,0 +1,11 @@ + + react-skel + + + +

Welcome to Meteor and React!

+ +

Try the tutorial!

+ +
+ diff --git a/examples/react-starter/index.jsx b/examples/react-starter/index.jsx new file mode 100644 index 0000000000..72b1dfc6f9 --- /dev/null +++ b/examples/react-starter/index.jsx @@ -0,0 +1,65 @@ +// A collection that is synchronized across client and server with the +// 'autopublish' package. To control where the data is accessible from, remove +// 'autopublish' and use Meteor.publish and Meteor.subscribe +Items = new Mongo.Collection("items"); + +// A React component, defined in the normal way +App = React.createClass({ + mixins: [ReactMeteorData], + + // Load data from collections inside this special method enabled by the + // ReactMeteorData mixin. The results are attached to this.data on the + // component + getMeteorData() { + return { + items: Items.find().fetch() + }; + }, + + addItem() { + const nextIndex = Items.find().count() + 1; + + // We can insert from the client because we have the 'insecure' package + // installed. Remove it and use Meteor methods for better security + Items.insert({ + text: "Hello world! " + nextIndex + }); + }, + + renderItems() { + return this.data.items.map((item) => { + return ( +
  • + {item.text} +
    • + ); + }); + }, + + render() { + return ( +
    + + + +
    + ) + } +}); + +if (Meteor.isClient) { + // Code here runs on the client only + + Meteor.startup(() => { + // Make sure to render after startup so the DOM is ready + React.render(, document.getElementById("react-container")); + }); +} + +if (Meteor.isServer) { + // Code inside here will run on the server only +} diff --git a/examples/react-starter/style.css b/examples/react-starter/style.css new file mode 100644 index 0000000000..b6b4052b43 --- /dev/null +++ b/examples/react-starter/style.css @@ -0,0 +1 @@ +/* CSS declarations go here */