Explore By Video

Database Connections / Migrations

Let’s connect our app to the real world of data! In this video, we build a reliable and secure database layer and run our first migrations and seed scripts. This step sets the stage for persistent data handling in our application. 🧱

Here’s what we cover:
• Temporarily hijack index.php for local development and testing purposes 🔧
• Add database/migrate.sql and database/seed.sql to define and populate our schema 🧬
• Use file_get_contents() to load SQL scripts and run them using PDO 🎯
• Define connection settings: host, port, database name, user, and password (with Docker-friendly defaults) 🐳
• Set up secure PDO options for error handling and safe queries 🔐
• Wrap everything in a try/catch to safely execute migrations and seeding 🚨
• Introduce our app’s database structure:
• users – for login info 👤
• photos – uploaded images 📸
• reviews – ratings and comments ⭐📝
• Protect sensitive credentials by moving them into a .env file 🛡️
• Create a Framework/Env.php class to access environment variables cleanly 🌱

By the end of this video, version v11-db-basics will bring real data into play—securely, cleanly, and pragmatically. 🚀

Database Infrastructure

Let’s encapsulate our database logic the pragmatic way! In this video, we refactor our raw database code into a dedicated Database class, making connections and queries more reusable, readable, and testable. 🛠️

Here’s what we’ll do:


Create a Framework/Database class that accepts config parameters in the constructor ⚙️
Expose an exec() method for executing raw SQL 🧾
Add a static instance for quick access to a shared connection 🌐
Introduce helper methods: first() to fetch a single record & all() to fetch multiple records
Write a simple query to fetch a photo by ID and pass it into the view dynamically 📸
Update the View class to properly render passed variables inside templates
Introduce a private render_template() method to handle this cleanly 🧩


By the end of this refactor, we’ll be on version v12-db-encapsulation—with database access that’s clean, powerful, and built to scale. 🚀

Database Model Abstractions

In this video, we take a big step toward cleaner, more maintainable code by introducing a Model abstraction layer—a pattern that reduces boilerplate and centralizes logic around database operations. This lands in version v20-db-models.

Here’s what gets done:

✅ Create a Models/Photo class
- Move the all() and find() logic out of PhotoController and into this model

✅ Create a Models/Review class
- Same deal: centralize data logic away from controllers
- Introduce a protected static ?string $table property

🧱 Extract shared logic into a Framework/Model base class:
- static table() throws by default—models must define their own table
- Implement reusable all() and find() methods

🔄 Refactor all() and find() with:
- static::query() → creates an instance of the model
- get() → used by all(), calls build_query() to prepare the SQL and params
- build_query() → generates the SQL from query state

🧠 Reimagine find() usage like this:
- static::query()->where('id', '=', $id)->first();
- Then implement:
- A where() method that collects conditions into $wheres
- Modify build_query() to handle WHERE clauses
- A first() method to return the first matching result

🚀 Refactor the PhotoController to use the new model APIs
- Add an insert() method on the base Model class for creating new records


By the end of this refactor, your models are smart, reusable, and expressive—freeing your controllers from repetitive SQL and focusing them on application logic. Pragmatic PHP is feeling pretty elegant right about now. 👌

Defining and Calling Functions

In this episode, you’ll unlock the power of functions — reusable blocks of code that let you organize your logic, avoid repetition, and keep your programs clean and efficient. 🧼✨

🎯 Here’s what we’ll cover:
• What a function really is and why it’s a cornerstone of any serious JavaScript developer’s toolkit.
• The difference between function declarations and function expressions, and when to use each.
• A first look at sleek, modern arrow functions introduced in ES6 — cleaner syntax with powerful flexibility.

🎥 Visual Walkthroughs:
• See each style written and called step-by-step.
• Watch how functions help break your code into logical pieces.
• Reinforce learning through quick, practical examples you can follow along with.

By the end, you’ll have multiple tools to define and invoke your own functions — and you’ll know which style fits your coding vibe best! 🧑‍💻🚀

Deployment Basics

Your Node.js journey is about to go live 🌐🚀

You’ve built, refactored, and refined — now it’s time to deploy your application to the real world!
In this episode, we’ll walk through the key steps and best practices for running your Node.js app in production.

👉 In this episode, you’ll learn how to:

⚙️ Configure your app for different environments
📊 Manage logs and monitor performance
🧱 Handle errors gracefully in production
🌱 Use environment variables for configuration
🌀 Keep your app running with process managers like PM2

By the end, you’ll understand what it takes to make your Node.js app not just work — but thrive in production 💪

💡 Relevant Links

Previous TekCasts series:
- JavaScript for Beginners: https://tekcasts.com/play/javascript-for-beginners-what-is-javascript
- JavaScript in the Browser: https://tekcasts.com/play/javascript-in-the-browser-browser-runtime-environment

Libraries & Tools mentioned:
- PM2 Process Manager: https://pm2.keymetrics.io/
- Node.js Documentation: https://nodejs.org/en/docs/
- dotenv: https://www.npmjs.com/package/dotenv

Destructuring & Spread Syntax

Tired of writing extra lines just to pull out values or merge data? In this episode, you’ll learn two super-handy JavaScript features — destructuring and spread syntax — that make your code cleaner, shorter, and easier to read.

🎯 What you’ll learn:

Array destructuring — extract values directly into variables, skip items, and set default values.
Object destructuring — grab properties by name, rename them, and give them defaults.
Spread syntax — copy, merge, and expand arrays or objects with ease, plus collect the “rest” of the values.


💡 Why it matters:
These techniques are used constantly in modern JavaScript — especially in frameworks like React — so mastering them now will make your future projects smoother and more efficient.

