Full Stack Web Development with AI Integration

Understand what web development is and how the web works, set up the tools you will use every day, and create and open your first web page.

Topics

1. Introduction to web development
2. How the web works
3. Types of web development
4. Core web technologies
5. Development environment setup
6. Your first HTML web page

Understand HTML elements, attributes, element relationships, nesting, and block and inline behaviour, and organise a clean HTML project with working links and images.

Topics

1. Review of HTML basics
2. HTML tags, elements and attributes
3. HTML comments and void elements
4. HTML element relationships
5. Block and inline elements
6. Generic container elements
7. Basic file and folder structure
8. Internal and external links
9. Writing clean HTML
10. Browser practice and debugging
11. Practical project: a personal profile page

Format text with meaningful HTML elements, write special characters correctly, organise information in lists, and present data in clear, accessible tables.

Topics

1. Review of Class 2
2. Headings, paragraphs and whitespace
3. Text-level elements
4. Quotations and contact details
5. HTML entities and special characters
6. Lists
7. Tables
8. Practical project: start the Sylhet Cafe website

Add images, audio, video and embedded content the right way, link within and between pages, and give every page the head information that browsers, search engines and social apps need.

Topics

1. Review of Class 3
2. Images in depth
3. Audio and video
4. Embedding other content
5. Links in depth
6. The head and metadata
7. Practical project: the Sylhet Cafe home page

Understand how a form sends data, and build clear, accessible forms with the right inputs, labels and buttons.

Topics

1. Review of Class 4
2. How forms work
3. Labels
4. Text inputs
5. Buttons
6. Grouping and ordering fields
7. Practical project: the Sylhet Cafe contact page

Give users choices with checkboxes, radio buttons and lists, use special inputs, and let the browser check answers before a form is sent.

Topics

1. Review of Class 5
2. Choices
3. Special inputs
4. Built-in validation
5. Accessible, helpful forms
6. Practical project: the Sylhet Cafe table booking form

Structure pages with semantic HTML so that browsers, search engines and assistive technology understand them, and check pages for accessibility and valid code.

Topics

1. Review of Classes 4 to 6
2. What semantic HTML is
3. Page structure elements
4. Landmarks and the heading outline
5. Accessibility basics
6. Checking your HTML
7. Practical project: make Sylhet Cafe semantic and accessible

Plan and build a complete multi-page website in HTML, check its quality, and get it ready to publish.

Topics

1. Review of Class 7
2. Planning a website
3. Project structure
4. Building the pages
5. Quality checklist
6. Code review in pairs
7. Presenting your work

Use the terminal to move around your computer, track your work with Git, put it on GitHub, and publish your website for free with GitHub Pages.

Topics

1. Review of Class 8
2. Why developers use version control
3. Terminal basics
4. Setting up your tools
5. Your first repository
6. GitHub
7. README files and Markdown
8. GitHub Pages
9. Practical project: publish Sylhet Cafe

Link one stylesheet to every page of Sylhet Cafe, write CSS rules, select exactly the elements you want with type, class, ID, attribute and combinator selectors, and choose colours and units with care.

Topics

1. Review of Class 9
2. What CSS is
3. Linking a stylesheet
4. Rule syntax
5. Type, class and ID selectors
6. Attribute selectors
7. Combinators
8. Colours
9. Units
10. Practical project: a starter stylesheet for Sylhet Cafe

Understand how the cascade decides which declaration wins, calculate specificity like the browser, control inheritance, avoid `!important`, and find the winning rule in seconds with DevTools.

Topics

1. Review of Class 10
2. When rules conflict: the cascade
3. Calculating specificity
4. Inheritance
5. Why to avoid !important
6. DevTools: your CSS detective
7. Debugging a style that does not apply
8. Practical project: debug and clean up the Sylhet Cafe stylesheet

Understand the four layers of every box, make sizes predictable with `box-sizing: border-box`, work with margin collapsing, choose between block, inline and inline-block, and control sizes and overflow.

Topics

1. Review of Class 11
2. The four layers of every box
3. box-sizing
4. Margins and collapsing
5. block, inline and inline-block
6. Width, height, min and max
7. Overflow
8. The box model in DevTools
9. Practical project: spacing and boxes for Sylhet Cafe

Give Sylhet Cafe its own voice with a web font for English and Bangla, a clear type scale, comfortable spacing and line lengths, a hero with a photo and a gradient, and colours that pass a contrast check.

