The one-sentence version

Trigonometry studies the relationship between angles and side lengths — mostly in triangles, and by extension in circles, waves, and rotations.

The three core functions take an angle and return a ratio:

$$ \sin(\theta), \quad \cos(\theta), \quad \tan(\theta) $$

If you know an angle (plus one side), you can find every other side. If you know sides, you can recover the angles. That two-way bridge is the whole superpower.

Why developers care

Domain How trig appears
2D/3D graphics, games Rotating sprites, orbiting cameras, aiming, projectile paths
Web / CSS / SVG / Canvas transform: rotate(), drawing arcs, clock hands, charts
Audio / animation Sine waves for sound, easing, bobbing, pulsing effects
Data science / ML Fourier transforms, embeddings with angular distance, time-series seasonality
Robotics / geo / maps Bearings, GPS distances, sensor angles, inverse kinematics

Concrete example: placing an object on a circle in a game loop is one line once you know trig:

import math
radius, angle = 100, math.pi / 4  # 45 degrees in radians
x = radius * math.cos(angle)
y = radius * math.sin(angle)
print(x, y)  # 70.71 70.71
const radius = 100, angle = Math.PI / 4;
const x = radius * Math.cos(angle);
const y = radius * Math.sin(angle);
console.log(x, y); // 70.71 70.71

Vocabulary you need

  • Angle (\(\theta\), theta): amount of rotation between two rays. Vertex is the corner point.
  • Right triangle: a triangle with one 90° angle. Trig starts here.
  • Hypotenuse: the longest side, always opposite the right angle.
  • Opposite / Adjacent: sides relative to the angle you care about (not fixed labels).
  • Sine, Cosine, Tangent: the three main ratios (next pages define them).
  • Radian: the “native” angle unit in math and in code (see next page).
  • Unit circle: a circle of radius 1 used to extend trig beyond 90°.
  • Period / Amplitude: vocabulary for wave graphs (sine curves repeat).

The mental models

Keep three pictures in mind; the whole course rotates between them:

  1. Triangle model: angle + side → other sides (construction, layout).
  2. Circle model: angle → \((x, y)\) point on a circle (rotation, orbits).
  3. Wave model: angle/time → oscillating value (sound, animation, signals).

They are the same mathematics seen from different angles:

$$ x = r\cos\theta, \qquad y = r\sin\theta $$

That one pair of equations connects triangles (\(r\) = hypotenuse), circles (\(r\) = radius), and waves (plot \(y\) against \(\theta\)).

Try it

  1. In Python, compute math.cos(0), math.cos(math.pi/2), math.sin(math.pi/2). Can you explain each result as an \((x, y)\) point?
  2. In CSS, what do you expect transform: rotate(90deg) to do to a right-pointing arrow? Test it in devtools.
  3. Name one project of yours (game, chart, map, animation) where an angle determines a position. That is your running example for this course.

Next: Angles, Degrees, and Radians — the units everything else depends on.