Prettier and Apollo GraphQL for VS Code

If you're using Visual Studio Code, I want to draw your attention to two extensions that can help a lot:

• Prettier VS Code Extension: code auto-formatter
• Apollo GraphQL VS Code Extension: provides intellisense for us since we're using a GraphQL server

After you install Prettier, create a file called .prettierrc at the root of the habit-tracker folder and give it an empty configuration object. You're welcome to customize your configuration, I just find it much easier to leave it at the defaults. You'll also want to head to the Command Palette (cmd+shift+P on a Mac, ctrl+shift+P on Windows) to turn on "Format on Save."

With the Apollo GraphQL extension, you'll need to create a file called apollo.config.js at the root of the habit-tracker folder and add this configuration:

module.exports = {
  client: {
    service: {
      name: "habit-tracker-server",
      url: "http://localhost:4000",
    },
  },
};

This will get us intellisense for the server schema as we write our queries and mutations throughout the course.

In the next video, we'll set up Apollo Client with React.