Example of a Basic CRUD App with Vue.js and Node
Clone or download
Pull request Compare This branch is 9 commits ahead of bparise:master.
mraible Merge pull request #2 from oktadeveloper/update-for-okta-vue-1.0
Update Vue + Node CRUD post for Okta Vue 1.0.0
Latest commit 89e6649 Apr 17, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build first commit Jan 10, 2018
config first commit Jan 10, 2018
src Sync with master Apr 16, 2018
static first commit Jan 10, 2018
test first commit Jan 10, 2018
.babelrc first commit Jan 10, 2018
.editorconfig first commit Jan 10, 2018
.eslintignore first commit Jan 10, 2018
.eslintrc.js first commit Jan 10, 2018
.gitignore ignoring local sqlite db files Jan 18, 2018
.postcssrc.js first commit Jan 10, 2018
README.md Git > HTTPS Apr 16, 2018
index.html first commit Jan 10, 2018
package-lock.json Update Vue + Node CRUD post for Okta Vue 1.0.0 Apr 16, 2018
package.json Update Vue + Node CRUD post for Okta Vue 1.0.0 Apr 16, 2018
yarn.lock Update dependencies after re-doing tutorial Mar 12, 2018

README.md

Basic CRUD with Vue.js and Node

This example app shows how to create a Node.js API and display its data with a Vue.js UI.

Please read Build a Basic CRUD App with Vue.js and Node to see how this app was created.

Prerequisites: Node.js.

Okta has Authentication and User Management APIs that reduce development time with instant-on, scalable user infrastructure. Okta's intuitive API and expert support make it easy for developers to authenticate, manage, and secure users and roles in any application.

Getting Started

To install this example application, run the following commands:

git clone https://github.com/oktadeveloper/okta-vue-node-example.git
cd okta-vue-node-example
npm install

This will get a copy of the project installed locally. To start each app, follow the instructions below.

To run the server:

node ./src/server

To run the client:

npm run dev

Create an Application in Okta

You will need to create an OpenID Connect Application in Okta to get your values to perform authentication.

Log in to your Okta Developer account (or sign up if you don’t have an account) and navigate to Applications > Add Application. Click Single-Page App, click Next, and give the app a name you’ll remember, and click Done.

Server Configuration

Set the issuer and copy the clientId into src/server.js.

const oktaJwtVerifier = new OktaJwtVerifier({
  clientId: '{yourClientId}',
  issuer: 'https://{yourOktaDomain}.com/oauth2/default'
})

NOTE: The value of {yourOktaDomain} should be something like dev-123456.oktapreview. Make sure you don't include -admin in the value!

Client Configuration

Set the issuer and copy the clientId into src/router/index.js.

Vue.use(Auth, {
  issuer: 'https://{yourOktaDomain}.com/oauth2/default',
  client_id: '{yourClientId}',
  redirect_uri: 'http://localhost:8080/implicit/callback',
  scope: 'openid profile email'
})

Links

This example uses the following libraries provided by Okta:

Help

Please post any questions as comments on the blog post, or visit our Okta Developer Forums. You can also email developers@okta.com if you would like to create a support ticket.

License

Apache 2.0, see LICENSE.