Repository: AdamBrodzinski/meteor-react-boilerplate
Branch: master
Commit: 4a5637f01816
Files: 25
Total size: 10.7 KB

Directory structure:
gitextract_hmlwha2q/

├── .gitignore
├── .meteor/
│   ├── .finished-upgraders
│   ├── .gitignore
│   ├── .id
│   ├── packages
│   ├── platforms
│   ├── release
│   └── versions
├── README.md
├── client/
│   ├── main.css
│   ├── main.html
│   └── main.js
├── imports/
│   ├── api/
│   │   ├── User.js
│   │   └── api.js
│   ├── startup/
│   │   ├── client/
│   │   │   ├── app.jsx
│   │   │   └── main.js
│   │   └── server/
│   │       └── main.js
│   └── ui/
│       ├── components/
│       │   ├── Header.jsx
│       │   └── LoginButtons.jsx
│       ├── containers/
│       │   └── MainLayout.jsx
│       └── pages/
│           ├── About.jsx
│           ├── Home.jsx
│           └── NotFound.jsx
├── package.json
└── server/
    └── main.js

================================================
FILE CONTENTS
================================================

================================================
FILE: .gitignore
================================================
node_modules

================================================
FILE: .meteor/.finished-upgraders
================================================
# 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
1.2.0-breaking-changes
1.3.0-split-minifiers-package
1.4.0-remove-old-dev-bundle-link


================================================
FILE: .meteor/.gitignore
================================================
local


================================================
FILE: .meteor/.id
================================================
# This file contains a token that is unique to your project.
# Check it into your repository along with the rest of this directory.
# It can be used for purposes such as:
#   - ensuring you don't accidentally deploy one app on top of another
#   - providing package authors with aggregated statistics

a432rb1h16ihv1n6jv39


================================================
FILE: .meteor/packages
================================================
# 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
blaze-html-templates    # Compile .html files into Meteor Blaze views
reactive-var            # Reactive variable for tracker
jquery                  # Helpful client-side library
tracker                 # Meteor's client-side reactive programming library

standard-minifier-css   # CSS minifier run for production mode
standard-minifier-js    # JS minifier 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)

session
logging
reload
random
ejson
spacebars
check
accounts-ui
accounts-password
gadicc:blaze-react-component


================================================
FILE: .meteor/platforms
================================================
server
browser


================================================
FILE: .meteor/release
================================================
METEOR@1.4.0.1


================================================
FILE: .meteor/versions
================================================
accounts-base@1.2.10
accounts-password@1.2.14
accounts-ui@1.1.9
accounts-ui-unstyled@1.1.12
allow-deny@1.0.5
autopublish@1.0.7
autoupdate@1.2.11
babel-compiler@6.9.0
babel-runtime@0.1.10
base64@1.0.9
binary-heap@1.0.9
blaze@2.1.8
blaze-html-templates@1.0.4
blaze-tools@1.0.9
boilerplate-generator@1.0.9
caching-compiler@1.0.6
caching-html-compiler@1.0.6
callback-hook@1.0.9
check@1.2.3
ddp@1.2.5
ddp-client@1.2.9
ddp-common@1.2.6
ddp-rate-limiter@1.0.5
ddp-server@1.2.10
deps@1.0.12
diff-sequence@1.0.6
ecmascript@0.5.7
ecmascript-runtime@0.3.13
ejson@1.0.12
email@1.1.16
es5-shim@4.6.13
fastclick@1.0.12
gadicc:blaze-react-component@1.2.0
geojson-utils@1.0.9
hot-code-push@1.0.4
html-tools@1.0.10
htmljs@1.0.10
http@1.1.8
id-map@1.0.8
insecure@1.0.7
jquery@1.11.9
launch-screen@1.0.12
less@2.6.5
livedata@1.0.18
localstorage@1.0.11
logging@1.1.14
meteor@1.2.16
meteor-base@1.0.4
minifier-css@1.2.13
minifier-js@1.2.13
minimongo@1.0.17
mobile-experience@1.0.4
mobile-status-bar@1.0.12
modules@0.7.5
modules-runtime@0.7.5
mongo@1.1.10
mongo-id@1.0.5
npm-bcrypt@0.8.7_1
npm-mongo@1.5.45
observe-sequence@1.0.12
ordered-dict@1.0.8
promise@0.8.3
random@1.0.10
rate-limit@1.0.5
reactive-dict@1.1.8
reactive-var@1.0.10
reload@1.1.10
retry@1.0.8
routepolicy@1.0.11
service-configuration@1.0.10
session@1.1.6
sha@1.0.8
spacebars@1.0.12
spacebars-compiler@1.0.12
srp@1.0.9
standard-minifier-css@1.1.8
standard-minifier-js@1.1.8
templating@1.1.14
templating-tools@1.0.4
tracker@1.1.0
ui@1.0.11
underscore@1.0.9
url@1.0.10
webapp@1.3.10
webapp-hashing@1.0.9


