Code Monkey home page Code Monkey logo

react-tweets's Introduction

Real Time Twitter Stream with Node and React

Code repository for the tutorial by @kenwheeler: Build A Real-Time Twitter Stream with Node and React.js

Requirements

  • node and npm

How to Use

  1. Clone the repo: git clone [email protected]:scotch-io/react-tweets
  2. Go into folder: cd react-tweets
  3. Install dependencies: npm install
  4. Create local MongoDB database called react-tweets (configured in server.js)
  5. Replace credentials for Twitter API (configured in config.js)
  6. Start the app: node server.js
  7. View in browser at: http://localhost:8080
  8. Tweet away!

react-tweets's People

Contributors

expobrain avatar jacobp100 avatar kenwheeler avatar randymorris avatar reactivepixel avatar sabativi avatar tomwilderspin avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

react-tweets's Issues

Error: Cannot find module 'mongodb/node_modules/bson'

Node sure if this is an NPM issue or app issue. After following steps of cloning, npm installing, and updating Twitter Credentials.. This is the error I get when I type node server.js

module.js:333
throw err;
^
Error: Cannot find module 'mongodb/node_modules/bson'
at Function.Module._resolveFilename (module.js:331:15)
at Function.Module._load (module.js:273:25)
at Module.require (module.js:357:17)
at require (module.js:373:17)
at Object. (/Users/Douglas/code/twitter-streamer/node_modules/mongoose/lib/drivers/node-mongodb-native/objectid.js:8:16)
at Module._compile (module.js:449:26)
at Object.Module._extensions..js (module.js:467:10)
at Module.load (module.js:349:32)
at Function.Module._load (module.js:305:12)
at Module.require (module.js:357:17)

Wrong description?

The title says "Isomorphic JavaScript with ReactJS and AngularJS".... but that seems completely wrong. Is not angular. Copy/pasta? :)

missing react packages?

can't seem to get the app to launch:

npm run watch

> [email protected] watch /Users/dc/dev/rikai/react-tweets
> watchify app.js -o public/js/bundle.js -v

608887 bytes written to public/js/bundle.js (2.26 seconds)

^C

no response on 8080
was looking for the console.log('Express server listening on port ' + port); output but don't get it.

tried vanilla:

➜  react-tweets git:(master) ✗ node app.js 
/Users/dc/dev/rikai/react-tweets/app.js:11
  <TweetsApp tweets={initialState}/>,
  ^
SyntaxError: Unexpected token <
    at exports.runInThisContext (vm.js:73:16)
    at Module._compile (module.js:443:25)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Function.Module.runMain (module.js:501:10)
    at startup (node.js:129:16)
    at node.js:814:3

I can't seem to run the project

I've done all the required steps in the readme.

but when I run node server.js I get the following errors:

react-tweets (master) $ node server.js
Express server listening on port 8080

events.js:74
        throw TypeError('Uncaught, unspecified "error" event.');
              ^
TypeError: Uncaught, unspecified "error" event.
    at TypeError (<anonymous>)
    at EventEmitter.emit (events.js:74:15)
    at ClientRequest.<anonymous> (/Users/lifeiscontent/Workspace/Javascript/react-tweets/node_modules/ntwitter/lib/twitter.js:251:14)
    at ClientRequest.emit (events.js:95:17)
    at HTTPParser.parserOnIncomingClient [as onIncoming] (http.js:1693:21)
    at HTTPParser.parserOnHeadersComplete [as onHeadersComplete] (http.js:122:23)
    at CleartextStream.socketOnData [as ondata] (http.js:1588:20)
    at CleartextStream.read [as _read] (tls.js:514:12)
    at CleartextStream.Readable.read (_stream_readable.js:341:10)
    at EncryptedStream.write [as _write] (tls.js:369:25)
react-tweets (master) $

ntwitter throwing error?

I ran into this issue with my app, and also ran into the same issue when checking out master...

Express server listening on port 8080

events.js:74
        throw TypeError('Uncaught, unspecified "error" event.');
              ^
TypeError: Uncaught, unspecified "error" event.
    at TypeError (<anonymous>)
    at EventEmitter.emit (events.js:74:15)
    at ClientRequest.<anonymous> (/Users/scottszarapka/Desktop/react-tweets-master/node_modules/ntwitter/lib/twitter.js:251:14)
    at ClientRequest.emit (events.js:95:17)
    at HTTPParser.parserOnIncomingClient [as onIncoming] (http.js:1688:21)
    at HTTPParser.parserOnHeadersComplete [as onHeadersComplete] (http.js:121:23)
    at CleartextStream.socketOnData [as ondata] (http.js:1583:20)
    at CleartextStream.read [as _read] (tls.js:513:12)
    at CleartextStream.Readable.read (_stream_readable.js:340:10)
    at EncryptedStream.write [as _write] (tls.js:368:25)

Cannot read property '__reactAutoBindMap'

Everything works fine. But there will not be the notification bar

Uncaught TypeError: Cannot read property '__reactAutoBindMap' of undefinedReactClass.createClass.Constructor @ bundle.js:61321../components/TweetsApp.react @ bundle.js:12s @ bundle.js:1e @ bundle.js:1(anonymous function) @ bundle.js:1

Autorefresh or Event listener?

Hello Scotch-io:

After cloning your repo and loading it up the repo loads tweets but does not automatically refresh the results when new tweets pop up.

Is this because I did not set up my twitter API settings correctly?

I am only running this locally so localhost:8080 and for the url I inserted dummy data for the time being.

So I have to physically refresh the page in order to see new tweets at the moment. But I am assuming that it should be able to auto load tweets no?

how to generate bindle.js

from browser console got error:
Failed to load resource: the server responded with a status of 404 (Not Found)

this file is not in public/js , this should be generated automatically ,but node server.js won't do.
How ? Thanks

Broken deployment on Heroku

It looks like the demo is broken. I've been having similar problems recently as a result of npm packages updating, but that seems to be in relation to using Node 0.12.x. Perhaps that's a useful lead?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.