Explore By Video

A Simple Router

Time to give our app some direction—literally! In this video, we introduce a simple but powerful router to handle page requests with clarity and control. 🧭

Here’s what we’ll build:
• Refactor pages into controller classes:
• app/Http/AboutController.php
• app/Http/UploadController.php
• app/Http/PhotoController.php 📂
• Set up Composer PSR-4 autoloading for the App\\ namespace ⚙️
• Build routing logic in index.php, then move it to app/routes.php and eventually into globals.php for reuse 🔁

By the end, our app will be running on a clean routing system—flexible, readable, and easy to extend. Welcome to version v6-create-simple-router. This is where things start to feel real. 🚀

Abstract Classes and Methods

In this video, we tackle the code smell of duplicate code and refactor it into a clean, efficient abstract base class! 🏗️💡 You’ll see firsthand how abstract classes and methods help streamline your PHP projects by promoting reusability and maintainability.

🔍 Here’s what we cover:
✅ Identifying and fixing duplicate code 🤢
✅ Calling the parent constructor for seamless inheritance 🏗️
✅ Changing private properties to protected for better access 🔓
✅ Overriding methods to add custom functionality 🎨

By the end, you’ll have a solid understanding of abstract classes and how they can level up your object-oriented PHP skills! 🚀🔥

💻 Watch now and clean up that messy code! 🎬

Ajax Requests - Historical Context

Before fetch() became the go-to for making network requests, developers had to rely on XMLHttpRequest (XHR) — and later, jQuery’s $.ajax() — to bring data into web pages dynamically.

In this video, we’ll explore:

- The basics of making a request with XMLHttpRequest 🏗️
- How jQuery simplified AJAX calls 📦
- The key differences between XHR and Fetch
- Why modern JavaScript has left XHR behind in favor of cleaner, promise-based APIs ✨

Understanding this history will give you context for legacy codebases 👴 and help you appreciate just how much easier today’s tools make things.

👉 Watch now and see how far we’ve come with AJAX and Fetch! 🚀

Arrays - Working with Lists

Say hello to one of the most useful tools in JavaScript: arrays! In this episode, you’ll learn how to store, access, and manipulate ordered lists of data — like a list of fruits, numbers, or even mixed types. 🧺🔢

🎯 Here’s what you’ll explore:
• What arrays are and why they’re so powerful
• How to create, access, and update array elements
• Common methods like .push(), .pop(), .shift(), .unshift(), .length, and .indexOf() that help you manage your data with ease

🎥 Visual Walkthroughs:
• Real-time examples you can follow and modify on your own
• See arrays grow, shrink, and change as you manipulate them step by step
• Understand how arrays help avoid repetitive code and keep things organized

By the end, you’ll be looping through lists and managing data like a pro, ready to build smarter, more dynamic programs! ⚙️💡

Arrays & Associative Arrays

In this video from the PHP for Beginners series, we dive into arrays—one of the most essential data structures in PHP! You’ll learn about string arrays, numeric arrays, and mixed arrays, along with practical ways to output them using implode() and json_encode(). We’ll also explore how to loop through arrays with foreach, making it easy to process data efficiently.

Next, we move on to associative arrays and multidimensional arrays, perfect for storing structured data. You’ll see how to access and manipulate complex datasets in PHP with ease. By the end of this lesson, you’ll have a solid grasp of how arrays work and how to use them effectively in your projects!

🔹 Perfect for beginners!
🔹 Hands-on examples included.

🚀 Start coding with PHP arrays today!

Auth & Application Workflow

🛠️ Session Enhancements
- Add guest() and user() methods to the Session class
- guest() → returns true if no user is logged in
- user() → returns current user object (or null)

🎨 Navigation Improvements
- Update the top navigation bar to reflect authentication state:
- Show Register / Login links when user is not logged in
- Show user avatar and menu when logged in
- Fix any related JavaScript issues

👤 Gravatar Integration
- Create a new helper class: app/Code/Gravatar.php
- Use the user’s email to generate their avatar
- Display avatar in the nav for logged-in users

🖼️ Conditional Upload View
- Modify the upload page to only display the upload form if the user is logged in

📌 And that ties up the loose ends, landing us at v24-authentication-loose-ends.

Auth using Fortify & Breeze

In this video, we bring Laravel’s authentication system to life by pairing Fortify’s backend features with Breeze’s simple, clean Blade views. This creates a complete, customizable starter kit without the complexity of Inertia or Livewire.

You’ll learn how these two tools fit together and how to leverage them to build real-world authentication flows.

🔥 What You’ll Learn
- How Breeze and Fortify work together
- Review of all Fortify routes and features
- Registration and login flows
- Email verification
- Password reset workflow
- Updating profile information
- Changing passwords
- Session handling and protections
- How this setup fits into the bigger picture of building your app


#Laravel #LaravelFortify #LaravelBreeze #Authentication #WebDevelopment #PHP #FullStack #LaravelTutorial #LearnLaravel #TekCasts #LaravelThePragmaticWay

Authentication Basics

You’ve built forms, handled sessions, and flashed messages — now it’s time to add user authentication like a real web application 💪

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

🧩 Create a login form and validate user credentials
🔑 Use bcrypt for secure password hashing
🧠 Store authenticated state in your existing session manager
🚪 Implement login, logout, and access control routes
🌐 Update views to reflect authenticated users

By the end, your JavaScript server won’t just remember users — it’ll recognize them 🧠💻

