cmosguy/react-redux-auth0

Using kriasoft/react-starter-kit/tree/feature/redux/ with Auth0 example

React Starter Kit — "isomorphic" web app boilerplate

React Starter Kit is an opinionated boilerplate for web development built on top of Node.js, Express, GraphQL and React. Containing modern web development tools such as Webpack, Babel and Browsersync. Helping you to stay productive following the best practices. A solid starting point for both professionals and newcomers to the industry.

See getting started  |  demo  |  docs  |  to-do list  |  join #react-starter-kit chat room to stay up to date  |  visit our sponsors:

  

Getting Started

• Follow the getting started guide to download and run the project
• Check the code recipes used in this boilerplate, or share yours

Customization

The master branch of React Starter Kit doesn't include a Flux implementation or any other advanced integrations. Nevertheless, we have some integrations available to you in feature branches that you can use either as a reference or merge into your project:

• feature/redux — isomorphic Redux by Pavel Lang (see how to integrate Redux)
• feature/react-intl — isomorphic Redux and React Intl by Pavel Lang (see how to integrate React Intl)

If you think that any of these features should be on master, or vice versa, some features should removed from the master branch, please let us know. We love your feedback!

Backers

♥ React Starter Kit? Help us keep it alive by donating funds to cover project expenses via OpenCollective or PayPal!

Learn More

• Getting Started with React.js
• Getting Started with GraphQL and Relay
• React.js Questions on StackOverflow
• React.js Discussion Board
• Flux Architecture for Building User Interfaces
• Enzyme — JavaScript Testing utilities for React
• Flow — A static type checker for JavaScript
• The Future of React
• Learn ES6, ES6 Features

Related Projects

• Membership Database — SQL schema boilerplate for user accounts, profiles, roles, and auth claims
• React Static Boilerplate — Generates static websites from React components
• Babel Starter Kit — Boilerplate for authoring JavaScript/React.js libraries

Support

• #react-starter-kit on Stack Overflow — Questions and answers
• #react-starter-kit on Gitter — Watch announcements, share ideas and feedback
• GitHub issues, or Scrum board — File issues, send feature requests
• appear.in/react — Open hours! Exchange ideas and experiences (React, GraphQL, Startups, etc.)
• @koistya on Codementor, or Skype — Private consulting

License

Copyright © 2014-2016 Kriasoft, LLC. This source code is licensed under the MIT license found in the LICENSE.txt file. The documentation to the project is licensed under the CC BY-SA 4.0 license.

---

Made with ♥ by Konstantin Tarkus (@koistya) and contributors

react-redux-auth0's Issues

Understanding and planning node.js and PHP servers

@langpavel, I just realized that I need to understand how to dispatch all the setLocal, setMe functions from the client.

There are two options for the serverr setup:

1. OPTION #1 - using Node.js to server the index.html, and it somehow injects the store into the client. I do not understand how this works, can you please explain to me in our next session? Please prepare an explanation so this goes smoothly. In addition, my API server is PHP serving the API through json web tokens.
2. OPTION #2 - this uses the PHP as the backend server for index.html and the JWT API PHP.

I was planning on doing OPTION 2, but the code relies on server.js.

Here is a snippet from the code:

 const store = configureStore({}, {
      cookie: req.headers.cookie,
    });

    store.dispatch(setRuntimeVariable({
      name: 'initialNow',
      value: Date.now(),
    }));

    store.dispatch(setRuntimeVariable({
      name: 'availableLocales',
      value: locales,
    }));

    await store.dispatch(setLocale({
      locale,
    }));

I also want to do a store.dispatch(setMe{}) to fetch my PHP servers API to get the "me" info. This is an example API from the server. I will use this to help me learn how to fetch other requests and objects from the server as well.

Is it possible to move the stuff from server.js so I can inject the store from my PHP server for OPTION #2?

Error loading Me component

@langpavel I am having an issue resolving my me component. I made some updates to the code, so here is what you need to know:

1. I added the "extend" npm package, so that I can merge the config.server.js and config.client.js files so that I can have my API keys not chekced into the config files. I will send you these files in a separate email.
2. In the server.js I am validating the token, if it is expired then it will not load the /api/me endpoint to my API server.
3. If there is a valid token, then I have setup the disptach('setMe') https://github.com/cmosguy/react-redux-auth0/blob/trying-auth0/src/server.js#L156

I used the setIntl to help me figure out how to architect and setup the me objects. But I am stuck on getting an error if you look in the browser that me is null. I don't understand how to organize and setup me if there is not initial valid token. How do I go about doing this correctly?

I also uncommented the <Me> component from navigation.js but I still have not figured out how to resolve the me.js action to work properly in the initial state situation.

Thanks!