Once we got a request from our client who asked to change the way the shots from Dribbble were displayed.
The previous implementation was done using Dribbble API v1. We opened the documentation only to see a notice about API v1 deprecation effective March 26, 2018: “You’re looking at the deprecated v1 API docs. API v1 will be retired on March 26, 2018. You’ll eventually want to use the v2 docs instead.”
It’s not secure to pass personal tokens and IDs from the browser, so now the authentication will happen on the server.
We thought that it’s not just our client who needs their Dribbble feed maintained, so our team decided to create a lightweight library compatible with API v2.
What you will learn:
How it works
We created a simple proxy server with NodeJS and ExpressJS that handles authorisation and gets an access token using our library.
For ease of use, we also added an option to register several users at the same time.
For the same reason, we implemented Docker because it makes the production process much more pleasant.
How to use Dribbble API v2 library
Here’s a short tutorial on how to display shots with Dribbble API v2.
Step 1.
Server
To start working with the server, clone it from Docker hub.
Then run docker compose with docker-compose up – this will set up a virtual machine.
The server uses port 8000, which you can change in Docker settings if you wish.
Step 2.
App registration
Then, register your application. Make sure the Docker process is running and open a new tab in the terminal. Run the following commands:
1 docker-compose exec server sh 2 npm run setup
Step 3.
Configuration
Client ID and Client Secret should be configured in the settings of your app – just copypaste them from there.
Also, set your Redirect URL to http://localhost/.
Step 4.
User registration
Now we can register our users. Just enter any username and follow the link to register them. Upon completion, you will be redirected to http://localhost/code=some_code. Copy this code and paste it into the terminal.
The number of users is unlimited, so you can create a portfolio of several designers in one feed.
Now you can close the current terminal and restart docker-compose.
Registration of users and the application is a one time action which is required during app initialization.
It creates a db folder on your server along with a settings file. If you want to go through the registration process again – simply delete it and start over.
Step 5.
Done!
Voila, your app is registered! To get a list of shots of a specific user, send a GET request to this URL:
http:/YOUR-DOMAIN:8000/shot/?users=first_user_name
Full documentation is available on GitHub.
Feel free to use it and send us feedback!