Giter Club home page Giter Club logo

apollo-accounts's Introduction

Apollo Accounts Password

Full-stack JS accounts system for Apollo and MongoDB

Compatible with Meteor's accounts-password.

Based on accounts-js.

Documentation

apollo-accounts-password-client

apollo-accounts-password-server

Demos

git clone https://github.com/flyblackbird/apollo-accounts
cd apollo-accounts

Web

cd demo/web
npm install
npm start

localhost:3000

Web app login screen

React Native

cd demo/react-native
npm start

Either scan the QR code with the Expo app or open a simulator (eg hit i for iOS simulator).

Server

MongoDB

If you're using an existing accounts-password Meteor app's database, you can first run meteor start in your Meteor app directory and then add a MONGO_URL to the npm start command in the next section:

MONGO_URL="mongodb://localhost:3001/meteor" npm start

To start with a new database:

brew install docker-compose

If you run into an error, you might need to do:

sudo mkdir /usr/local/Frameworks
sudo chown $(whoami):admin /usr/local/Frameworks

Create a docker machine:

docker-machine create --driver virtualbox default
eval "$(docker-machine env default)"

Start mongo:

cd demo/server
docker-compose up -d

Start server

npm install
npm start

Query server

Open GraphQL Playground at localhost:4000 and try these operations:

mutation {
  register(user: { username: "loren", password: "pass" })
}

mutation {
  authenticate(
    serviceName: "password"
    params: { password: "pass", user: { username: "loren" } }
  ) {
    tokens {
      accessToken
    }
  }
}

query {
  privateField
}

Meteor compatibility

This package is configured to use the same hashing algorithms as Meteor's accounts-password, and both it and Meteor stores user documents in a users MongoDB collection, and the documents are in the same format, including a the services.password.bcrypt field. So you can use the same database to back both a Meteor app and a node app using this package—a user created with one app will be able to login with the same username/email and password in the other app. If you are migrating away from Meteor, then after you've switched over to the node app, you can delete all of the services.resume fields, as this package does not use them. (Instead, it creates a collection called sessions.)

Some of the API methods are named differently (for instance login() instead of loginWithPassword()) or act differently (for instance taking different arguments, or in the case of onCreateUser(), is executed after the user is stored instead of beforehand). Here are the client and server APIs.

There is no Meteor.user() (or Tracker at all)—we recommend making a getUser() query and subsequently reading the user object from the apollo cache for components that need it (for instance using a withUser HOC). The alternative is making the query at the top of the component tree and passing the user down as a prop, but for most apps that results in a ton of prop drilling.

Contributing

Build and link packages:

git clone https://github.com/flyblackbird/apollo-accounts.git
cd apollo-accounts/client
npm run build
npm link
cd ../server
npm run build
npm link

Run server and web client:

cd ../demo/server
npm link apollo-accounts-password-server
npm install
npm start
cd demo/web
npm link apollo-accounts-password-client
npm install
npm start

React Native

RN doesn't like symlinks in node_modules/, so we use wml:

npm i -g wml
cd apollo-accounts
wml add client demo/react-native/node_modules/apollo-accounts-password-client
wml start

In another terminal:

rm -rf demo/react-native/node_modules/apollo-accounts-password-client/node_modules/
cd demo/react-native
npm start

Credits

Thank you to:

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.