Topics

1. Review of Class 12
2. Font stacks
3. Web fonts with Google Fonts
4. Bangla text and Hind Siliguri
5. Size, weight, line height and spacing
6. Alignment and line length
7. Backgrounds
8. Gradients
9. Colour contrast
10. Practical project: typography and a hero for Sylhet Cafe

Break out of normal flow with the five `position` values, move elements with offsets, control what appears on top with `z-index` and stacking contexts, and centre things in several reliable ways.

Topics

1. Review of Class 13
2. Normal flow and the position property
3. relative and absolute
4. fixed and sticky
5. z-index and stacking contexts
6. Centring techniques
7. Practical project: a sticky header and badges for Sylhet Cafe

Make Sylhet Cafe feel alive with hover and focus styles, zebra stripes and decorative pseudo-elements, tidy every colour into custom properties, and add transitions and animations that respect reduced-motion settings.

Topics

1. Review of Class 14
2. Pseudo-classes for states
3. Pseudo-classes for positions
4. Pseudo-elements
5. Custom properties: a colour system
6. Transitions and transforms
7. Keyframe animations and reduced motion
8. Practical project: a lively, themeable Sylhet Cafe

Turn a parent into a flex container, understand the main and cross axes, place and space items with `justify-content`, `align-items` and `gap`, let them wrap, and build the Sylhet Cafe navigation bar.

Topics

1. Review of Class 15
2. Turning Flexbox on
3. The main axis and the cross axis
4. justify-content: free space on the main axis
5. align-items: the cross axis
6. gap and wrapping
7. Building the Sylhet Cafe navigation bar
8. Inspecting Flexbox in DevTools
9. Practical project: the Sylhet Cafe navigation bar

Control how flex items grow, shrink and start with `flex-grow`, `flex-shrink`, `flex-basis` and the `flex` shorthand, fix content that will not shrink, and build menu cards, a media object and a footer that stays at the bottom.

Topics

1. Review of Class 16
2. How the browser sizes flex items
3. flex-grow: sharing the free space
4. flex-shrink and flex-basis
5. The flex shorthand
6. align-self and order
7. Content that will not shrink
8. Component 1: a row of menu cards
9. Component 2: the media object
10. Component 3: a footer that stays at the bottom
11. Practical project: menu cards, specials and a footer that stays down

Create grids with rows and columns, size tracks with `fr`, `repeat()` and `gap`, place items by line numbers and spans, and build a photo gallery for Sylhet Cafe.

Topics

1. Review of Class 17
2. What CSS Grid is
3. Grid words
4. Columns and the fr unit
5. repeat(), rows and gaps
6. Placing items by lines
7. Seeing the lines in DevTools
8. Building the Sylhet Cafe gallery
9. Practical project: the Sylhet Cafe gallery and specials board

Draw page layouts with named grid areas, build card grids that choose their own number of columns, control the rows the browser adds for you, align items in a grid, and decide when Grid or Flexbox is the right tool.

Topics

1. Review of Class 18
2. Drawing a layout with named areas
3. Responsive cards with auto-fit and minmax()
4. auto-fit or auto-fill?
5. The implicit grid
6. Aligning items in a grid
7. Flexbox or Grid?
8. Practical project: Grid layouts for the Sylhet Cafe home and menu pages

Make the whole Sylhet Cafe site work on every screen: write mobile-first CSS with `min-width` media queries, choose breakpoints from the content, size text with `clamp()`, serve the right image with `srcset`, `sizes` and `picture`, and test on real phones.

Topics

1. Review of Class 19
2. Responsive design and the viewport
3. Mobile-first CSS and media queries
4. Choosing breakpoints
5. Fluid sizes with clamp()
6. Flexible images and srcset
7. The picture element
8. Container queries
9. Testing on every screen
10. Practical project: make Sylhet Cafe responsive

Plan, build, test and deploy a complete responsive landing page for Sylhet Cafe Catering from a written brief, using only semantic HTML and your own mobile-first CSS.

Topics

1. Review of Class 20
2. Working from a brief
3. The sections of the page
4. Project structure and technical rules
5. Testing the page
6. Deploying to GitHub Pages
7. Practical project: the Sylhet Cafe Catering landing page

Understand utility-first CSS, set up Tailwind CSS v4 with the Tailwind CLI, and style the Sylhet Cafe page with spacing, colour, typography, border and shadow utilities, reading every class as the CSS it creates.

