diff --git a/.gitignore b/.gitignore index 355f2e7..8c5978f 100644 --- a/.gitignore +++ b/.gitignore @@ -27,3 +27,4 @@ graphql.schema.json npm-debug.log* yarn-debug.log* yarn-error.log* +.vscode diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..ec6d3cd --- /dev/null +++ b/.prettierignore @@ -0,0 +1 @@ +package.json diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..6cfe7a5 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,15 @@ +{ + "files.exclude": { + "__error": "Not found", + "dist": true, + "node_modules": true, + "yarn-error.log": true, + "workspace.code-workspace": true, + "yarn.lock": true, + "build": true, + ".vscode": true, + "app\\node_modules": true, + "server\\yarn.lock": true, + "server\\node_modules": true + } +} \ No newline at end of file diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..304779f --- /dev/null +++ b/Makefile @@ -0,0 +1,4 @@ +.PHONY: start-everything-local +start-everything-local: + docker-machine start default + docker-compose up -d -f server/docker-compose-yml \ No newline at end of file diff --git a/README.md b/README.md index 499855b..e69de29 100644 --- a/README.md +++ b/README.md @@ -1,91 +0,0 @@ -# React & Apollo Tutorial - -This is the sample project that belongs to the [React & Apollo Tutorial](https://www.howtographql.com/react-apollo/0-introduction/) on How to GraphQL. - -## How to use - -### 1. Clone repository - -```sh -git clone https://github.com/howtographql/react-apollo/ -``` - -### 2. Install dependencies & Deploy the Prisma database API - -To install the Prisma CLI globally with Yarn, use the following command: -```sh -yarn global add prisma -``` - -Also, run the following commands: -```sh -cd react-apollo/server -yarn install -prisma deploy -``` - -Then, follow these steps in the interactive CLI wizard: - -1. Select **Demo server** -1. **Authenticate** with Prisma Cloud in your browser (if necessary) -1. Back in your terminal, **confirm all suggested values** - -
- Alternative: Run Prisma locally via Docker - -1. Ensure you have Docker installed on your machine. If not, you can get it from [here](https://store.docker.com/search?offering=community&type=edition). -1. Create `docker-compose.yml` for MySQL (see [here](https://www.prisma.io/docs/prisma-server/database-connector-POSTGRES-jgfr/) for Postgres): - ```yml - version: '3' - services: - prisma: - image: prismagraphql/prisma:1.23 - restart: always - ports: - - "4466:4466" - environment: - PRISMA_CONFIG: | - port: 4466 - databases: - default: - connector: mysql - host: mysql - port: 3306 - user: root - password: prisma - migrations: true - mysql: - image: mysql:5.7 - restart: always - environment: - MYSQL_ROOT_PASSWORD: prisma - volumes: - - mysql:/var/lib/mysql - volumes: - mysql: - ``` -1. Run `docker-compose up -d` -1. Run `prisma deploy` - -
- -### 3. Start the server - -To start the server, all you need to do is execute the `start` script by running the following command inside the `server` directory: - -```sh -yarn start -``` - -> **Note**: If you want to interact with the GraphQL API of the server inside a [GraphQL Playground](https://github.com/prisma/graphql-playground), you can navigate to [http://localhost:4000](http://localhost:4000). - -### 4. Run the app - -Now that the server is running, you can start the React app as well. The commands need to be run in a new terminal tab/window inside the root directory `react-apollo` (because the current tab is blocked by the process running the server): - -```sh -yarn install -yarn start -``` - -You can now open your browser and use the app on [http://localhost:3000](http://localhost:3000). diff --git a/dist/.gitkeep b/dist/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/package.json b/package.json index dcce04f..a491873 100644 --- a/package.json +++ b/package.json @@ -3,16 +3,21 @@ "version": "0.1.0", "private": true, "dependencies": { + "@material-ui/core": "^3.9.3", + "@material-ui/icons": "^3.0.2", "apollo-boost": "0.1.4", "apollo-link-context": "1.0.7", "apollo-link-ws": "1.0.7", + "classnames": "^2.2.6", "graphql": "0.13.1", - "react": "16.2.0", + "react": "16.8.4", "react-apollo": "2.1.0", - "react-dom": "16.2.0", - "react-router": "4.2.0", - "react-router-dom": "4.2.2", - "react-scripts": "1.1.1", + "react-dom": "16.8.4", + "react-hanger": "^1.1.4", + "react-router": "^5.0.0", + "react-router-dom": "^5.0.0", + "react-scripts": "2.1.8", + "react-use-form-state": "^0.9.0", "subscriptions-transport-ws": "0.9.7" }, "scripts": { @@ -20,5 +25,11 @@ "build": "react-scripts build", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" - } + }, + "browserslist": [ + ">0.2%", + "not dead", + "not ie <= 11", + "not op_mini all" + ] } diff --git a/public/index.html b/public/index.html index c93ca2d..8a69f26 100644 --- a/public/index.html +++ b/public/index.html @@ -10,7 +10,7 @@ --> - +