Full Stack Web Development Version Control, Tooling & DevOps Syllabus

What is a fork on GitHub, and how does it differ from a branch?

A fork is a server-side copy of an entire repository under your own account (used for outside contributions); a branch is a pointer within a single repository.

What does git push -u origin <branch> accomplish?

It pushes the branch to origin and sets it as the upstream tracking branch, so future git push/pull need no arguments.

What is the typical GitHub fork-and-pull contribution workflow?

Fork the repo, clone your fork, create a feature branch, commit and push, open a Pull Request to the upstream repo, address review feedback, then maintainers merge.

What is the role of a package manager in web development?

It automates installing, updating, configuring, and resolving dependencies (libraries) for a project, and records them so installs are reproducible.

What is the difference between package.json and package-lock.json?

package.json declares dependencies with version ranges and project metadata; package-lock.json records the exact resolved version of every dependency for reproducible installs.

In npm, what is the difference between dependencies and devDependencies?

dependencies are needed at runtime in production; devDependencies (e.g., test runners, linters, bundlers) are only needed during development and are excluded with npm install --production.

In semantic versioning (e.g., 2.4.1), what do the three numbers mean?

MAJOR.MINOR.PATCH: MAJOR = breaking changes, MINOR = new backward-compatible features, PATCH = backward-compatible bug fixes.

In a version range, what do the caret (^) and tilde (~) prefixes mean?

^1.2.3 allows updates that don't change the leftmost non-zero digit (minor + patch); ~1.2.3 allows only patch-level updates (1.2.x).

What is a module bundler and why is one used in front-end development?

A bundler (e.g., Webpack, Vite, Rollup, esbuild) combines many JavaScript/CSS/asset modules into optimized files, resolving imports for faster, fewer browser requests.

What is the difference between a bundler and a transpiler?

A bundler combines and optimizes modules into output files; a transpiler (e.g., Babel, TypeScript, SWC) converts source code from one language/version to another the browser understands.

What is tree shaking in the context of bundlers?

A dead-code elimination process that removes unused exports from the final bundle, relying on ES module static structure to reduce bundle size.

What is the purpose of a linter such as ESLint?

A linter statically analyzes code to flag errors, bugs, anti-patterns, and style violations against configurable rules, without running the code.

How does a code formatter like Prettier differ from a linter?

A formatter automatically rewrites code to a consistent style (spacing, quotes, line length); a linter detects problems and may not reformat. They are often used together.

What is a Git pre-commit hook, and what tool commonly manages them in JS projects?

A pre-commit hook is a script Git runs before a commit is finalized (e.g., to lint/format); Husky is a common tool for managing Git hooks in JavaScript projects.

What does a debugger 'breakpoint' do?

It pauses program execution at a chosen line so you can inspect variables, the call stack, and step through code to find bugs.

In browser DevTools, what is the difference between the Console and Network panels?

The Console logs messages/errors and runs JavaScript interactively; the Network panel records HTTP requests with their status, timing, headers, and payloads.

What is the difference between 'step over', 'step into', and 'step out' when debugging?

Step over executes a function call without entering it; step into enters the called function; step out runs until the current function returns.

What is the purpose of source maps in front-end debugging?

Source maps map minified/transpiled production code back to the original source, so DevTools can show readable file names, lines, and variable names.

What are environment variables, and why are they used in apps?

They are key-value settings provided by the runtime environment (e.g., API keys, DB URLs, mode flags) used to configure an app without hard-coding values or committing secrets.

What is a .env file and why should it usually be git-ignored?

A .env file stores environment variables as KEY=value pairs for local development; it's git-ignored because it often contains secrets that must not be committed.

What distinguishes development, staging, and production environments?

Development is the local coding environment; staging mirrors production for final testing; production is the live environment serving real users.

What does it mean to deploy a static front-end app, and where is it typically hosted?

It means uploading prebuilt HTML/CSS/JS assets to be served as-is, typically via a CDN or static host (e.g., Netlify, Vercel, GitHub Pages, S3+CloudFront).

What is a CDN and how does it improve front-end delivery?

A Content Delivery Network is a geographically distributed set of cache servers that serve static assets from a location near the user, reducing latency and load.

How does deploying a back-end service generally differ from deploying a static front-end?

A back-end is a long-running server process (needs a runtime, ports, scaling, databases, and process management), whereas a static front-end is just files served by a host/CDN.

What does CI/CD stand for, and what does each part mean?

Continuous Integration (automatically build/test code on each change to catch issues early) and Continuous Delivery/Deployment (automatically release/deploy passing changes).

What is a CI/CD pipeline?

An automated sequence of stages (e.g., install, lint, test, build, deploy) triggered by events like a push or PR to validate and ship code consistently.

What is the difference between Continuous Delivery and Continuous Deployment?

Continuous Delivery automatically prepares releases but requires a manual approval to deploy to production; Continuous Deployment automatically deploys every passing change with no manual gate.

What does DNS do, and what is an A record vs a CNAME record?

DNS resolves domain names to IP addresses; an A record maps a domain to an IPv4 address, while a CNAME record aliases one domain name to another.

What does HTTPS provide over HTTP, and what protocol secures it?

HTTPS provides encryption, integrity, and server authentication over HTTP using TLS (Transport Layer Security), preventing eavesdropping and tampering.

What is an SSL/TLS certificate and what does Let's Encrypt provide?

A certificate cryptographically proves a domain's identity and enables HTTPS; Let's Encrypt is a free, automated Certificate Authority that issues TLS certificates.

What is Docker and what core problem does it solve?

Docker is a containerization platform that packages an app with its dependencies into a portable container, solving 'it works on my machine' by ensuring consistent environments.

What is the difference between a Docker image and a Docker container?

An image is an immutable, read-only template (blueprint) of an app and its dependencies; a container is a running (or runnable) instance created from an image.

How do containers differ from virtual machines (VMs)?

Containers share the host OS kernel and isolate at the process level (lightweight, fast), while VMs each run a full guest OS on a hypervisor (heavier, slower to start).

What is a Dockerfile?

A text file with step-by-step instructions (e.g., FROM, COPY, RUN, CMD) that Docker uses to build an image automatically and reproducibly.

What is the difference between the CMD and RUN instructions in a Dockerfile?

RUN executes commands at image build time (e.g., installing packages); CMD specifies the default command to run when a container starts from the image.

What Docker command runs a container from an image, and how do you map a port?

docker run <image>; map a host port to a container port with -p hostPort:containerPort (e.g., docker run -p 8080:80 nginx).

What is a Docker volume and why use one?

A volume is Docker-managed persistent storage mounted into a container, used so data (e.g., databases) survives container restarts or removal.

What is Docker Compose and when is it used?

Docker Compose is a tool to define and run multi-container applications using a single YAML file (docker-compose.yml), ideal for apps with services like a web server, API, and database.

In Docker Compose, what does the command 'docker compose up' do?

It reads the compose file, builds/pulls images as needed, creates a shared network, and starts all defined services (add -d to run them detached in the background).