Topics

1. Review of Class 21
2. Utility-first CSS
3. Installing Tailwind CSS v4
4. Preflight
5. Spacing utilities
6. Colour utilities
7. Typography utilities
8. Borders, corners and shadows
9. Reading a component
10. Practical project: start Sylhet Cafe in Tailwind CSS

Use Tailwind variants to make pages responsive, style hover and focus states and support dark mode, then give Sylhet Cafe its own design tokens with `@theme` and keep repeated class lists under control.

Topics

1. Review of Class 22
2. Responsive variants
3. State variants
4. Dark mode
5. Design tokens with @theme
6. Reusing patterns
7. Practical project: a responsive, themed Sylhet Cafe page in Tailwind

Rebuild the Sylhet Cafe Catering landing page with Tailwind CSS, build a minified stylesheet and deploy it to GitHub Pages, then compare the hand-written and Tailwind versions with real numbers.

Topics

1. Review of Class 23
2. The job and the technical rules
3. Translating your CSS into utilities
4. Building for production
5. Comparing the two versions
6. Practical project: Sylhet Cafe Catering in Tailwind CSS

Run your first JavaScript programs in the browser console and with Node.js, store values with `const` and `let`, work with strings, numbers, booleans, `null` and `undefined`, check types with `typeof` and build readable text with template literals.

Topics

1. Review of Class 24
2. JavaScript and the browser console
3. Running files with Node.js
4. Variables: const and let
5. Strings
6. Numbers
7. Booleans, null and undefined
8. typeof
9. Template literals
10. Practical project: first programs for Surma View Kitchen

Calculate with arithmetic and assignment operators, compare values safely with `===` and `!==`, combine conditions with logical operators and `??`, and make decisions with `if`, `switch` and the ternary operator to build a bill calculator for Surma View Kitchen.

Topics

1. Review of Class 25
2. Arithmetic operators
3. Assignment operators
4. Comparisons and strict equality
5. Logical operators
6. Truthy and falsy values
7. if, else if and else
8. switch
9. The ternary operator
10. Practical project: a bill calculator for Surma View Kitchen

Repeat code with `for`, `for...of` and `while` loops, steer them with `break` and `continue`, and use the patterns for counting, totals, averages and searches without writing infinite loops.

Topics

1. Review of Class 26
2. The for loop
3. A first look at arrays
4. for...of
5. while
6. break and continue
7. Patterns: counting, totals and searching
8. Avoiding infinite loops
9. Practical project: loops on Surma View Kitchen data

Write functions as declarations and arrow functions, pass values in with parameters, arguments and defaults, get results back with `return`, understand basic scope and pure functions, and split the Surma View Kitchen bill into small functions.

Topics

1. Review of Class 27
2. What a function is and why we use it
3. Declaring and calling functions
4. Returning values
5. Default parameters
6. Arrow functions
7. Scope basics
8. Pure functions and side effects
9. Splitting a problem into small functions
10. Practical project: the Surma View Kitchen bill in small functions

Create, read and change arrays, tell the methods that change an array from those that return something new, and replace hand-written loops with `map`, `filter`, `find`, `some`, `every`, `reduce` and `toSorted`.

Topics

1. Review of Class 28
2. Creating and reading arrays
3. Changing arrays
4. Callbacks and `map`
5. `filter` and `find`
6. `some`, `every` and `reduce`
7. Sorting with `sort` and `toSorted`
8. Chaining methods: a weekly sales report
9. Practical project: a weekly sales report

Group related values in objects, read and change their properties, write methods, use destructuring, spread and rest, work with arrays of objects, and convert data to and from JSON to complete the JavaScript fundamentals module.

Topics

1. Review of Class 29
2. Objects and properties
3. Nested objects and optional chaining
4. Methods
5. Destructuring
6. Spread, rest and references
7. Arrays of objects
8. `Object.keys`, `Object.values` and `Object.entries`
9. JSON
10. Practical project: the Surma View Kitchen menu as data

Understand how block scope, function scope and the scope chain decide which variables code can see, what hoisting means, how closures keep private state and how `this` works in methods, and fix the most common scope bugs.

Topics

1. Review of Class 30
2. Block scope, function scope and the scope chain
3. `var` and function scope
4. Hoisting
5. Closures
6. `this` in methods
7. Common scope bugs
8. Practical project: scope, closures and `this` in `07-01-scope`

