Harvard CS50W - Web Programming with Python and JavaScript Flashcards

Question 1

What is the purpose of Django's ORM?

Accepted Answer

The Django Object-Relational Mapper (ORM) allows you to interact with your database using Python code, abstracting away raw SQL. It maps database tables to Python classes (models) and rows to objects, simplifying database operations.

Question 2

How do you retrieve all objects from a Django model named `Book`?

Accepted Answer

You can retrieve all objects using `Book.objects.all()`. This returns a `QuerySet` containing all `Book` instances in the database.

Question 3

Explain the difference between `filter()` and `get()` in Django ORM.

Accepted Answer

`filter()`: Returns a `QuerySet` containing objects that match the given lookup parameters. It can return zero, one, or multiple objects.
`get()`: Returns a single object matching the given lookup parameters. If no object or more than one object is found, it raises an exception (`DoesNotExist` or `MultipleObjectsReturned`, respectively).

Question 4

How do you create a new record in a Django model `Author` with `name='Jane Doe'`?

Accepted Answer

You can create a new record using `Author.objects.create(name='Jane Doe')`. Alternatively, you can instantiate the model and then save it:
```python
author = Author(name='Jane Doe')
author.save()
```

Question 5

What are Django database migrations used for?

Accepted Answer

Migrations are Django's way of propagating changes you make to your models (adding a field, deleting a model, etc.) into your database schema. They are essentially Python files that describe these changes.

Question 6

What is the command to create migration files for changes in your Django models, and what command applies those changes to the database?

Accepted Answer

To create migration files: `python manage.py makemigrations`
To apply migrations to the database: `python manage.py migrate`

Question 7

List the six guiding principles of RESTful architecture.

Accepted Answer

Client-Server: Separation of concerns.
Stateless: Each request from client to server must contain all information needed to understand the request.
Cacheable: Responses must explicitly or implicitly define themselves as cacheable or non-cacheable.
Uniform Interface: Simplifies system architecture.
Layered System: A client cannot ordinarily tell whether it is connected directly to the end server or to an intermediary.
Code-On-Demand (Optional): Servers can temporarily extend or customize client functionality by transferring executable code.

Question 8

In REST, what is a "resource" and how is it identified?

Accepted Answer

A resource is any information that can be named, such as a document, an image, or a service. In REST, resources are identified by Uniform Resource Identifiers (URIs), which are typically URLs.

Question 9

Which HTTP method is typically used to retrieve data from a server, and is it idempotent?

Accepted Answer

The `GET` method is used to retrieve data. Yes, `GET` is idempotent, meaning making the same `GET` request multiple times will have the same effect on the server (no side effects, only data retrieval).

Question 10

Explain the difference between `PUT` and `PATCH` HTTP methods.

Accepted Answer

`PUT`: Used to replace an entire resource with new data. It is idempotent.
`PATCH`: Used to apply partial modifications to a resource. It is not necessarily idempotent.

Question 11

Which HTTP method is used to submit data to be processed to a specified resource, and is it idempotent?

Accepted Answer

The `POST` method is used to submit data. It is generally not idempotent, as sending the same `POST` request multiple times might create multiple identical resources or trigger multiple actions.

Question 12

What does JWT stand for, and what are its three main parts?

Accepted Answer

JWT stands for JSON Web Token. Its three main parts are:

Header: Contains metadata about the token type (e.g., `JWT`) and the signing algorithm (e.g., `HS256`).
Payload: Contains the claims (statements about an entity, typically the user, and additional data).
Signature: Used to verify that the sender of the JWT is who it says it is and to ensure the message hasn't been tampered with.

Question 13

How does JWT authentication typically work in a web application?

Accepted Answer

User logs in with credentials.
Server authenticates credentials and issues a JWT.
Client stores the JWT (e.g., in local storage).
For subsequent requests to protected routes, the client sends the JWT in the `Authorization` header (e.g., `Bearer `).
Server verifies the JWT's signature and expiration before granting access.

Question 14

What is the primary advantage of using `fetch` API over `XMLHttpRequest` for asynchronous requests in modern JavaScript?

Accepted Answer

The `fetch` API provides a more powerful and flexible feature set for making web requests, built on Promises. This leads to cleaner, more readable code, especially when combined with `async`/`await`, avoiding the "callback hell" often associated with `XMLHttpRequest`.

Question 15

How can you make an asynchronous HTTP `GET` request and update the DOM using `async`/`await` in JavaScript?

Accepted Answer

```javascript
async function fetchDataAndUpdateDOM() {
    try {
        const response = await fetch('/api/data');
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }
        const data = await response.json();
        document.getElementById('output').innerText = JSON.stringify(data);
    } catch (error) {
        console.error('Error fetching data:', error);
        document.getElementById('output').innerText = 'Failed to load data.';
    }
}
```

Question 16

Explain the purpose of `let` and `const` keywords introduced in ES6, and how they differ from `var`.

Accepted Answer

`var`: Function-scoped, can be re-declared and re-assigned.
`let`: Block-scoped, can be re-assigned but not re-declared within the same scope.
`const`: Block-scoped, cannot be re-assigned or re-declared after initialization. It creates a read-only reference to a value.

Question 17

What is an arrow function in JavaScript ES6, and what is its main advantage regarding `this`?

Accepted Answer

An arrow function is a concise way to write anonymous functions. Its main advantage is that it does not bind its own `this` value; instead, it lexically inherits `this` from its enclosing scope. This solves common `this` binding issues in traditional function expressions.

Question 18

In React, what is the `useState` hook used for?

Accepted Answer

The `useState` hook allows functional components to have state. It returns a pair: the current state value and a function that lets you update it.
```javascript
const [count, setCount] = useState(0);
```

Question 19

How do you use Django's `F` objects for database queries?

Accepted Answer

`F` objects allow you to refer to model field values directly within database queries, rather than as Python values. This enables operations like incrementing a field based on its current value directly in the database, avoiding race conditions.
Example: `Product.objects.update(stock=F('stock') - 1)`

Question 20

What is the purpose of `select_related()` and `prefetch_related()` in Django ORM?

Accepted Answer

Both are used for query optimization to reduce the number of database queries when accessing related objects:

`select_related()`: Performs a `JOIN` and includes the fields of the related objects in the initial `SELECT` statement. Best for one-to-one and many-to-one relationships.
`prefetch_related()`: Performs a separate lookup for each relationship and then joins them in Python. Best for many-to-many and many-to-one relationships where the "many" side is being accessed.

Question 21

How can you dynamically add an event listener to a newly created DOM element in JavaScript?

Accepted Answer

You first create the element, then append it to the DOM, and then attach the event listener directly to that element.
```javascript
const newButton = document.createElement('button');
newButton.innerText = 'Click Me';
document.body.appendChild(newButton);
newButton.addEventListener('click', () => {
    alert('Button clicked!');
});
```
Alternatively, for elements added asynchronously, you can use event delegation on a parent element.

Question 22

What is the significance of "statelessness" in RESTful API design?

Accepted Answer

Statelessness means that each request from a client to a server must contain all the information needed to understand the request. The server should not store any client context between requests. This improves scalability, reliability, and visibility, as any server can handle any request.

Harvard CS50W - Web Programming with Python and JavaScript

Cards in this deck

Related Flashcard Sets

Harvard CS50 Web Programming with Python and JavaScript

Harvard CS50W - Web Programming with Python & JavaScript

Series 7 Exam - Options Strategies & Municipal Securities

Neuroscience - Action Potentials & Synaptic Transmission