ffxsam / ffx-meteor-react-boilerplate Goto Github PK
View Code? Open in Web Editor NEWMeteor 1.4 + React boilerplate (DEPRECATED/ABANDONED) ๐
Meteor 1.4 + React boilerplate (DEPRECATED/ABANDONED) ๐
I've just now stumbled across this boilerplate, and it seems to be the most robust source for explaining the meteor/react/redux stack for creating apps.
My question is since the last commit, is there anything that should be noted to those meandering into this space? Any specific catches that haven't been implemented into the repo due to lack of time?
Hi - I'm really finding this boilerplate repo to be a great learning tool. All your detailed comments are super helpful! One detail, however, has me completely stumped.
Previously, when creating a React component, I would do something like this:
MyComponent = React.createClass({
render(){
return <div>
Component content
</div>
}
});
However, in your repo, you are creating a component as follows:
import React from 'react';
export default MyComponent = (props) => {
<div>
Component content
</div>
}
How is this being defined as a React component? It seems as if all that is happening here is that a generic MyComponent
variable or module is being defined. I would expect either Foo = React.createClass
or class Foo extends React.Component
I've tried googling around, but all the examples I've found use either the create or extend syntax.
If you could update your comments or provide an explanation (or just link to a good explanation), it would be most appreciated!
Thanks so much!
First, thanks for this. Of all the 1.3/react/etc boilerplates folks are putting out, Mantra included, this is coming closest to an approach that resonates for me. I also think the notion of annotating the example branch inline is brilliant. Would love to see a more comprehensive version of such an approach!
In the Readme, you mention:
exploring the idea of putting all features into their own respective folders
The boilerplate includes an empty feature skeleton, but the example branch has no features. It looks like your approach evolved after branching the example off. Just curious what your initial thinking is here. Are you borrowing from Mantra's approach to file structure?
Lastly, any particular reason you eschewed the Meteor guide's recommendation of using a root import directory?
Very sad to see the example app doesn't use the new Redux you put into this boilerplate.
:(
Hi, the example branch does NOT work when I do:
$ npm run example
However, the message on the command line says:
"echo "When you're done with the example app, run 'npm run exit' to return to the boilerplate."; git checkout example".
So, it is running somewhere. How do I view it?
Hi,
This is the best guide for Meteor+React+Redux right now on the entire web.
Many thanks to you for this wonderful repo.
There is, however, something I still do not understand:
How should the register/login/logout flows be implemented?
Forgive me if this has been answered or is too obvious.
I tried and failed to find the answers, so I'm asking here.
Thanks again.
Windows Errors - Fixed
Where is pub/sub???
How add subscription, if using react from npm?
seems to be /bin/sh ./.scripts/postinstall.sh wich is linux
npm ERR! [email protected] postinstall: /bin/sh ./.scripts/postinstall.sh
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script.
npm ERR! This is most likely a problem with the ffx-meteor-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! /bin/sh ./.scripts/postinstall.sh
npm ERR! You can get their info via:
npm ERR! npm owner ls ffx-meteor-react-boilerplate
npm ERR! There is likely additional logging output above.
npm ERR! System Windows_NT 10.0.10586
npm ERR! command "C:\Program Files\nodejs\node.exe" "C:\ProgramData\chocolatey\lib\npm\tools\node_modules\npm\bin\npm-cli.js" "install"
npm ERR! cwd E:\dev_meteor_1.3\ffx-meteor-react-boilerplate
npm ERR! node -v v5.4.0
npm ERR! npm -v 1.4.9
npm ERR! code ELIFECYCLE
npm ERR!
npm ERR! Additional logging details can be found in:
npm ERR! E:\dev_meteor_1.3\ffx-meteor-react-boilerplate\npm-debug.log
npm ERR! not ok code 0
regards
Martin
I'm not just talking about the folder structure which isn't being generated (routes, actions), but the generated package.json is outright missing react/redux dependencies. Isn't that necessary for a boilerplate? Working off of the example branch works fine.
After set up your boilerplate
then I run meteor npm install adminlte-reactjs
as describe in this repo
https://github.com/booleanhunter/ReactJS-AdminLTE
features/SomeFeature/components/Thing/Thing.js
import {InfoTile} from 'adminlte-reactjs';
constructor(props) {
super(props);
this.state = {
infotile: {
width: 3,
content: '',
icon: 'fa-envelope-o',
stats: '1410',
subject: 'Messages',
theme: 'bg-aqua',
},
};
}
render() {
return <div style={styles.root}>
<InfoTile
width = {this.state.infotile.width}
content = {this.state.infotile.content}
icon = {this.state.infotile.icon}
stats = {this.state.infotile.stats}
subject = {this.state.infotile.subject}
theme = {this.state.infotile.theme}
/>
<div>
<button
style={styles.button}
onClick={this.showProps}
>
Dump props
</button>
</div>
<div>
<button
style={styles.button}
onClick={this.callMethod}
>
Call Meteor method
</button>
</div>
</div>
}
but the style is not work
How to solve this problem?
Best Regards,
install.js:78 Uncaught Error: Cannot find module 'react-mixin'require @ install.js:78meteorInstall.client.containers.ColorSetterContainer.jsx @ ColorSetterContainer.jsx:4fileEvaluate @ install.js:141require @ install.js:75(anonymous function) @ app.js?hash=1a174f9โฆ:1618
router.js:347 There is no route for the path: /
Hi, Great boilerplate ! I just wanted to suggest using postcss instead of sass. I have been experimenting with it and it seems like a very solid and powerful css transformer.
TY for building this !
Hello
Yesterday I moved my project to Meteor 1.3 (I was already in 1.3 but beta.8 release) and my reload time went very bad (around 1 minute). Before that, it was seconds... I am on windows.
So, I downloaded this and try it again, this time with only 1 component (Home.js)! The time was 57 seconds after change 'Home' to 'Hello'.... Still very bad...
Do you have any idea how can I track this? On your machine how much time takes to refresh the browser after saving a file?
Thanks
Hi ,
I have recently upgrade my project version of meteor from 1.4 to 1.5 there i get react-meteor-data as undefined Please help out this thank you in advance.
I have a branch here... https://github.com/oakworks/ffx-meteor-react-boilerplate/tree/feature-meteor-1.4.0.1
Want a PR for it?
@ffxsam Thanks for all your work on this awesome boilerplate! This finally made things click for me.
Do you plan to update the example app to use createContainer()
or one of the many other options? I'm very interested to see how this works with your boilerplate.
This is awesome, thank you! Could you also make available the version before you added redux?
Hi.so far when i run the meteor start i get a hello world and a plugin that looks a lot like meteortoys.when i try to npm run example i get nothing...npm says the script doesnt exist.i cloned the example branch also..and i see no comments in the code
There is a bug in example branch. When you click on "Save an invalid color" and then click on the color list to change the background you get the error message of invalid color there too.
Windows doesn't have a /bin/sh... I tried to use npm install
in the Git Bash and Babun console, both gave the follow:
npm ERR! Windows_NT 10.0.10586
npm ERR! argv "C:\Program Files\nodejs\node.exe" "C:\Users\macbe_000\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js" "install"
npm ERR! node v4.2.6
npm ERR! npm v3.5.3
npm ERR! code ELIFECYCLE
npm ERR! [email protected] postinstall:/bin/sh ./.scripts/postinstall.sh
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script '/bin/sh ./.scripts/postinstall.sh'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the ffx-meteor-react-boilerplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! /bin/sh ./.scripts/postinstall.sh
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs ffx-meteor-react-boilerplate
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls ffx-meteor-react-boilerplate
npm ERR! There is likely additional logging output above.npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\macbe_000\Documents\GitHub\meteor-avalon\npm-debug.log
It takes up to 7 seconds when I edit my React components to rebuild on a super fast computer. Any ideas how to improve this?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.