@nylas/nylas-vue

Nylas Vue SDK

⚠️ Warning: This repo is still in the early development stages and stability is not fully guaranteed yet

This is the GitHub repository for the Nylas React SDK. The Nylas Communications Platform provides REST APIs for Email, Calendar, and Contacts, and the Node SDK is the quickest way to build your integration using React.

Here are some resources to help you get started:

• Quickstart
• Nylas API Reference

⚙️ Install

To install the Nylas React SDK, you will first need to have npm installed on your machine.

Then, head to the nearest command line and run the following:

npm install @nylas/nylas-vue

To install this package from source, clone this repo and run npm install from inside the project directory:

git clone https://github.com/nylas/nylas-vue.git
cd nylas-vue
npm install

⚡️ Usage

The Nylas Vue SDK provides an easy way to implement authentication in your Vue application.

Configuring the plugin

Add and enable the plugin into your Vue application by using Vue's use().

import { Nylas } from '@nylas/nylas-vue';

const app = createApp(App);

app.use(Nylas, {
  serverBaseUrl: "http://url-of-backend-server:port"
});

Build, and redirect to, authentication page

In order for your Nylas application to gain access to a provider, you must first prompt the user for authentication. With the Vue SDK you are able to do this very quickly. After configuring your plugin, the plugin exposes all of the functions provided by the SDK. To build and redirect the page to the provider authentication page you can use the authWithRedirect function.

<script>
export default {
  name: 'App',
  methods: {
    beginAuthenticationProcess() {
      this.authWithRedirect({
        emailAddress: this.email,
        successRedirectUrl: '',
      });
    }
  }
}
</script>

Getting an access token

Once the user has authenticated with your application through their provider, they will be issued an authentication code. The purpose of this code is used to exchange it for an access token, allowing you to fetch collections like messages, events, and calendars for the specific user account. To perform this exchange you can use the exchangeCodeForToken function exposed by the SDK. To simplify matters even more, if the authentication flow is left unaltered, you can use the SDK to parse the code from the URL and using that to exchange it for the access token.

<script>
export default {
  name: 'App',
  methods: {
    exchangeCodeForAccessToken() {
      this.exchangeCodeFromUrlForToken()
        .then(response => {
          // Process Response
        });
    }
  }
}
</script>

💙 Contributing

Interested in contributing to the Nylas Vue SDK project? Thanks so much for your interest! We are always looking for improvements to the project and contributions from open-source developers are greatly appreciated.

Please refer to Contributing for information about how to make contributions to this project. We welcome questions, bug reports, and pull requests.

📝License

This project is licensed under the terms of the MIT license. Please refer to LICENSE for the full terms.