API Playground

API Endpoints

Use these endpoints to practice making HTTP requests. The base URL is: https://aw.profbobby.com/api/

GET /api/search
GET /api/search?q=javascript
GET /api/search?category=tutorial
GET /api/search?tag=css

GET /api/messages
GET /api/messages?limit=10

{
    "username": "your_name",
    "message": "your_message"
}

username=your_name&message=your_message

DELETE /api/messages?id=123

Search Resources (GET)

Search our database of programming resources.

Post Message (POST)

Post a message to the class message board.

Live Message Board

Messages posted by you and your classmates:

Code Examples

Using Fetch API (JavaScript)

// GET Request - Search for resources
fetch('/api/search?q=javascript')
    .then(response => response.json())
    .then(data => console.log(data))
    .catch(error => console.error('Error:', error));

// POST Request - Create a message
fetch('/api/messages', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    body: JSON.stringify({
        username: 'StudentName',
        message: 'Hello from JavaScript!'
    })
})
    .then(response => response.json())
    .then(data => console.log(data))
    .catch(error => console.error('Error:', error));

Using HTML Form (No JavaScript)

<form action="/api/messages" method="POST">
    <label for="username">Username:</label>
    <input type="text" id="username" name="username" required>

    <label for="message">Message:</label>
    <textarea id="message" name="message" required></textarea>

    <button type="submit">Post Message</button>
</form>

Using async/await

// Modern async/await syntax
async function searchResources(query) {
    try {
        const response = await fetch(`/api/search?q=${query}`);
        const data = await response.json();

        if (data.success) {
            console.log(`Found ${data.count} results:`);
            data.results.forEach(item => {
                console.log(`- ${item.title}: ${item.url}`);
            });
        }
    } catch (error) {
        console.error('Failed to fetch:', error);
    }
}

// Call the function
searchResources('react');

Understanding HTTP Methods