Skip to content

Latest commit

 

History

History
168 lines (124 loc) · 7.63 KB

File metadata and controls

168 lines (124 loc) · 7.63 KB

Frequently Asked Questions about Apollo Universal Starter Kit

In this section, you'll find answers on the following frequently asked questions:

How do I update my Apollo Universal Starter Kit project without forking the repository?

Follow the steps below to create an Apollo Starter Kit project and updating the fork:

  1. Initialize a new Git repository
  2. Add the starter kit as a remote upstream repository:
  3. Run the following command:
git merge upstream/stable
  1. When you are in master branch of your project:

https://help.github.com/articles/syncing-a-fork/

Whenever you want to receive updates, first run:

git fetch upstream

Then run when you are in the master branch of your project:

git merge upstream/stable

How do I use a custom GraphQL back end?

To set your custom GraphQL back end endpoint, set BACKEND_API_URL environment variable or change URL in packages/server/build.config.js for the __API_URL__ property:

__API_URL__: process.env.BACKEND_API_URL || 'https://my-custom-domain/graphql', // set the full URL to the external GraphQL API e.g. https://

We recommend that you still run the back-end code provided by the starter kit to use the server-side rendering (SSR). You can also turn off SSR if you don't use the starter kit back end. Set the environmet variable SSR to false or edit root build.config.js:

How do I disable Server Side Rendering?

To disable Server Side Rendering (SSR), change set environment variable SSR to false or edit root build.config.js

More information: Server Side Rendering with Apollo Universal Starter Kit.

How do I use a different database instead of SQLite?

You can almost all relational database management systems that use SQL and are supported by Knex such as PostgreSQL, MySQL, MSSQL, MariaDB, SQLite3, and Oracle.

Apollo Universal Starter Kit is database-agnostic. You can any other databases if they support a JavaScript client provided by Knex. This way you can create a simple connector and export it normally in place of the Knex connector.

Reference: #525

How do I enable Facebook and Google OAuth?

You can enable the social login functionality in the config/auth.js file:

export default {
  // other configurations are omitted
  auth: {
    facebook: {
          enabled: false, // set to true to enable login with Facebook
          clientID: process.env.FACEBOOK_CLIENTID,
          clientSecret: process.env.FACEBOOK_CLIENTSECRET,
          scope: ['email'],
          profileFields: ['id', 'emails', 'displayName']
    },
    github: {
      enabled: false, // set to true to enable login with GitHub
      clientID: process.env.GITHUB_CLIENTID,
      clientSecret: process.env.GITHUB_CLIENTSECRET,
      scope: ['user:email']
    },
    linkedin: {
      enabled: false, // set to true to enable login with LinkedIn
      clientID: process.env.LINKEDIN_CLIENTID,
      clientSecret: process.env.LINKEDIN_CLIENTSECRET,
      scope: ['r_emailaddress', 'r_basicprofile']
    },
    google: {
      enabled: false, // set to true to enable login with Google
      clientID: process.env.GOOGLE_CLIENTID,
      clientSecret: process.env.GOOGLE_CLIENTSECRET,
      scope: ['https://www.googleapis.com/auth/userinfo.email', 'https://www.googleapis.com/auth/userinfo.profile']
    }
  }
};

How do I add support for a custom domain name in the local development environment?

First, modify the host file in the following way:

127.0.0.1 localhost.host

Then, add this setting into /packages/client/.sprinjs file under options section

webpackConfig: {
  devServer: {
    public: 'localhost.host'
  }
}

What extensions can I use when creating files in my project?

Apollo Universal Starter Kit suggests that you use the following extensions when creating your modules:

Platform Directory Possible extensions for application files
server packages/server/ .tsx, .jsx, .ts, .js, .json
web packages/client/ .tsx, .jsx, .ts, .js, .json

When you develop a native mobile app, we also recommend that you follow the naming convention below:

Platform Directory Possible extensions for application files
native packages/mobile/ .native.tsx, .native.jsx, .native.ts, .native.js, .json
android packages/mobile/ .android.tsx, .android.jsx, .android.ts, .android.js, .json
ios packages/mobile/ .ios.tsx, .ios.jsx, .ios.ts, .ios.js, .json

Notice that you should use the .native.tsx and similar extensions for files with the same logic for both Android and iOS platforms. If the logic for these two platforms is different, use .android.tsx (and similar extensions) for Android, and .ios.tsx for iOS.

For example, here's how the files may be called for the Storage module:

  • storage.tsx for the web and server platforms
  • storage.native.tsx for the mobile app for files with the same logic
  • storage.android.tsx for the custom logic for the Android platform
  • storage.ios.tsx for the custom logic for the iOS platform

Apollo Universal Starter Kit uses Webpack to build the code for all the platforms – server, web, Android, and iOS. The starter kit uses the resolve.extensions Webpack property to understand which files should be used for generating a specific platform bundle when there are several files with the same name but different extensions.

How do I always keep my Apollo Starter Kit project up-to-date?

The best way for keeping your Apollo Universal Starter Kit project always up-to-date is to configure a remote repository that points to the upstream of the original repository.

You can consult Configuring a Remote for a Fork documentation on GitHub. Using this feature, you can easily pull in the latest changes made to this kit. For that, consult the Syncing a Fork.

If you intend to make significant changes to existing modules, we suggest you copy and rename the modules, to limit the amount of merge conflicts to a minimum.