Write classes with constructors, methods, getters and private fields, create objects with `new`, reuse and change behaviour with `extends` and `super`, and decide when a class is the right tool and when a plain object is better.

Topics

1. Review of Class 31
2. Classes, constructors and instances
3. Constructors keep objects valid
4. Fields, getters and private fields
5. Inheritance with `extends` and `super`
6. Class or plain object?
7. Common class mistakes
8. Practical project: dishes, a cart and orders in `07-02-classes`

Share code between files with ES modules, load them in the browser and in Node.js, handle errors with `try`, `catch` and `finally`, throw clear errors of your own, and find bugs with breakpoints in DevTools.

Topics

1. Review of Class 32
2. Why modules
3. Named exports and imports
4. Loading modules
5. `try`, `catch` and `finally`
6. Throwing useful errors
7. Debugging with breakpoints
8. Practical project: the Surma View Kitchen code in modules, in `07-03-modules`

Understand the DOM, select elements, change text, classes and attributes safely, create new elements, and render the Surma View Kitchen menu from an array of data.

Topics

1. Review of Class 33
2. The DOM tree
3. Selecting elements
4. Changing text safely
5. Classes, `hidden` and attributes
6. `data-` attributes and `dataset`
7. Creating elements
8. Rendering a list from data
9. Practical project: the Surma View Kitchen menu rendered from data (`surma-view-menu`)

Make the Surma View Kitchen menu respond to people with events: a live search, a booking form read with `FormData`, "Add" buttons handled by event delegation, a cart saved in `localStorage` and a theme toggle that remembers the choice.

Topics

1. Review of Class 34
2. Events and listeners
3. A live search
4. Forms: `submit` and `FormData`
5. Event delegation
6. Saving data with `localStorage`
7. A theme toggle that remembers
8. Practical project: an interactive Surma View Kitchen menu (`surma-view-menu`)

Build and publish a complete JavaScript app, the Surma View Kitchen prep list, drawn from one state object with modules, event delegation, validation, editing in place, keyboard support and `localStorage`.

Topics

1. Review of Class 35
2. The brief and the plan
3. One state object
4. Filters and counts
5. Validation and editing in place
6. Events, saving and publishing
7. Practical project: the Surma View Kitchen prep list (`svk-prep-list`)

Understand why JavaScript runs one thing at a time and how it waits without blocking, follow the event loop, and write asynchronous code with timers, promises, `async` and `await`, and `Promise.all`.

Topics

1. Review of Class 36
2. JavaScript runs one thing at a time
3. Timers
4. The event loop
5. Promises
6. Async functions and await
7. Sequential and parallel work
8. Practical project: async helpers for the Surma View Kitchen

Load and send real data with `fetch`: read REST APIs and their status codes, check every response, send JSON with POST, show loading, error, empty and success states, and understand CORS and why secret keys never go in the browser.

Topics

1. Review of Class 37
2. REST APIs
3. A GET request with fetch
4. Checking responses and timeouts
5. Sending data with POST
6. Loading, error, empty and success states
7. CORS
8. API keys and secrets
9. Practical project: live weather, a booking POST and a place search

Build and deploy Rooftop Weather, a complete app on the free Open-Meteo APIs: plan from real responses, chain two requests, handle every state, and cache results in memory and in `localStorage`.

Topics

1. Review of Class 38
2. Planning with the API
3. Chaining two requests
4. The rooftop advice
5. Caching
6. Recent searches
7. Unhappy paths and deployment
8. Practical project: Rooftop Weather

Work like a professional team: manage packages and scripts with npm, run and build a project with Vite, catch problems with ESLint and format code with Prettier, and change code through branches, pull requests, reviews and resolved merge conflicts.

Topics

1. Review of Class 39
2. package.json and npm
3. npm scripts and Vite
4. ESLint
5. Prettier
6. Branches and pull requests
7. Code review
8. Merge conflicts
9. Practical project: Surma View in Vite, with a team workflow

Use TypeScript to catch bugs before the code runs: annotate functions, let inference type the rest, describe objects with interfaces, model real choices with union and literal types, and narrow values safely with strict mode on.

Topics

1. Review of Class 40
2. Why TypeScript
3. Setting up a TypeScript project
4. Annotations and inference
5. Interfaces and type aliases
6. Union and literal types
7. Narrowing
8. Discriminated unions
9. Strict mode, any and unknown
10. Practical project: the Surma View menu in TypeScript

