## What are Cookies?
Cookies are small text files stored in your browser by websites. They remember information about you - login status, preferences, shopping cart items - so the website recognizes you on your next visit.
Think of cookies like a loyalty card. The store gives you a card with your ID. Next time you visit, they scan your card and know who you are and what you like.
## How Cookies Work
1. You visit a website
2. Server sends a cookie to your browser
3. Browser stores the cookie
4. On future requests, browser sends the cookie back
5. Server reads the cookie and knows who you are
All automatic. Happens in milliseconds.
## What Cookies Look Like
Simple key-value pairs with some settings like expiration dates and security flags.
## Common Uses for Cookies
**Authentication**: Remember you are logged in
**Shopping Cart**: Keep items in cart between pages
**Preferences**: Remember dark mode, language, timezone
**Analytics**: Track which pages you visit
**Ads**: Target ads based on browsing history
## Setting Cookies
**Server-Side** (Node.js): Use response methods to set cookies with options like maxAge, httpOnly, and secure flags.
**Client-Side** (JavaScript): Use document.cookie to set cookies directly in the browser.
## Reading Cookies
**Server-Side**: Access cookies from the request object.
**Client-Side**: Read from document.cookie property.
## Cookie Attributes
**expires / max-age**: When cookie expires
**domain**: Which domain can read the cookie
**path**: Which URLs can access the cookie
**secure**: Only send over HTTPS
**httpOnly**: JavaScript cannot access (prevents XSS attacks)
**SameSite**: Control cross-site cookie behavior
## Session Cookies vs Persistent Cookies
**Session Cookies**: Deleted when browser closes - no expiration set.
**Persistent Cookies**: Stored for specified time - expiration date set explicitly.
## Security Concerns
**XSS Attacks**: Malicious scripts steal cookies
- **Solution**: Use httpOnly flag
**CSRF Attacks**: Trick browser into sending cookies to wrong site
- **Solution**: Use SameSite attribute
**Cookie Theft**: Attacker intercepts cookies
- **Solution**: Use secure flag (HTTPS only)
## Cookie Consent
GDPR and other laws require cookie consent for tracking. You have seen cookie banners on every website. Required by law in EU and many other regions.
## Cookies vs localStorage
**Cookies**:
- Sent with every request
- 4KB size limit
- Can be httpOnly (secure)
- Have expiration
**localStorage**:
- Not sent with requests
- 5-10MB size limit
- Accessible by JavaScript
- No expiration (persist forever)
Use cookies for authentication. Use localStorage for larger client-side data.
## Third-Party Cookies
**First-Party**: Set by the site you visit
**Third-Party**: Set by other domains (ads, analytics)
Browsers increasingly block third-party cookies for privacy.
## Working with Cookies
JavaScript libraries like js-cookie make working with cookies much simpler than parsing document.cookie manually.
## The Bottom Line
Cookies are essential for web authentication and user experience. They remember who you are across page loads and visits.
Understand cookies, use them securely, and respect user privacy. Every web developer works with cookies constantly.
