Back Button Frameworks
Do You React?

Do You React?

While Laracasts is dedicated to PHP and Laravel, the reality is that most of us need to write JavaScript daily as well. In this series, we'll learn about React - not the PHP version, but the JavaScript library, from the folks at Facebook. I think you'll love it!

Advanced
10 episodes
1h 25m
10
Latest Episode in This Series

Added 4 years ago

The React Chrome Extension

In this short episode, we'll review the support service, "Helpful", that Laracasts uses to see a real-life...

Watch
Do You React?

Do You React?

While Laracasts is dedicated to PHP and Laravel, the reality is that most of us need to write JavaScript daily as well. In this series, we'll learn about React - not the PHP version, but the JavaScript library, from the folks at Facebook. I think you'll love it!

Begin
10
Latest Episode in This Series

Added 4 years ago

The React Chrome Extension

In this short episode, we'll review the support service, "Helpful", that Laracasts uses to see a real-life...
Watch

Your Teacher | Jeffrey Way

https://laracasts.s3.amazonaws.com/avatars/jeffrey-avatar.jpg's avatar
Hi, I'm Jeffrey. I'm the creator of Laracasts and spend most of my days building the site and thinking of new ways to teach confusing concepts. I live in Orlando, Florida with my wife and two kids.
    1. Free Episode Run Time 5:10

      Before we start learning, give me a few moments to demonstrate how natural and intuitive React really is.

    2. Free Episode Run Time 4:31

      Now that you've had a short teaser, let's hit the brakes and start from scratch. We'll pull in React, and build the obligatory "Hello World" component.

    3. Free Episode Run Time 3:20

      You'll likely need to pass data into your various components. We do so with "props." I'll show you.

    4. Free Episode Run Time 3:30

      Let's take a short break, and figure out how we can take our inline React code, and transition that to a dedicated external script. In the process, we'll discuss some options for quickly booting up a server.

    5. Free Episode Run Time 10:35

      Let's return to that simple idea of a counter, and reproduce it with basic jQuery. As we'll find, the process is deceptively simple. Sure, it's fewer lines, but if you're not careful, you'll end up with a massive application.js file, full of countless DOM queries.

    6. Free Episode Run Time 11:29

      Before we move up to some higher level concepts, let's take the next two videos to build little toy projects to ease into the flow of using React.

      View the source for this lesson on GitHub.

    7. Run Time 17:20

      For our next demo project, let's create a simple app that allows a person to type in a GitHub username, and then see a link to that user's most recent Gist. This will give us the opportunity to review a few new important concepts.

    8. Already, we have three script tags for our components. In a real-life application, this could easily become dozens of scripts. Clearly, that's not the way to go. Instead, we'll leverage both Browserify and Gulp.

      Review the Gulp sourcefiles for this episode on GitHub.

    9. Run Time 16:04

      Refs offer us a way to reference and access components in our applications.

    10. In this short episode, we'll review the support service, "Helpful", that Laracasts uses to see a real-life example of React components at work. In the process, we'll learn about Chrome's React extension.