This demo is a minimal React Typescript application providing a simple UI that acesses GraphQL API endpoints.
This very light application serves as simple demo of several technologies and best-practices with respect to React and GraphQL development. It is designed to operate alongside the GraphQL server provided by the demo-gql application.
A list of all greetings in the database is diplayed when opening http://localhost:3000/ in the browser.
Why TypeScript? Because, use of types lends itself to using highly-productive development tools and practices; such as, static checking and code refactoring during JavaScript development. Additionally, there is great support for TypeScript in the development community.
Why React? Because there is no better JavaScript library for building the best user interfaces!
All GraphQL queries and mutations are made using the graphql-request GraphQL client.
This project was bootstrapped with Create React App.
In the project directory, you can run:
Installs the necessary modules required to build and run the application.
Generates GraphQL schema by running the the GraphQL Code Generator. The GraphQL server demo-gql must be available at http://localhost:5002/graphql for code generation to purposes.
Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
Launches the test runner in the interactive watch mode.
See the section about running tests for more information.
Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
- Authentication
- Relay and the Connections pattern
Add examples of client-side pagination using Relay.
demo-gql - the GraphQL server counterpart- a minimal Node.js Typescript application providing a GraphQL API
react-portal - a React Redux application that provides simple user management tasks upon successful JWT authentication
greasy-spoon-pos - a React Redux application that provides minimal features of a very basic restaurant Point of Sale system
goodapplemedia.com - a responsive website created with HTML5, Foundation CSS, and ES6 that demonstrates an exceptional and desirable user experience
I'm driven to deliver exemplary User Experiences and sound application architectures. I enjoy solving customer problems with excellent design and engineering- to greatly affect business success.