By the end of this episode, you’ll be able to take apart and recombine data like a pro. 🚀

Development Environment

Before diving into PHP, we need to set up a solid development environment—the pragmatic way. ⚙️

In this video, we’ll walk through cloning the starter HTML version of our app, laying the groundwork for everything we’ll build together. This version is clean, organized, and perfect for transitioning into dynamic PHP. 🧱

We’ll also introduce the application starter kit that powers this series:
🔗 https://github.com/rcravens/kit
This kit streamlines development with useful tools and structure that we’ll build on throughout the project.

Our project lives here:
🔗 https://github.com/rcravens/rate_this_pic.git
Be sure to check out the v1-static-html tag to follow along with this video.

Let’s get your environment ready so you can build with confidence! 🚀

Displaying Reviews

Let’s bring feedback into the spotlight! In this video, we enhance the photo detail page by fetching and displaying user reviews from the database. 💬

Here’s what we’ll cover:


Query the database for all reviews associated with a given photo 📄
Loop through the reviews and display them on the photo page 🎞️
Calculate a summary (like average stars or total reviews) 📊
Display the summary alongside the photo for quick insight 🧠


By the end, version v15-show-reviews adds real voices to each photo—making the app feel more alive and interactive. 🚀

Dynamic Navigation

Now that we’ve extracted layout components, it’s time to make them truly dynamic! In this video, we’ll wire things up so our layout reacts intelligently to the current page. ⚡

Here’s what we’ll tackle:
• Use a $page_header variable in _header.view.php to set page-specific titles 🏷️
• Introduce a helpful dd() (dump and die) debugging function and place it in app/globals.php 🛠️
• Refactor _nav.view.php to highlight the active page using $_SERVER['REQUEST_URI'] 🎯

With these changes, our navigation becomes context-aware and our layout system becomes fully functional. This version is tagged as v4-functional-layout—a polished step forward! 🚀

Dynamic Photo Gallery

Time to showcase our images! In this video, we build a photo gallery page that lists all uploaded photos and links each one to its detailed view. 🧱

Here’s what we’ll do:


Create a new show.view.php by copying and modifying index.view.php 🧬
Add a new route and controller method to handle the gallery page 🗺️
Display all photos in a clean list or grid, each with a clickable link to its detailed photo page 🔗


With version v14-photos-list, our app now lets users browse through all uploaded images—laying the foundation for interactivity and exploration. 🚀

Dynamic Photo Page

Let’s make our photo pages come alive! In this video, we turn the static photo view into a fully dynamic experience by using the $_GET superglobal to load data based on query parameters. 🔍

Here’s what we tackle:


Update the PhotoController to read the id from $_GET and query the database accordingly
Show a 404 error if the id is missing or the record isn’t found 🛑
Improve our error views (404 and 500) by rendering them within the layout for a consistent look 🎨
Refactor the View class to default to the main layout (layout.app) while still allowing overrides
Fix a potential infinite render loop in the layout logic 🐛
Clean up unnecessary calls to ->layout() by relying on the new default behavior 🧼


By the end, version v13-photo-query-param will serve up the right photo with the right layout—dynamically and elegantly. 🚀

Encapsulation: Public & Private

Ready to lock down your PHP skills? 🚀 In this video, we crack open Encapsulation—a core OOP concept that keeps your code secure, organized, and powerful! 🔐

I’ll break down what encapsulation is and why it matters, then dive into real-world examples. You’ll see how getters and setters help you access private properties safely, while letting you enforce business logic behind the scenes 🕵️‍♂️.

By the end, you’ll be writing cleaner, safer, and smarter PHP code like a pro! ⚡💻

Error Handling

Even the best-written code can run into unexpected situations — and that’s where error handling comes in. In this episode, you’ll learn how to make your programs more reliable by anticipating problems and handling them gracefully.

� What you’ll learn:
- Why handle errors? The importance of defensive programming.
- try, catch, finally — how to catch problems without crashing your program.
- Throwing custom errors when you detect something invalid.
- Practical example with input validation (like stopping someone from dividing by zero).


� Why it matters:
Professional developers don’t just write code that works — they write code that fails gracefully. Error handling is what separates quick scripts from robust applications.

By the end of this episode, you’ll know how to protect your code against the unexpected — and keep your users from seeing cryptic crashes. �

Error Handling in the UI

🚨 Errors happen—but how you handle them makes all the difference!

In this episode of TekCasts, we dive into Error Handling in the UI so your apps don’t just crash and burn 💥 but instead fail gracefully ✨.

Here’s what we’ll cover:
⚡ try…catch…finally – the building blocks of error handling
⏳ Async errors with async/await (and why you should never just throw inside a promise)
🛡️ Graceful degradation – fallback messages & backup UI
👩‍💻 Turning scary red stack traces into friendly user messages (“Could not load data, please try again.”)
🌐 Real-world demo: handling fetch failures in the browser

By the end, you’ll know how to keep users confident and your app resilient—even when things go wrong. 🚀

ES6 Classes

JavaScript leveled up with ES6, giving us a much cleaner, more intuitive way to write object-oriented code: the class keyword. ✨ In this episode, we’ll modernize our approach and see how classes make our code easier to read and maintain—while still being built on prototypes behind the scenes.

Here’s what we’ll cover:

🆕 Introducing the class keyword and why it’s a game-changer.
🏗 Defining constructors, properties, and methods with sleek new syntax.
🐾 Creating instances and bringing our objects to life.
🔎 A peek under the hood—how classes are really just a friendlier way to work with prototypes.


By the end, you’ll be comfortable building your own classes and ready to wield this modern syntax like a pro. 🚀