Presented by: Tom Wilson, hyper63 Presented at the All Things Open Virtual Meetup Abstract: APIs (Application Program Interfaces) is how programs can talk with other programs and is a design consideration for many products. Let’s discuss: Why you should build an application with an API? What are the top 5 requirements of designing an API with examples? Some open-source javascript frameworks that can help you design and build your API. In order to get the most out of this talk, you should have a good understanding of http REST protocol and general application development. Familiarity with javascript and technologies like NodeJS and Express would be a plus. In this talk, you should come away with a good understanding of why you should consider building an API in your application, key good practices every API should include, and how you could implement an API using Javascript.

1. APIS
A STARTERS GUIDE TO
BUILDING APIS WITH
JAVASCRIPT

2. STRIPE ZAPIER TWILIO
TWITTER DROPBOX YOUTUBE
AWS AZURE GCP
APIS ARE
EVERYWHERE

3. APIs describe the
functionality of your
application, to have a well-
designed API is to have a
well-defined Application

4. CLIENT / SERVER
CLIENT SERVER
SERVICES
API

5. FIVE REQUIREMENTS
SECURITY
Encryption
Authentication
Authorization
DOCUMENTATION
Reference
Guides
Contribution
VALIDATION
Data
Validation
TESTING
Integration
Testing
MONITORING
Observability
Performance Tuning
Track Migrations

6. REST/JSON
APIs

7. SECURITY
ENCRYPTION
CORS
Authentication
Authorization

8. SECURITY - ENCRYPTION
● HTTPS
● SSL Certificates
● LetsEncrypt.org

9. CORS
Cross-Origin Resource Sharing
CORS is a http-based mechanism that allows servers to indicate which clients it will allow to interact
with.
If you expect clients of different origins to be consuming your API, then you will need to implement a
CORS policy in your API. Most API Frameworks have ‘cors middleware’ to assist you with the
implementation.
See: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS for more information.

10. Authentication
● JSON WEB TOKEN

11. JSON WEB TOKEN
header payload signature
{
“alg”: “HS256”,
“typ”: “JWT”
}
{
"sub": "1234567890",
"name": "John Doe",
"iat": 1516239022
}
HMACSHA256(
base64UrlEncode(header) + "." +
base64UrlEncode(payload),
SECRET
)

12. VERIFY TOKEN

13. Authorization
SCOPES
● RESOURCE:ACTION
● *:* = Everything
● MOVIE:READ REVIEW:WRITE
COMMENT:DELETE

14. SCOPES
RESOURCE ACTION DESC
MOVIE READ List, Search and Get Movies
MOVIE WRITE Create, Update and Delete
REVIEW WRITE Create, Update and Delete
Review
COMMENT CREATE Create Comment
COMMENT DELETE Delete Comment

15. ASSOCIATE SCOPES with Roles
Movie
Reviewer
Review
Consumer
MOVIE:*
REVIEW:*
COMMENT:DELETE
REVIEW:READ
COMMENT:CREATE
ROLE SCOPE

16. DOCUMENTATIO
N
README
Specifications
Getting Started/Guides

17. README
● Describe your API
● Links to Documentation
● How to setup as a Developer
● How to deploy
● Dependency Management
● Contribution Guide
● License
● Gratitude

18. Specifications/Reference
● Use OpenAPI (Swagger) Specifications
● Describe your API
● Identify Servers
● Describe Authentication
● Describe Endpoints
● Provide Examples
● Specify Components/Models

20. Getting Started/Guides
● Introduction to API (Concepts)
● Getting Started (How do I use this
API?)
● Guides/Use Cases

23. VALIDATION
Input
Output

24. VALIDATE ALL INPUT
● Do not trust the data coming from the client
● Use validation libraries and be as concise as possible
● Examples
○ Zod https://github.com/colinhacks/zod/tree/v3
○ Joi https://github.com/sideway/joi
○ Yup https://github.com/jquense/yup

25. Example

26. VALIDATE OUTPUT
Validate data from your services, and use Object Schema
validation to verify that you send the right data to your client.
NOTE: This can provide valuable information for
troubleshooting and problem isolation

27. TESTING
Integration Testing
Edge Mocking
CI/CD

28. INTEGRATION TESTING
The process of testing from the API Endpoint to the Service
Layer.
API
ENDPOINT
CLIENT SERVICES
REQUEST MOCK

29. Test Example

30. Mock Example

31. Automate your Tests

32. MONITORING
APM
Log Aggregation

33. Application Performance
Management
CLIENT API
MEMORY
CPU
RESPONSE TIME

34. Log Aggregation

36. Times Up!
Thank you!

37. Resources
Here is a link to a Gist for several resources:
https://gist.github.com/twilson63/d1e097de099504c32f7061d06a427e22
Or
https://bit.ly/3foPErH

38. Thanks to Slides Go for the slide
theme
https://slidesgo.com/theme/earth-hour-social-media