GraphiQL is a playground/IDE for graphQL requests. This app uses Rick and Morty API
- Clone this repo:
$ git clone https://github.com/JanaAhurtsova/graphiql-app.git
- Go to downloaded folder:
$ cd graphiql-app
- Checkout to develop branch:
$ git checkout develop
- Go to the GraphQL folder:
$ cd GraphQL
- Install dependencies:
$ npm install
- Start app:
$ npm start
- Unit tests with coverage:
$ npm run coverage
- Welcome page
- User auth
- GraphiQL page
- 404 page
- Errors from the api side (Not found, unhandled rejection, etc) are displayed in a pop-up
- Using Error boundary
- If user is not authorized, the page contains a link to Sign In / Sign Up page
- If user is authorized, the page contains a link to the Main page
- All routes contain sticky header. When it become sticky (if there is a scroll on a page) color are changed
- Sign Out button - signs user out
- Localization (2 languages). Changing the language by clicking on the switch in header
- Footer contains a link to the authors' github, the year the application was created, course logo with link to the course
- Footer is displayed on all pages of the application
- For the authentication are used Firebase with email option
- Client-side validation are implemented (email and password strength - minimum 8 symbols, at least one letter, one digit, one special character)
- Upon successful login, the user are redirected to the GraphiQL page
- If the user is already logged in and tries to reach these routes, they are redirected to the GraphiQL page
- Editor
- Variables section
- Headers section
- Sidebar :
- Documentation section are visible only when app will receive a successfull response with the schema definition from the api
- Saving history
- Hot keys
- Settings (changing font size)
- Response section