================================================
FILE: README.md
================================================
# meteor-react-boilerplate
A starter project for React & Meteor

This repo aims to get you up and running with with React with little effort. It has sane defaults that
most apps will use (router, accounts).

Most of the content is in the 'imports' folder so that we can so serverside rendering more easily. Here's the
rundown on what's included.

For an in-depth example of how to use Meteor with React see
[React-ive Meteor](https://github.com/AdamBrodzinski/react-ive-meteor). For flux support see the [Flux Leaderboard](https://github.com/AdamBrodzinski/meteor-flux-leaderboard) example app.

#### APIs & Packages
- [Session](https://docs.meteor.com/api/session.html)
- [Logging](https://atmospherejs.com/meteor/logging)
- [Reload](https://atmospherejs.com/meteor/reload)
- [Random](https://docs.meteor.com/packages/random.html)
- [EJSON](https://docs.meteor.com/api/ejson.html)
- [Spacebars](https://docs.meteor.com/packages/spacebars.html)
- [Check](https://docs.meteor.com/api/check.html)
- [Accounts Password](http://docs.meteor.com/api/passwords.html)
- [Accounts UI](https://docs.meteor.com/packages/accounts-ui.html) (with React wrapper)
- [gadicc:blaze-react-component](https://github.com/gadicc/meteor-blaze-react-component/)

#### NPM
- React
- React DOM
- [React Router](https://github.com/reactjs/react-router)
- [Classnames](https://github.com/JedWatson/classnames)
- [History](https://github.com/ReactTraining/history)

#### Components
- Header
- LoginButtons

#### Models
- User
- (See a more [complex example](https://github.com/AdamBrodzinski/react-ive-meteor/blob/master/both/models/post.js))

#### Pages/Routes
- Home, About
- Not Found
- Main Layout


================================================
FILE: client/main.css
================================================
/* CSS declarations go here */
Header a.active {
  font-weight: bold;
  text-decoration: underline;
}
Header a, #login-buttons a {
  text-decoration: none;
  margin-right: 10px;
  color:inherit;
}


================================================
FILE: client/main.html
================================================
<head>
		<meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Meteor React Boilerplate</title>
</head>

<body>
		<div id="app"></div>
</body>


================================================
FILE: client/main.js
================================================
import '../imports/startup/client/main.js';


================================================
FILE: imports/api/User.js
================================================
import { Meteor } from 'meteor/meteor';
import { Accounts } from 'meteor/accounts-base';

export const User = {
  get: function() {
    return Meteor.user() || {};
  },

  id: function() {
    return Meteor.userId();
  },

  isLoggedIn: function() {
    return !! Meteor.userId();
  },

  isLoggedOut: function() {
    return ! User.isLoggedIn();
  },

  profile: function() {
    return User.get().profile;
  },

  create: function(opts, callback) {
    Accounts.createUser(opts, callback);
  }
};



================================================
FILE: imports/api/api.js
================================================
import './User.js';


================================================
FILE: imports/startup/client/app.jsx
================================================
import { Meteor } from 'meteor/meteor';

import React from 'react';
import ReactDOM from 'react-dom';

import MainLayout from '../../ui/containers/MainLayout.jsx';

Meteor.startup(() => {
  ReactDOM.render(
    <MainLayout />,
    document.getElementById('app')
  );
});


================================================
FILE: imports/startup/client/main.js
================================================
import './app.jsx';


================================================
FILE: imports/startup/server/main.js
================================================
console.log("Starting server...");

import '../../api/api.js';


================================================
FILE: imports/ui/components/Header.jsx
================================================
import React from 'react';
import { NavLink } from 'react-router-dom';

import LoginButtons from './LoginButtons.jsx';

export default class Header extends React.Component {
  render() {
    return (
      <header className='Header'>
        <b>Header</b> &nbsp;
        <NavLink activeClassName="active" exact to="/">Home</NavLink>
        <NavLink activeClassName="active" to="/about">About Page</NavLink>
        <NavLink to="/bad-url">Not Found Page</NavLink>
        <LoginButtons align='left' />
      </header>
    );
  }
}


================================================
FILE: imports/ui/components/LoginButtons.jsx
================================================
import React from 'react';
import Blaze from 'meteor/gadicc:blaze-react-component';

export default class LoginButtons extends React.Component {
  shouldComponentUpdate() {
    return false;
  }

  render() {
    return <Blaze template="loginButtons" align={this.props.align} />
  }
}

LoginButtons.propTypes = {
  align: React.PropTypes.string,
}

LoginButtons.defaultProps = {
  align: 'right',
}


================================================
FILE: imports/ui/containers/MainLayout.jsx
================================================
import React from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'

import Header from '../components/Header.jsx';
import Home from '../pages/Home.jsx';
import About from '../pages/About.jsx';
import NotFound from '../pages/NotFound.jsx';

export default class MainLayout extends React.Component {
  render() {
    return (
      <Router>
        <div>
          <Header />
            <Switch>
              <Route exact path='/' component={Home} />
              <Route path = '/about' component={About} />
              <Route component={NotFound} />
            </Switch>
        </div>
      </Router>
    );
  }
}


================================================
FILE: imports/ui/pages/About.jsx
================================================
import React from 'react';

function About() {
  return (
    <div className='About'>
      <h1>About</h1>
    </div>
  );
}

export default About;


================================================
FILE: imports/ui/pages/Home.jsx
================================================
import React from 'react';
import classNames from 'classnames';

function Home() {
  return (
    <div className={classNames('Home', 'foo', 'bar')} >
      <h1>Welcome to Meteor!</h1>

      <p>
        See <a href="https://github.com/meteor/react-packages/blob/master/docs/client-npm.md">
        this guide</a> to learn how to import NPM modules/components via browserify in Meteor.
      </p>

      <p>
        For an in-depth example of how to use Meteor with React see <a href="https://github.com/AdamBrodzinski/react-ive-meteor">Reactive Meteor</a>. For flux support see the <a href="https://github.com/AdamBrodzinski/meteor-flux-leaderboard">Flux Leaderboard</a> example app.
      </p>

      <h4>Packages</h4>

      <ul>
        <li>React (MDG preview)</li>
        <li>Flow Router</li>
        <li>React Layout</li>
        <li>Accounts Password</li>
        <li>Accounts UI (with React wrapper)</li>
        <li>meteorhacks:npm</li>
        <li>cosmos:browserify</li>
        <li><b>Removes insecure</b></li>
        <li><b>Removes autopublish</b></li>
      </ul>

      <h4>Components</h4>
      <ul>
        <li>Header</li>
        <li>LoginButtons</li>
        <li>
          <a href="https://github.com/JedWatson/classnames">Classnames (NPM Component)</a>
        </li>
      </ul>

      <h4>Models</h4>
      <ul>
        <li>User</li>
        <li>See more a complex <a href="https://github.com/AdamBrodzinski/react-ive-meteor/blob/master/both/models/post.js">example</a></li>
      </ul>

      <h4>Pages/Routes</h4>
      <ul>
        <li>Home, About</li>
        <li>Not Found</li>
        <li>Main Layout</li>
      </ul>
    </div>
  );
}

export default Home;


================================================
FILE: imports/ui/pages/NotFound.jsx
================================================
import React from 'react';

function NotFound() {
  return (
    <div className='NotFound'>
      <h1>This page can not be found</h1>
    </div>
  );
}

export default NotFound;


================================================
FILE: package.json
================================================
{
  "name": "meteor-react-boilerplate",
  "version": "1.0.1",
  "description": "Meteor React Boilerplate",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/AdamBrodzinski/meteor-react-boilerplate"
  },
  "author": "Ryen Beatty <ryen.beatty@gmail.com> (http://ryenbeatty.co)",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/AdamBrodzinski/meteor-react-boilerplate/issues"
  },
  "homepage": "https://github.com/AdamBrodzinski/meteor-react-boilerplate",
  "dependencies": {
    "classnames": "^2.2.5",
    "history": "^3.0.0",
    "react": "^15.3.0",
    "react-dom": "^15.3.0",
    "react-router-dom": "^4.0.0-beta.6"
  }
}


================================================
FILE: server/main.js
================================================
import '../imports/startup/server/main.js';