Giter VIP home page Giter VIP logo

relay-authentication's Introduction

An example app demonstrating role based authentication and file upload with Relay and GraphQL.

Overview

Users may have a role of type reader, publisher or admin. Readers can access a list of all posts and their own profile. Publishers can additionally create posts and see a list of their own posts. Admin role is not used widely yet.

Authentication

Uses cookie-session and jsonwebtoken to save session data in form of a JSON Web Token in a cookie. This data contains the users id and its role and is made available as rootValue in GraphQL schema.

Server

  • /server/graphQlServer.js contains the express middleware used to get session data from the cookie.
  • /graphql/mutation/LoginMutation.js contains the GraphQL mutation type for logging in.
  • /graphql/type/UserType.js includes an example on how to use rootValue for retrieving restricted data in its posts field.

Client

  • /client/mutation/LoginMutation.js contains the client side login mutation.
  • /client/pages/user/login/login.js utilizes this mutation.
  • /client/pages/user/posts/UserPosts.js displays restricted user data.

File Upload

Client

  • /client/mutation/CreatePostMutation.js uses getFiles() to pass file data to the GraphQL server.
  • /client/pages/user/createPost/CreatePost.js uses this mutation by passing it a File object retrieved from a HTML input element

Server

  • /server/graphQlServer.js contains a wrapper around multer middleware, which saves the image to disk and passes its file name to GraphQL. See this comment for more information.

Getting Started

$ npm install

Start the local dev server:

$ npm start

Navigate to http://localhost:3000/ to view the app. Login with email [email protected], [email protected] or [email protected] and password qwerty.

Commands

test

$ npm test:server

update-schema

$ npm update-schema

Credits and Further Information

Based on Essential React starter kit

Authentication

File Upload

relay-authentication's People

Contributors

jkettmann avatar sri-mabelsoftware avatar

Watchers

 avatar  avatar

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.