💡 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

Current series:
- JavaScript on the Server: https://tekcasts.com/play/javascript-on-the-server

Libraries mentioned:
- bcrypt: https://www.npmjs.com/package/bcrypt
- Node.js http: https://nodejs.org/api/http.html
- Node.js crypto: https://nodejs.org/api/crypto.html

Automating Builds with GitHub Actions

Let’s automate our workflow! ⚡ In this final video, we’ll set up a GitHub Actions workflow to automate testing and building our PHP package whenever changes are pushed.

📌 What you’ll learn:
✅ Setting up GitHub Actions for your package
✅ Automating testing and builds
✅ Ensuring your package is always production-ready

🎉 This wraps up our PHP Package Development series—thanks for watching! Don’t forget to like, comment, and subscribe for more!

🔗 Resources:
• GitHub Actions Docs

Blade / Twig Style Templates

In this video, we upgrade our templating engine to support Blade-style syntax, bringing a more expressive and readable feel to our views. Here’s what we did:

Enhanced the View class to support:
- Escaped output: {{ $user->name }}
- Raw output: {!! $user->name !!}

Updated all relevant views to use the new shorthand syntax for cleaner templates.
- 🛠️ Fixed a display issue in photo.show where old_rating wasn’t mapping correctly (it was showing a 4 instead of the correct 1).

✨ With this little dose of syntax sugar, we land at v27-blade-envy — giving our views a modern touch without bringing in a full framework.

Blade Components

In this episode, we take Blade templating to the next level by introducing Blade Components — Laravel’s elegant way to build reusable UI elements. You’ll learn how to structure your views into flexible, maintainable pieces that encapsulate both presentation and logic.

🧩 What You’ll Learn
- What Blade components are and why they matter
- The difference between Class-Based and Anonymous components
- How to pass data and props to components
- How to use slots for flexible, nested layouts
- Refactoring survey question elements into Blade components

🔗 Related Resources
- Laravel Blade Components Docs: https://laravel.com/docs/12.x/blade#components
- Laravel Anonymous Components Docs: https://laravel.com/docs/12.x/blade#anonymous-components

Previous Video: Blade Templates — Layouts & Partials → https://tekcasts.com/play/laravel-the-pragmatic-way-blade-templates-partials-layouts

📺 Up Next: Question Data Model — we’ll design the database layer to define and manage survey questions dynamically.

Blade Templates, Partials, & Layouts

In this episode, we introduce Blade, Laravel’s powerful templating engine.
You’ll learn how Blade compiles templates, uses partials and layouts, and organizes your view structure for clean, maintainable code.

🧩 What You’ll Learn

- How Blade templates work under the hood
- Using partials to eliminate repetitive code
- Setting up layouts with @yield and @section
- Managing shared scripts with @stack and @push
- Preparing for reusable Blade components

🔗 Related Resources
- Laravel Blade Docs: https://laravel.com/docs/12.x/blade
- Laravel Views Docs: https://laravel.com/docs/12.x/views
- Previous Video: Laravel Installation → https://tekcasts.com/play/laravel-the-pragmatic-way-larvel-installation

Browser Runtime Environment

Kick off the JavaScript in the Browser series with a deep dive into how the browser actually works 🖥️✨.

In this video, we’ll:


🌳 Unpack the DOM — the tree of nodes that brings your HTML to life
🎨 Explore how HTML, CSS, and JavaScript all connect through the DOM
📄 Meet the powerful document object — your entry point to everything on the page
🪟 Understand the difference between the DOM and the BOM (Browser Object Model)
🔍 Learn how to inspect and manipulate the DOM using dev tools like a pro


We’ll also set the stage for the whole series: 👉 introducing the GitHub repo 📂, how the skeleton code works, and what tools we’ll be using (WebStorm + Chrome).

⚡ By the end, you’ll see the web in a whole new way and be ready to start bending the browser to your will!

Building a Minimal MVC Application

In this episode, we take our server-side JavaScript app to the next level by introducing a minimal MVC (Model-View-Controller) structure.

You’ll learn how to organize your code so that:

- Models manage your data and logic
- Views handle presentation using EJS templates
- Controllers direct traffic and keep your routes clean

This structured approach transforms your growing project into something that feels modular, scalable, and professional — all without frameworks.


💡 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


Official Docs & Resources:
- EJS Docs: https://ejs.co/
- Node.js Documentation: https://nodejs.org/en/docs/
- MDN JavaScript Guide: https://developer.mozilla.org/en-US/docs/Web/JavaScript
- MVC Pattern (MDN): https://developer.mozilla.org/en-US/docs/Glossary/MVC

Building a Small Project

🎉 Time to put it all together!

In this video, we move beyond individual concepts and build a complete mini-project: a Stock Picker application. Step by step, you’ll see how to transform raw ideas into a structured, working frontend app.

Here’s what we’ll cover:
1️⃣ Connecting to a Stock API (with mock data for testing)
2️⃣ Designing a clean Stock Data Model
3️⃣ Building a Stock Fetcher with user input + button
4️⃣ Rendering a Stock Table with rows and remove actions
5️⃣ Adding persistence so stocks are saved between sessions

💡 After each step, we’ll pause for a quick refactor, reinforcing maintainability and readability—so you’re not just building code, but building good code.

By the end, you’ll have a working app and a repeatable process for taking an idea from start → structure → polish.