8.1 KiB
8.1 KiB
MARP Rresentations
marp: true theme: gaia class: invert paginate: true title: "Understanding RESTful APIs" author: "Your Name" date: "CS PhD Seminar" style: | section { font-family: 'Arial, sans-serif'; color: #ddd; } h1, h2, h3 { color: #4CAF50; } .columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
Understanding RESTful APIs
CS PhD Seminar
What is a RESTful API?
- API (Application Programming Interface): A set of rules and protocols for building and interacting with software applications.
- REST (Representational State Transfer): An architectural style for designing networked applications.
- RESTful API: An API that adheres to the principles of REST.
Principles of REST
- Statelessness
- Client-Server Architecture
- Cacheability
- Layered System
- Uniform Interface
Statelessness
- Each request from a client to a server must contain all the information needed to understand and process the request.
- The server should not store any context about the client between requests.
Client-Server Architecture
- The client and server operate independently.
- The client makes requests, and the server processes them and returns the appropriate responses.
Cacheability
- Responses from the server should be explicitly labeled as cacheable or non-cacheable.
- This allows clients to cache responses and reduce the need to make additional requests.
Layered System
- A client cannot ordinarily tell whether it is connected directly to the end server or an intermediary.
- This promotes scalability by allowing load balancing and shared caching.
Uniform Interface
- Simplifies and decouples the architecture, which enables each part to evolve independently.
- Key constraints:
- Identification of resources (URI)
- Manipulation of resources through representations (HTTP methods)
- Self-descriptive messages
- Hypermedia as the engine of application state (HATEOAS)
HTTP Methods in REST
GET
- Retrieve data from a specified resource.
- Example:
GET /api/users
POST
- Submit data to be processed to a specified resource.
- Example:
POST /api/users
PUT
- Update a specified resource.
- Example:
PUT /api/users/1
DELETE
- Delete a specified resource.
- Example:
DELETE /api/users/1
RESTful API Example
GET /api/books/1 HTTP/1.1
Host: example.com
Response:
{
"id": 1,
"title": "RESTful APIs",
"author": "John Doe"
}
Advantages of RESTful APIs
- Scalability: Stateless nature helps in scaling.
- Flexibility: Can handle different types of calls and return different data formats.
- Independence: Separation of client and server.
Disadvantages of RESTful APIs
- Overhead: HTTP methods and headers add extra overhead.
- Statelessness: Requires every request to be self-contained.
- Complexity: Properly designing and documenting a RESTful API can be complex.
Conclusion
- RESTful APIs are a powerful way to design web services that are scalable, flexible, and maintainable.
- Understanding the principles and constraints of REST is crucial for designing effective APIs.
Thank you!
Q&A
References
- Fielding, Roy T. "Architectural Styles and the Design of Network-based Software Architectures." Doctoral dissertation, University of California, Irvine, 2000.
- REST API Tutorial
- RESTful Web Services
This presentation covers the fundamental aspects of RESTful APIs, using a dark theme and incorporating images, code snippets, and a two-column layout. This format should be engaging and informative for a group of CS PhD students.
---
---
marp: true
theme: gaia
class: invert
paginate: true
title: "Basic CSS Refresher"
author: "Your Name"
date: "CS PhD Seminar"
style: |
section {
font-family: 'Arial, sans-serif';
color: #ddd;
}
h1, h2, h3 {
color: #4CAF50;
}
code {
background: #333;
color: #eee;
padding: 0.2em;
border-radius: 5px;
}
.columns {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
}
---
# Basic CSS Refresher
## CS PhD Seminar
---
# What is CSS?
- **CSS (Cascading Style Sheets)**: A language used to describe the presentation of a document written in HTML or XML.
- **Purpose**: CSS handles the visual and aural layout, including colors, fonts, and spacing.

---
# CSS Syntax
- **Selector**: Specifies the HTML element(s) to be styled.
- **Declaration Block**: Contains one or more declarations separated by semicolons.
- **Declaration**: Consists of a property and a value, separated by a colon.
```css
selector {
property: value;
}
Selectors
-
Element Selector: Selects all elements of a given type.
p { color: blue; } -
Class Selector: Selects elements with a specific class.
.classname { color: green; } -
ID Selector: Selects an element with a specific ID.
#idname { color: red; }
Colors and Backgrounds
-
Color Property: Sets the text color.
p { color: blue; } -
Background Color:
body { background-color: #333; } -
Background Image:
body { background-image: url('background.jpg'); }
Fonts and Text
-
Font Family:
p { font-family: 'Arial, sans-serif'; } -
Font Size:
h1 { font-size: 2em; } -
Text Alignment:
h1 { text-align: center; }
Box Model
- Content: The innermost part where text and images appear.
- Padding: Clears an area around the content.
- Border: Goes around the padding.
- Margin: Clears an area outside the border.
div {
padding: 20px;
border: 5px solid #ccc;
margin: 10px;
}
Layout and Positioning
-
Display Property: Specifies how an element is displayed.
.inline { display: inline; } .block { display: block; } -
Position Property: Specifies the type of positioning method.
.relative { position: relative; top: 10px; left: 10px; } .absolute { position: absolute; top: 10px; left: 10px; }
Flexbox
-
Container:
.flex-container { display: flex; } -
Items:
.flex-item { flex: 1; }
Grid Layout
-
Container:
.grid-container { display: grid; grid-template-columns: auto auto auto; } -
Items:
.grid-item { padding: 20px; }
Pseudo-classes and Pseudo-elements
-
Pseudo-class: Applies to elements based on their state.
a:hover { color: red; } -
Pseudo-element: Styles specific parts of an element.
p::first-line { color: blue; }
Conclusion
- CSS Basics: Essential for designing and styling web pages.
- Selectors: Fundamental for targeting HTML elements.
- Box Model: Crucial for layout and design.
- Advanced Layouts: Flexbox and Grid offer powerful ways to create complex layouts.
Thank you!
Q&A
References
This presentation covers the fundamental aspects of CSS, using a dark theme and incorporating images, code snippets, and a two-column layout. This format should be engaging and informative for a group of CS PhD students.