Write code that works with many types without losing safety, derive new types with utility types, and check data that arrives while the app runs with Zod schemas, from API responses to form fields.

Topics

1. Review of Class 41
2. Generics
3. Utility types
4. Typing functions and API data
5. Zod schemas
6. A typed getJson with Zod
7. Validating a form with Zod
8. Practical project: typed data and a validated booking form

Create a React and TypeScript project with Vite and Tailwind CSS, and build a static Surma View Kitchen home page from small components, following the rules of JSX and passing data with typed props and `children`.

Topics

1. Review of Class 42
2. Why React
3. Creating a React project
4. Components
5. The rules of JSX
6. Props
7. The children prop
8. Splitting a page into components
9. Practical project: the Surma View Kitchen home page

Give components memory with `useState`, respond to clicks with event handlers, update objects and arrays without mutation, and lift the cart state into `App` so the menu cards and the header share it.

Topics

1. Review of Class 43
2. Why a normal variable does not work
3. useState
4. Handling events
5. State is a snapshot
6. Updating objects and arrays
7. Lifting state up
8. Practical project: a working cart for the Surma View menu

Build the Surma View menu from data: render arrays as lists of components with stable keys, show and hide parts of the page with conditions, design helpful empty states, and calculate a filtered menu from minimal state.

Topics

1. Review of Class 44
2. From data to a list
3. Keys
4. Conditional rendering
5. Showing and hiding with state
6. Empty states
7. A filterable menu
8. Practical project: the data-driven Surma View menu

Build the Surma View Kitchen table booking form the React way: control every input with state, handle text inputs, checkboxes, radio buttons, selects and text areas, validate the whole form with Zod, and show accessible errors next to each field.

Topics

1. Review of Class 45
2. Controlled inputs
3. Planning the form and its state
4. Checkboxes, radio buttons, selects and text areas
5. Handling submit
6. Validating with Zod
7. Accessible error messages
8. Practical project: the Surma View Kitchen booking form

Use effects for work that reaches outside React, control when they run with dependencies and cleanup, fetch the Surma View Kitchen menu from JSON files with loading, error and empty states and no race conditions, and recognise code that needs no effect at all.

Topics

1. Review of Class 46
2. What effects are for
3. Dependencies
4. Cleanup
5. The menu as JSON
6. Fetching data in an effect
7. Race conditions
8. You might not need an effect
9. Practical project: the menu from JSON files

Tidy the Surma View Kitchen app with professional patterns: custom hooks for repeated logic, composition with `children` and other JSX props, refs for DOM elements and values that do not affect rendering, and small, well-named components.

Topics

1. Review of Class 47
2. Custom hooks
3. Sharing logic, not state
4. Composition with children
5. Refs
6. Keeping components small
7. Practical project: tidy Surma View Kitchen with hooks and composition

Turn Surma View Kitchen into a real multi-page app with React Router in data mode: give every screen its own URL, share layouts through nested routes, navigate without reloads, read URL and search params, load page data with loaders, and show friendly error pages.

Topics

1. Review of Class 48
2. Every screen gets a URL
3. Installing React Router and defining routes
4. Layouts and Outlet
5. Links and navigation
6. URL params and loaders
7. Search params
8. Error pages
9. Practical project: a multi-page Surma View Kitchen

Tell client state from server state, organise the Surma View Kitchen cart's updates with a reducer and share it through context, and fetch, cache and change server data with TanStack Query.

Topics

1. Review of Class 49
2. Two kinds of state
3. useReducer
4. Context
5. TanStack Query setup
6. Queries and caching
7. Mutations and invalidation
8. Practical project: a shared cart and server data

Bring the React module together: plan the Surma View Kitchen app from a written brief, assemble its routes, state and data into one finished, tested app, and deploy it to Vercel so that every link and refresh works.

Topics

1. Review of Class 50
2. From brief to plan
3. Technical requirements
4. Deploying to Vercel
5. Testing against the acceptance criteria
6. Practical project: the Surma View Kitchen web app

Start rebuilding Surma View Kitchen with Next.js: create an App Router project, turn folders into pages and layouts, link between pages, build dynamic dish pages, and add metadata and optimised images.

Topics

1. Review of Class 51
2. Why Next.js
3. Creating the app
4. Routes from folders
5. Layouts
6. Links
7. Dynamic routes
8. Metadata
9. Optimised images
10. Practical project: start Surma View Kitchen in Next.js

