FULL STACK INTERVIEW SYNTAX SHEET 01 / 03
■ REFERENCE CARD v2.0 — [Link] · EXPRESS · MONGODB · REACT
▲ [Link] APP ROUTER ■ EXPRESS / [Link] REST API
APP ROUTER PAGE BASIC SERVER
// app/about/[Link] const express = require('express')
export default function AboutPage() { const app = express()
return <main>About</main> [Link]([Link]())
} [Link](3000, () => [Link]('Running'))
export const metadata = { title: 'About' } MIDDLEWARE
DYNAMIC ROUTES const logger = (req, res, next) => {
// app/posts/[id]/[Link] [Link](`${[Link]} ${[Link]}`)
export default function Post({ params }: { next()
params: { id: string } }
}) { [Link](logger)
return <div>Post {[Link]}</div> [Link]('/api', authMiddleware)
} CRUD ENDPOINTS
API ROUTE [Link]('/users', async (req, res) => {
// app/api/users/[Link] const users = await [Link]()
import { NextResponse } from 'next/server' [Link](users)
export async function GET() { })
return [Link]({ ok: true }) [Link]('/users', async (req, res) => {
} const user = await [Link]([Link])
export async function POST(req: Request) { [Link](201).json(user)
const body = await [Link]() })
return [Link](body, { status: 201 }) [Link]('/users/:id', async (req, res) => {
} const user = await [Link](
SERVER COMPONENT FETCH [Link], [Link], { new: true })
[Link](user)
async function getData() {
})
const res = await fetch('[Link] {
[Link]('/users/:id', async (req, res) => {
next: { revalidate: 3600 } // ISR
await [Link]([Link])
})
[Link](204)
return [Link]()
})
}
export default async function Page() { PARAMS & QUERY
const data = await getData() [Link]('/posts/:id', (req, res) => {
return <div>{[Link]}</div> const { id } = [Link] // /posts/42
} const { page = 1 } = [Link] // ?page=2
CLIENT COMPONENT (USESTATE/USEEFFECT) [Link]({ id, page })
})
'use client'
import { useState, useEffect } from 'react' ERROR HANDLING
export default function Counter() { [Link]((err, req, res, next) => {
const [count, setCount] = useState(0) [Link]([Link])
useEffect(() => { [Link]([Link] || 500).json({
[Link] = `Count: ${count}` message: [Link] || 'Server Error'
}, [count]) })
return <button onClick={() => setCount(c => c+1)}> })
{count} JWT AUTH MIDDLEWARE
</button>
const jwt = require('jsonwebtoken')
}
const auth = (req, res, next) => {
SERVER ACTION FORM const token = [Link]
'use server' ?.split(' ')[1]
async function createUser(formData: FormData) { if (!token) return [Link](401)
const name = [Link]('name') as string try {
await [Link]({ data: { name } }) [Link] = [Link](token, [Link].JWT_SECRET)
revalidatePath('/') next()
} } catch { [Link](403) }
// usage: <form action={createUser}> }
■ MONGODB + MONGOOSE ODM ■ REACT ESSENTIALS HOOKS
SCHEMA CORE HOOKS
const userSchema = new [Link]({ // useState
name: { type: String, required: true }, const [val, setVal] = useState<string>('')
email: { type: String, unique: true },
role: { type: String, // useEffect
enum: ['admin','user'], default: 'user' }, useEffect(() => {
createdAt: { type: Date, default: [Link] } fetchData()
}) return () => cleanup()
const User = [Link]('User', userSchema) }, [dep])
CRUD + POPULATE
// useMemo — expensive computation
await [Link]({ role: 'admin' }).lean()
const result = useMemo(() => expensive(x), [x])
await [Link](id).populate('posts')
await [Link](id,
// useCallback — stable reference
{ $set: { name: 'New' } }, { new: true })
const handler = useCallback(() => {
await [Link](id)
doSomething(id)
await [Link]({ name: 'Alice', email: 'a@[Link]' })
}, [id])
AGGREGATION PIPELINE
CONTEXT API
await [Link]([
const Ctx = createContext(null)
{ $match: { status: 'completed' } },
// Provider
{ $group: { _id: '$userId',
<[Link] value={val}>{children}</[Link]>
total: { $sum: '$amount' } } },
// Consumer
{ $sort: { total: -1 } },
const v = useContext(Ctx)
{ $limit: 10 }
]) CUSTOM HOOK
function useFetch<T>(url: string) {
const [data, setData] = useState<T | null>(null)
const [loading, setLoading] = useState(true)
useEffect(() => {
fetch(url).then(r => [Link]()).then(d => {
setData(d); setLoading(false)
})
}, [url])
return { data, loading }
}
PROPS PATTERN
interface Props { name: string; age?: number }
const Card = ({ name, age = 0 }: Props) => (
<div>{name} — {age}</div>
)
FULL STACK INTERVIEW SYNTAX SHEET · For personal use only
FULL STACK INTERVIEW SYNTAX SHEET 02 / 03
■ REFERENCE CARD v2.0 — TYPESCRIPT · SQL · JAVASCRIPT PATTERNS
Τ TYPESCRIPT STATIC TYPES ■ SQL ESSENTIALS RDBMS
INTERFACE VS TYPE SELECT + FILTER + PAGINATION
interface User { SELECT id, name, email
id: number; name: string; email?: string FROM users
} WHERE role = 'admin'
// Type alias — can be a union AND created_at > '2024-01-01'
type ID = string | number ORDER BY name ASC
type Status = 'active' | 'inactive' LIMIT 10 OFFSET 20;
type PartialUser = Partial<User> JOINS
type ReadonlyUser = Readonly<User>
SELECT [Link], [Link]
GENERICS FROM users u
function first<T>(arr: T[]): T | undefined { INNER JOIN orders o ON o.user_id = [Link]
return arr[0] LEFT JOIN payments p ON p.order_id = [Link]
} WHERE [Link] = 'paid';
interface ApiResponse<T> {
data: T; status: number; message: string -- RIGHT JOIN, FULL OUTER JOIN also available
} GROUP BY + HAVING
// Conditional type
SELECT user_id,
type Awaited<T> = T extends Promise<infer U> ? U : T
SUM(amount) AS total,
ASYNC TYPING COUNT(*) AS orders
async function fetchUser(id: number): Promise<User> { FROM orders
const res = await fetch(`/api/users/${id}`) WHERE status = 'paid'
if (![Link]) throw new Error('Not found') GROUP BY user_id
return [Link]() as Promise<User> HAVING SUM(amount) > 1000
} ORDER BY total DESC;
UTILITY TYPES INSERT / UPDATE / DELETE
type CreateUser = Omit<User, 'id'> INSERT INTO users (name, email, role)
type UpdateUser = Pick<User, 'name' | 'email'> VALUES ('Alice', 'a@[Link]', 'user');
type UserRecord = Record<string, User>
type NonNull = NonNullable<string | null> UPDATE users
// ReturnType, Parameters, Exclude, Extract SET role = 'admin', updated_at = NOW()
type R = ReturnType<typeof fetchUser> WHERE id = 42;
TYPE GUARDS & NARROWING
DELETE FROM users
function isUser(val: unknown): val is User {
WHERE last_login < NOW() - INTERVAL '1 year';
return typeof val === 'object'
&& val !== null && 'id' in val CTE + SUBQUERY
} WITH top_users AS (
// in narrowing SELECT user_id, SUM(amount) total
if ('email' in obj) { /* obj has email */ } FROM orders GROUP BY user_id
// typeof, instanceof narrowing work too )
ENUMS & CONST ASSERT SELECT [Link], [Link]
FROM users u
enum Direction { Up, Down, Left, Right }
JOIN top_users t ON t.user_id = [Link]
const ROUTES = {
WHERE [Link] > 5000;
home: '/', about: '/about'
} as const WINDOW FUNCTIONS
type Route = typeof ROUTES[keyof typeof ROUTES] SELECT name,
ROW_NUMBER() OVER (PARTITION BY dept
ORDER BY salary DESC) rn,
AVG(salary) OVER (PARTITION BY dept) avg_sal
FROM employees;
JS JAVASCRIPT INTERVIEW PATTERNS ES2024
MAP / FILTER / REDUCE DEBOUNCE [Link] + ALLSETTLED
const doubled = [Link](x => x * 2) function debounce(fn, ms) { const [a, b, c] = await
const evens = [Link](x => x % 2 === 0) let timer [Link]([fetchA(), fetchB(), fetchC()])
const sum = [Link]((acc, x) => acc + x, 0) return (...args) => { // allSettled — never rejects
// Chained clearTimeout(timer) const results = await
[Link](x => x > 0) timer = setTimeout( [Link]([p1, p2, p3])
.map(x => x * 2) () => [Link](this, args), ms) [Link](r => {
.reduce((a, b) => a + b, 0) } if ([Link] === 'fulfilled') [Link]
DESTRUCTURING + OPTIONAL CHAINING } })
const search = debounce(query, 300) ASYNC ERROR PATTERN
const { a, b, ...rest } = obj
const [first, , third] = arr THROTTLE async function safeRequest(url) {
const merged = { ...obj1, ...obj2 } function throttle(fn, ms) { try {
const clone = [...arr, newItem] let last = 0 const res = await fetch(url)
const city = user?.address?.city return (...args) => { if (![Link])
const name = data ?? 'Default' const now = [Link]() throw new Error(`HTTP ${[Link]}`)
if (now - last >= ms) { return await [Link]()
last = now } catch (err) {
return [Link](this, args) [Link](err)
} return null
} }
} }
FULL STACK INTERVIEW SYNTAX SHEET · For personal use only
FULL STACK INTERVIEW SYNTAX SHEET 03 / 03
■ REFERENCE CARD v2.0 — DSA FAST SYNTAX · DEBUGGING CHECKLIST
∑ DSA FAST SYNTAX JAVASCRIPT
HASHMAP FREQUENCY COUNT BFS (GRAPH / TREE) TIME COMPLEXITY
const freq = new Map() function bfs(root) { O(1) Hash get/set, array index
for (const c of str) const q = [root] O(log n) Binary search, balanced BST
[Link](c, ([Link](c) || 0) + 1) while ([Link]) { O(n) Linear scan, single loop
const node = [Link]() O(n log n)Merge sort, heap sort
// Object approach // process node O(n^2) Nested loops, bubble sort
const map = {} for (const child of [Link]) O(2^n) Backtracking, recursion tree
for (const n of nums) [Link](child) O(n!) Permutations
map[n] = (map[n] || 0) + 1 } QUICK ONE-LINERS
STACK (LIFO) }
// Unique array
const stack = [] DFS (RECURSIVE) const u = [...new Set(arr)]
[Link](val) // add top function dfs(node, seen = new Set()) { // Flatten
[Link]() // remove top if (!node || [Link]([Link])) return [Link](Infinity)
stack[[Link]-1] // peek [Link]([Link]) // Deep clone
// Use: balanced parens, monotonic // process node structuredClone(obj)
QUEUE (FIFO) for (const n of [Link]) // Chunk array
dfs(n, seen) const chunk = (a, n) =>
const queue = []
} [Link]({ length: [Link]([Link]/n) },
[Link](val) // enqueue
BINARY SEARCH (_, i) => [Link](i*n, i*n+n))
[Link]() // dequeue O(n)!
// Sort nums
// Optimal: pointer function binarySearch(arr, target) {
[Link]((a,b) => a - b)
let head = 0 let l = 0, r = [Link] - 1
const item = queue[head++] while (l <= r) { HTTP STATUS CODES
SLIDING WINDOW const mid = (l + r) >> 1 200 OK 201 Created
if (arr[mid] === target) return mid 204 No Content 301 Moved
function maxSubarraySum(arr, k) {
arr[mid] < target ? l = mid+1 : r = mid-1 304 Not Modified 400 Bad Request
let sum = [Link](0,k)
} 401 Unauthorized 403 Forbidden
.reduce((a,b)=>a+b)
return -1 404 Not Found 409 Conflict
let max = sum
} 422 Unprocessable 429 Too Many Reqs
for (let i = k; i < [Link]; i++) {
TWO POINTER 500 Server Error 503 Unavailable
sum += arr[i] - arr[i-k]
max = [Link](max, sum) function twoSum(arr, target) {
} let l = 0, r = [Link] - 1
return max while (l < r) {
} const s = arr[l] + arr[r]
if (s === target) return [l, r]
s < target ? l++ : r--
}
return [] // arr must be sorted!
}
■ DEBUGGING CHECKLIST — SYSTEMATIC APPROACH 12 STEPS
[Link] strategy Log before/after suspect code; log typeof + value, not just value Type mismatch Number vs string; [Link](); parseInt() where needed
Network check DevTools → Network: status code, response body, headers, CORS CORSSet origins on server; OPTIONS preflight; credentials: 'include'
Null/undefined checks Use optional chaining (?.), nullish coalescing (??), guard clauses Auth token Token expired? Refresh flow; format: Authorization: Bearer <token>
Async timing Confirm await present; check Promise chain; verify race conditions DB connection Connection string; whitelist IP in Atlas; schema matches query
State mutation React: never mutate state directly; always return new reference Memory leaks Cleanup useEffect; clear setInterval; cancel fetches on unmount
Env variables .env loaded? NEXT_PUBLIC_ prefix for client; restart server after… Build vs Dev Prod-only bug? Check env vars, minification, SSR hydration mismat…
FULL STACK INTERVIEW SYNTAX SHEET · For personal use only