redshelf-data v0.0.0-test

Getting Started with RedShelf Data

Welcome to the RedShelf Data repo! This app performs all of the necessary bootstrapping to get the Apollo Client ready for consumption by consumer apps.

The primary use of this app is building mocks for new endpoints or updating mocks to match the new graphQL files.

In Production Builds

The production build consumed by other apps creates an apollo client that configures headers for appropriate CSRF/Auth considerations and enables relay-style pagination for all queries defined in the .graphQL files

In Development

This app creates an Apollo client with the relay-style pagination configured, and also sets up a Mock Service Worker to intercept any requests

It may behoove you to familiarize yourself with the following technologies

Developing In React @ RedShelf — A primer on RedShelf's

React — Our base library, used for reactive components

GraphQL — Our backend interface language. Used in place of REST for most Read/Write capabilities.

Apollo & Apollo Client —

Service Workers

Mock Service Worker

Jest

Webpack for Extra Credit

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.

Before the app is compiled, the prettier formatter will be run to format the entire src directory.

Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.\ You will also see any lint errors in the console.

The development version of the app serves a graphiQL Query/Documentation browser. This interface will link out to localhost:8000 to attempt to serve you queries from a "real" graphQL server.

Underneath the graphiQL query browser, we serve a set of Example components that are connected to the mock service worker. Having both environments running within the same page allows the developer to write queries/components in the example directory and test that those queries behave the same against both the Mock Service Worker and the acceptance environment server.

npm test

Launches the test runner in the interactive watch mode.\ See the section about running tests for more information.

npm run prettier

Runs prettier code formatter on entire directory

npm run build

Builds the app for production to the build folder.\ It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.\ Your app is ready to be deployed!

See the section about deployment for more information on how the build scripts inherited from CRA work.