Learn where Next.js code runs and what reaches the browser, choose between Server and Client Components, fetch live data on the server with secrets kept safe, give routes loading and error states, and see how caching makes a route static, dynamic or revalidated.

Topics

1. Review of Class 52
2. Rendering on the server
3. Client Components
4. Fetching data in Server Components
5. Secrets and environment variables
6. Loading and error files
7. Caching basics
8. Practical project: live weather, loading and error states

Send the Surma View Kitchen booking to the server: write a Server Action that validates the form with Zod, show field errors and a pending state with `useActionState`, refresh pages with `revalidatePath` and `redirect`, and build JSON endpoints with route handlers.

Topics

1. Review of Class 53
2. Why the server, and where bookings live
3. Server Actions
4. The form with useActionState
5. Revalidating pages
6. Route handlers
7. Server Action or route handler?
8. Practical project: bookings on the server

Run JavaScript on a server with Node.js: start the Surma View Kitchen API as a project of ES modules, read and write files, load settings from environment variables, write npm scripts and build a first JSON server with `node:http`.

Topics

1. Review of Class 54
2. What Node.js is
3. A project made of ES modules
4. Reading and writing files
5. Environment variables
6. npm scripts
7. A first HTTP server
8. Practical project: the first Surma View Kitchen API

Rebuild the Surma View Kitchen API with Express 5: keep the app separate from the server, write routes and routers, read URL params, query strings and JSON bodies, and control every request with middleware added in the right order.

Topics

1. Review of Class 55
2. Express: the app and the server
3. Routes and routers
4. Params and query strings
5. JSON request bodies
6. Middleware and its order
7. A request logger
8. Practical project: the Surma View Kitchen API in Express

Design the Surma View Kitchen menu and orders resources as a predictable REST API: choose methods, paths and status codes, validate bodies and query strings with Zod 4, and send every error in one JSON shape from a single error handler.

Topics

1. Review of Class 56
2. Resources and methods
3. Status codes that tell the truth
4. One error shape and one error handler
5. Validation with Zod 4
6. A validated dishes resource
7. Practical project: a validated dishes API with consistent errors

Check the Surma View Kitchen API and React app with automated tests that run in seconds: unit tests with Vitest, API tests with Supertest, component tests with React Testing Library, and tests for the unhappy paths where bugs hide.

Topics

1. Review of Class 57
2. Why we test, and the kinds of tests
3. Unit tests with Vitest
4. API tests with Supertest
5. Component tests with React Testing Library
6. Testing the unhappy paths
7. Practical project: tests for the API and the React app

Make the Surma View Kitchen API ready for strangers: accept dish photos with strict limits and a content check, let only listed front ends call it with CORS, validate the configuration for each environment, write useful logs and keep secrets out of code.

Topics

1. Review of Class 58
2. Uploading a dish photo
3. Storing uploads and handling upload errors
4. CORS settings
5. Configuration per environment
6. Logging
7. Keeping secrets out of code
8. Practical project: a safer Surma View Kitchen API

Turn the pieces from the last five classes into a complete, tested and documented REST API for Surma View Kitchen's online pickup orders, and connect the `surma-view-kitchen` React app to it.

Topics

1. Review of Class 59
2. The brief
3. Orders on the server
4. Tests and documentation
5. Connecting the React app
6. Practical project: the Surma View Kitchen orders API

Keep Surma View Kitchen's data in a free hosted PostgreSQL database: design tables with the right column types and constraints, and insert, select, update and delete rows safely with SQL.

Topics

1. Review of Class 60
2. Relational databases
3. A free hosted PostgreSQL database
4. Column types
5. Creating tables with constraints
6. Inserting rows
7. Selecting rows
8. Updating and deleting rows
9. Practical project: the Surma View Kitchen database

Link the Surma View Kitchen tables with foreign keys, answer real questions with joins and `group by`, speed up lookups with indexes, and place an order from Node.js as one transaction with parameterised queries.

Topics

1. Review of Class 61
2. One-to-many: a foreign key
3. Many-to-many: a join table
4. Joins
5. Group by and aggregates
6. Indexes
7. Transactions
8. Queries from Node.js
9. Practical project: relationships, reports and a safe order

Use Prisma ORM 7 with PostgreSQL in the Surma View Kitchen API: describe the data once in `schema.prisma`, change the database with migrations, and write typed queries, nested writes and relation queries that avoid the N+1 problem.

