DOCSEARCHbyAlgolia
Submit Docs

CS 61D Course Documentation

website·Indexed 30 days ago

https://61d.org

Educational resources and readings covering full-stack development, including JavaScript, TypeScript, React, Tailwind CSS, tRPC, Zod, and relational database modeling with Postgres and CRUD operations.

Tokens
40.6K
Snippets
242
Records
326
Agent score
55%

What's inside CS 61D

  1. Overview of tRPC for type-safe APIs

    tRPC (TypeScript Remote Procedure Call) is a framework for building end-to-end type-safe APIs using TypeScript. It eliminates the need for manual API client generation or separate schema definitions (unlike REST or GraphQL) by using TypeScript types directly to provide type inference across the client and server.

  2. Overview of CS61d Applied Software Development

    CS61d is a course focused on developing and deploying full-stack web applications. The curriculum is designed to lead students toward building a complete application from scratch. Key learning objectives include:

    • Version control and environment management using Git, GitHub, and the command line.
    • Programming in JavaScript and TypeScript.
    • Frontend development using React, Tailwind CSS, and NextJS.
    • Backend development using tRPC, Drizzle ORM, and PostgreSQL.
    • Deployment strategies for both managed and bare-metal cloud infrastructure.

  3. Introduction to Markdown for documentation

    Markdown is a plain text formatting syntax used by developers to create documentation that remains consistent across different platforms and renders. Unlike rich-text editors (like Google Docs), Markdown embeds formatting directly into the text, ensuring that structure—such as headers, lists, and links—is preserved when moving files between different environments. It is the industry standard for project documentation, most notably used for the README.md file found in the root of Git repositories.

  4. Overview of React Query for server state management

    React Query is a library used to fetch, cache, and synchronize server state in React applications. It abstracts the complexity of asynchronous operations and background synchronization, allowing components to focus on rendering rather than state management. Key features include automatic caching, background syncing, support for pagination/infinite queries, and integrated error handling.

  5. Overview of React Context

    Context provides a way to share data from a parent component to any component in the tree below it, regardless of depth, without explicitly passing props. This is particularly useful for avoiding 'prop drilling' when multiple deeply nested components need the same piece of information.

  6. Understand React's core purpose and architecture

    React is a JavaScript library used for building user interfaces (UI). It utilizes a component-based architecture, allowing developers to create reusable, modular components (such as buttons or sidebars) that manage their own state. This modularity simplifies maintenance, testing, and reuse across an application.

  7. Understand basic database CRUD operations

    CRUD is an acronym representing the four primary operations performed on a database to manage records:

    • Create: Adds new records to a table (inserting data).
    • Read: Retrieves data from a table (querying and fetching information).
    • Update: Modifies existing records in a table (changing stored data).
    • Delete: Removes records from a table (deleting data).

  8. Understand relational database structural elements

    Relational databases organize data into tables. The core structural components include:

    • Table: A collection of related data entries consisting of columns and rows (e.g., a Customers table).
    • Row (Record/Tuple): A single data item within a table (e.g., a specific customer's data: 1, John Doe, email@example.com).
    • Column (Field/Attribute): A specific data attribute within a table (e.g., the Email column).

  9. Understand the role of Authentication and Middleware in backends

    Authentication is the process of verifying a user's identity to prevent unauthorized access. Its primary roles include identity verification (via credentials/tokens), access control (authorization), and session management.

    Middleware acts as an intermediary between the server and application logic, intercepting requests and responses. Common uses include authentication checks, request/response manipulation, logging, and CORS management.

  10. Use GitHub Pull Requests, Issues, and Actions

    GitHub extends core Git functionality with collaboration tools:

    • Pull Requests (PRs): Proposals to merge changes from one branch to another, allowing for code review and diff inspection.
    • Issues: Posts used to report bugs or request features; they can be linked to PRs and marked as closed when resolved.
    • Actions: CI/CD automation defined in the .github/workflows directory to automate tasks like running test suites on every PR.

  11. Understand the utility-first approach of Tailwind CSS

    Tailwind CSS is a utility-first CSS framework that provides pre-defined utility classes applied directly to HTML elements. Unlike traditional CSS, which requires creating separate stylesheets and naming custom classes, Tailwind classes mirror underlying CSS properties. This approach solves three common development problems:

    1. Naming: Eliminates the need to invent descriptive class names for every element.
    2. Unused CSS: Only the utility classes actually used in the markup are included in the final build, reducing the bundle size sent to the client.
    3. Context Switching: Styling happens directly in the markup, removing the need to tab between HTML/JSX and CSS files.

    In React, this aligns with the component-based mental model by making components truly self-contained units of markup, styling, and logic.

    export default function App() {
  return (
    <div>
      {/* Tailwind utility classes applied directly to the element */}
      <h1 className="font-bold text-blue-500 text-2xl">Dice Roller</h1>
    </div>
  );
}

  12. Understand the purpose and importance of database migrations

    Database migrations provide a way to incrementally apply changes to a database schema, ensuring the database structure evolves in sync with application code. They offer several key benefits:

    • Version Control: Tracks schema evolution and allows reverting to previous versions.
    • Consistency: Ensures all developers and environments use the same schema, reducing integration issues.
    • Automated Deployment: Integrates schema changes into CI/CD pipelines to reduce human error.
    • Data Integrity: Enforces constraints and rules safely during schema evolution to prevent data loss.
    • Maintainability: Allows complex changes to be broken down into smaller, manageable incremental steps.