{"id":13631095,"url":"https://github.com/tylergaw/jribbble","last_synced_at":"2025-04-06T09:07:01.468Z","repository":{"id":993558,"uuid":"802347","full_name":"tylergaw/jribbble","owner":"tylergaw","description":"A JavaScript library for the Dribbble API","archived":false,"fork":false,"pushed_at":"2018-04-09T16:09:56.000Z","size":248,"stargazers_count":304,"open_issues_count":2,"forks_count":36,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-03-28T23:11:10.604Z","etag":null,"topics":["dribbble","dribbble-api","dribbble-client"],"latest_commit_sha":null,"homepage":"https://jribbble.glitch.me","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tylergaw.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2010-07-28T06:59:19.000Z","updated_at":"2025-03-23T06:37:34.000Z","dependencies_parsed_at":"2022-08-16T11:45:20.032Z","dependency_job_id":null,"html_url":"https://github.com/tylergaw/jribbble","commit_stats":null,"previous_names":[],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tylergaw%2Fjribbble","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tylergaw%2Fjribbble/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tylergaw%2Fjribbble/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tylergaw%2Fjribbble/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tylergaw","download_url":"https://codeload.github.com/tylergaw/jribbble/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247457799,"owners_count":20941906,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dribbble","dribbble-api","dribbble-client"],"created_at":"2024-08-01T22:02:10.331Z","updated_at":"2025-04-06T09:07:01.449Z","avatar_url":"https://github.com/tylergaw.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# Jribbble [![Build Status](https://travis-ci.org/tylergaw/jribbble.svg)](https://travis-ci.org/tylergaw/jribbble)\n\nA JavaScript library for the [Dribbble API](http://developer.dribbble.com/v2/)\n\n## The Oauth Process\n\nTo use Jribbble, you must obtain a valid [Oauth access token](http://developer.dribbble.com/v2/oauth/).\nFor help getting a token and live examples, see the guide at [https://jribbble.glitch.me](https://jribbble.glitch.me)\n\n## Getting Jribbble\n\nJribbble is available on npm or by direct download.\n\n```\nnpm install jribbble\n```\nor direct download:\n- [jribbble.min.js](https://github.com/tylergaw/jribbble/tree/3.0.0/dist/jribbble.min.js)\n- [jribbble.js](https://github.com/tylergaw/jribbble/tree/3.0.0/dist/jribbble.js)\n\n## Using Jribbble\nJribbble works will all `public` scoped methods of the [Dribbble API](https://developer.dribbble.com/v2/).\n\n```html\n\u003cbody\u003e\n  \u003cscript src=\"/path/to/jribbble.min.js\"\u003e\u003c/script\u003e\n  \u003cscript\u003e\n    jribbble.shots({token: \"\u003cyour_oauth_access_token\u003e\"}, function(shotsArray) {\n      console.log(shotsArray); // The JSON from the API Request.\n    });\n  \u003c/script\u003e\n\u003c/body\u003e\n```\n\nRefer to the [Dribbble V2 API Docs](http://developer.dribbble.com/v2/) for details on response objects.\n\n## Setting your access token\nBefore you can use any of Jribbble's methods, you must set your Dribbble app's client access token.\nIf you do not have a token, follow the setup guide on [https://jribbble.glitch.me](https://jribbble.glitch.me)\n\nYou can set the token as an option of any method call as shown in the examples `{token: \"\u003cyour_oauth_access_token\u003e\"}`, or you can set it with `jribbble.setToken`:\n\n#### `jribbble.setToken(token)`\n\n**Description:** Sets the required Dribbble access_token\n\n**Parameters:**\n- token - *required* `String` Your Dribbble access_token from the Oauth handshake process\n\nUsing `setToken` is optional. It’s probably most useful if you’re calling multiple `jribbble` methods on a single page.\n\n**Example usage:**\n```javascript\njribbble.setToken(\"123456789\");\n```\n\n## Available methods\n\n- [jribbble.shots](#shots)\n- [jribbble.user](#user)\n- [jribbble.projects](#projects)\n\n### Methods that will only work with Dribbble-approved apps\n- [jribbble.likes](#likes)\n- [jribbble.popular](#popular)\n\n*Note: You will need to contact Dribbble support to get an approved app, Jribbble can't approve apps.*\n\n### Shots\n\n#### `jribbble.shots(id, options, callback)`\n\n**Description:** Gets your shots or a single shot by id.\n\n**Parameters:**\n- id - *optional* `String` or `Number` A shot id\n- options - *optional* `Object` Key:value pairs. Valid keys include `token`, `page`, and `per_page`\n- callback - `Function` Will receive a single argument. An single shot object if an id\nwas provided, an array of shot objects if no id provided.\n\n**Example usage:**\n```javascript\n// Get a list of your shots and display them in the DOM.\njribbble.shots({token: \"\u003cyour_oauth_access_token\u003e\"}, function(shotsArray) {\n  document.querySelector(\".dribbble-shots\").innerHTML = shotsArray.reduce(function(html, shot) {\n    return html + '\u003cli\u003e\u003ca href=\"'+  shot.html_url + '\" target=\"_blank\"\u003e\u003cimg src=\"' + shot.images.normal + '\"\u003e\u003c/a\u003e\u003c/li\u003e';\n  }, \"\");\n});\n```\n\n```javascript\n// Get a single shot by id and display it as an `img` in the DOM.\njribbble.shots(\"2055068\", {token: \"\u003cyour_oauth_access_token\u003e\"}, function(shotObject) {\n  docment.getElementById(\"shot\").innerHTML = '\u003cimg src=\"' + shot.images.normal + '\"\u003e';\n});\n```\n\n```javascript\n// Get the second page of your shots at 12 per page and display them in the DOM.\njribbble.shots({token: \"\u003cyour_oauth_access_token\u003e\", page: 2, per_page: 12}, function(shotsArray) {\n  document.querySelector(\".dribbble-shots\").innerHTML = shotsArray.reduce(function(html, shot) {\n    return html + '\u003cli\u003e\u003ca href=\"'+  shot.html_url + '\" target=\"_blank\"\u003e\u003cimg src=\"' + shot.images.normal + '\"\u003e\u003c/a\u003e\u003c/li\u003e';\n  }, \"\");\n});\n```\n\nSee the [Dribbble API Docs for Shots](http://developer.dribbble.com/v2/shots/) for the full response object.\n\n### User\n\n#### `jribbble.user(options, callback)`\n\n**Description:** Gets the current user based on the `access_token`.\n\n**Parameters:**\n- callback - `Function` Will receive a single argument. An single shot object if an id\nwas provided, an array of shot objects if no id provided.\n\n**Example usage:**\n```javascript\n// Get your profile information and display it in the DOM\njribbble.user({ token: \"your_oauth_access_token\" }, function(userObj) {\n  var html = [\n    '\u003cimg src=\"' + userObj.avatar_url + '\"\u003e',\n    '\u003ch3\u003e' + userObj.name + '\u003c/h3\u003e',\n    '\u003ch4\u003e' + userObj.bio + '\u003c/h4\u003e',\n    '\u003cp\u003eLocation: ' + userObj.location + '\u003c/p\u003e'\n  ];\n  document.getElementById(\"user\").innerHTML = html.join(\"\");\n});\n```\n\nSee the [Dribbble API Docs for User](http://developer.dribbble.com/v2/user/) for the full response object.\n\n### Projects\n\n#### `jribbble.projects(options, callback)`\n\n**Description:** Gets the current users projects\n\n**Example usage:**\n```javascript\n// Get a list of your projects and display them in the DOM.\njribbble.projects({token: \"your_oauth_access_token\"}, function(projectsArray) {\n  document.querySelector(\".dribbble-projects\").innerHTML = projectsArray.reduce(function(html, project) {\n    return html + '\u003cli\u003e\u003ch4\u003e' + project.name + '\u003c/h4\u003e\u003cp\u003e' + project.description + '\u003c/p\u003e\u003c/li\u003e';\n  }, \"\");\n});\n```\n\nSee the [Dribbble API Docs for Projects](http://developer.dribbble.com/v2/projects/) for the full response object.\n\n### Likes\n\n**Note: This will only work for Dribbble-approved applications**.\n\n#### `jribbble.likes(options, callback)`\n\n**Description:** Gets the current users likes\n\n**Example usage:**\n```javascript\njribbble.likes({token: \"your_oauth_access_token\"}, function(likesArray) {\n  // Do cool stuff with response\n});\n```\n\nSee the [Dribbble API Docs for Likes](http://developer.dribbble.com/v2/likes/) for the full response object.\n\n### Popular\n\n**Note: This will only work for Dribbble-approved applications**.\n\n#### `jribbble.popular(options, callback)`\n\n**Description:** Gets a list of popular shots\n\n**Example usage:**\n```javascript\njribbble.popular({token: \"your_oauth_access_token\"}, function(shotsArray) {\n  // Do cool stuff with response\n});\n```\n\nSee the [Dribbble API Docs for popular shots](http://developer.dribbble.com/v2/shots/#list-popular-shots) for the full response object.\n\n#### Pagination\nMethods that get a list of items can use pagination as described in the [Dribbble Docs](https://developer.dribbble.com/v2/#pagination)\n\nYou can provide `page` and `per_page` via the `options` object of Jribbble methods.\n\n**Example**\n```javascript\njribbble.shots({page: 2, per_page: 13}, function(shotsArray) {});\n```\n\n---------------------------------------------------------------------------\n\n## Contributing\nJribbble is open source. [Issues](https://github.com/tylergaw/jribbble/issues) and [pull requests](https://github.com/tylergaw/jribbble/pulls) gladly accepted.\n\nInstall development dependencies:\n\n```\nnpm install\n```\n\n### Tests\nFor PRs to be accepted, all tests must pass. They in [Travis](https://travis-ci.org/tylergaw/jribbble) for all PRs. There are two options to run tests locally.\n\nWatch all files and rerun tests on change:\n```\nnpm run test-watch\n```\n\nRun all tests once:\n```\nnpm test\n```\n\n### Using Jribbble locally\nWe don't have any type of built in setup for this. To work locally, I create a\nfile in the root directory `sandbox.html`. This file is ignored by git. In there\nI add HTML as an end-user would, expect I point to the `src` version of Jribbble\nto test new changes as I'm working.\n\nI view `sandbox.html` in a browser using a Python server:\n\n```\npython -m http.server\n```\n\n### Building Jribbble\nJribbble includes a Makefile that includes a build task. The task copies the jribbble.js source to the `/dist` directory–adding the version number and build date–and creates a minified version of it using UglifyJS2.\n\nTo build Jribbble you'll need UglifyJS2:\n\n```\nnpm install uglify-js -g\n```\n\nthen from the root directory run\n\n```\nmake\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftylergaw%2Fjribbble","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftylergaw%2Fjribbble","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftylergaw%2Fjribbble/lists"}