Topics

1. Review of Class 62
2. Why an ORM
3. Setting up Prisma 7
4. Models, relations and enums
5. Migrations
6. The client
7. Typed queries
8. Nested writes and the N+1 problem
9. Practical project: Prisma in the Surma View Kitchen API

Learn how MongoDB stores flexible documents, build a reviews feature for Surma View Kitchen in a separate `surma-view-reviews` project with Mongoose schemas, validation and safe queries, and choose between SQL and NoSQL for a project.

Topics

1. Review of Class 63
2. Documents and collections
3. Connecting with Mongoose
4. Embed or reference?
5. Schemas, models and validation
6. Queries
7. Keeping queries safe
8. SQL or NoSQL?
9. Practical project: a reviews feature with MongoDB

Replace the in-memory arrays of the Surma View Kitchen API with Prisma and PostgreSQL without changing its contract, turn database errors into the right status codes, place orders inside a transaction and seed the same sample data for every developer.

Topics

1. Review of Class 64
2. The API moves to TypeScript
3. Replacing in-memory data
4. Not-found and conflict errors
5. Transactions for orders
6. Seeding sample data
7. Practical project: the Surma View Kitchen API on PostgreSQL

Put Surma View Kitchen online as a real full-stack app, with the React app on Vercel, the Express API on Render and PostgreSQL on Neon, all on free plans, then prove the whole flow works with a smoke test and real phones.

Topics

1. Review of Class 65
2. The architecture
3. The production database
4. The API on Render
5. The React app on Vercel and CORS
6. Testing the live system
7. Known issues and documentation
8. Practical project: Surma View Kitchen, live

Give Surma View Kitchen sign-up, sign-in and sign-out with passwords hashed by argon2 and a short-lived JWT in a secure cookie, and protect routes so that "my orders" is a page only its owner can see.

Topics

1. Review of Class 66
2. Authentication and password hashing
3. Sessions or JWTs
4. Secure cookie flags
5. Sign-up, sign-in and sign-out
6. Protecting routes
7. Cookies need one site
8. Practical project: sign-in for Surma View Kitchen

Decide on the server what each user may do with role and ownership checks, learn the OWASP Top 10 and the main defence for each risk, and protect the Surma View Kitchen API against XSS, CSRF, SQL injection and password guessing, then attack it to prove the defences work.

Topics

1. Review of Class 67
2. Authorization: deny by default
3. Ownership checks
4. The OWASP Top 10
5. XSS: cross-site scripting
6. CSRF: cross-site request forgery
7. SQL injection
8. What CORS does not protect
9. Rate limiting, security headers and dependencies
10. Practical project: secure the Surma View Kitchen API

Take payments safely by following the flow every gateway shares: start a payment on the server, verify it with the gateway, and mark the order paid exactly once, with SSLCommerz, bKash and Stripe, all in sandbox mode.

Topics

1. Review of Class 68
2. The common payment flow
3. One payment attempt, paid exactly once
4. SSLCommerz
5. bKash tokenized checkout
6. Stripe Checkout and webhooks
7. Practical project: sandbox payments for Surma View Kitchen

Turn the `surma-view-next` capstone into a full-stack Next.js app with one shared Prisma client, session and ownership checks inside every Server Action, and a menu assistant that streams answers from the OpenAI API under firm limits on cost and abuse.

Topics

1. Review of Class 69
2. One Prisma client in Next.js
3. Server Actions with authentication checks
4. The OpenAI API from the server
5. Streaming to the browser
6. Limits on cost and abuse
7. Practical project: the full-stack capstone with an AI assistant

Release the capstone like a real product: deploy it to Vercel with its environment variables and production migrations, check every push with a GitHub Actions workflow, protect `main`, and package the Surma View Kitchen Express API as a small, safe Docker image.

Topics

1. Review of Class 70
2. Deploying to Vercel
3. Migrations in production
4. CI with GitHub Actions
5. A Docker image for the Node.js API
6. Building, running and checking the image
7. Practical project: release the capstone

Run a final release check on the live capstone, present it in a clear five-minute demo, give and receive useful feedback, and leave the course with a portfolio, a CV, a GitHub profile and a plan to keep learning.

Topics

1. Review of Class 71
2. Final checks
3. The five-minute demo
4. Your portfolio, CV and GitHub profile
5. Keep learning
6. Practical project: demo day