CF

Laravel with React JS - Build Twitter Like Real Time Web App

4h 56m 37s
English
Paid

Discover the power of combining React Js with Laravel to create dynamic and interactive web applications. In this course, you'll learn to build a Twitter-like real-time web app while delving into Modern JavaScript and React Js from the ground up. Ready to take your development skills to the next level? Dive in and start your journey!

Course Overview

Key Topics Covered

  • Core Modern JavaScript/EcmaScript basics
  • React Js fundamentals
  • Ajax with axios for asynchronous requests
  • Theoretical and practical explanations
  • Integration of React with Laravel for seamless development
  • Adding real-time functionality using Laravel Echo and Pusher Js
  • Implementing follow/unfollow functionality
  • Utilizing BelongsToMany relationships
  • Working with custom database tables
  • Leveraging Accessors methods and more

Learning Outcomes

  • Master Modern JavaScript/EcmaScript
  • Gain proficiency in React Js
  • Learn to integrate Laravel with React Js to build modern web applications
  • Start creating reusable React Components
  • Make Ajax GET and POST requests from a React frontend to a Laravel backend
  • Integrate real-time features by broadcasting events using Pusher Js and Laravel Echo
  • Advance to intermediate Laravel techniques
  • Explore React Js as an alternative or complement to Vue Js

Project You Will Build

By the end of this course, you will build a Twitter-like real-time web app featuring follow/unfollow functionality using Laravel as the backend and React Js as the frontend.

About the Author: Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

Watch Online 46 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 46 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Modern JavaScript
All Course Lessons (46)
#Lesson TitleDurationAccess
1
Modern JavaScript Demo
01:54
2
Creating variables using const
04:06
3
Creating variables using let
03:48
4
Template strings
05:10
5
Default parameters
03:25
6
Arrow functions
05:58
7
Arrow function and this keyword
10:11
8
Destructuring object
08:14
9
Destructuring an array
02:09
10
Restructuring
04:57
11
Spread and rest operator
07:32
12
Classes constructor and super
14:23
13
Installing react
05:24
14
React files and folders introduction
06:23
15
Storing data in component state via ajax call
10:59
16
Rendering state data using map
05:48
17
Conditional rendering
04:18
18
Imports exports props
09:36
19
Handling click events
07:40
20
Destructuring inline styling and keys
04:24
21
Installing Laravel and database setup
06:06
22
Implement username
06:20
23
Route group, controllers and views
07:05
24
React js scafffolding
07:33
25
Create form in react component
03:40
26
Post model, migration and relationships
05:29
27
Handling form events in react
07:16
28
Make a post request to laravel backend
05:32
29
Create post and response json
05:50
30
Show the tweets in timeline
11:54
31
Merging tweets in the state and render
02:56
32
Render tweets
02:58
33
User avatar
05:47
34
User profile
08:39
35
Follow functionality
08:42
36
Show follow or unfollow
03:18
37
Implement follow functionality
06:48
38
Implement unfollow functionality
03:19
39
Showing the list of following
05:53
40
Showing the list of followers
04:58
41
Json response of posts
11:05
42
Loading component
05:36
43
Making it real time using setInterval
07:21
44
Real time setup with pusher and laravel echo
05:16
45
Event Broadcasting for real time updates
11:34
46
Real time posts to specific user based on following
09:23
Unlock unlimited learning

Get instant access to all 45 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Course content

46 lessons · 4h 56m 37s
Show all 46 lessons
  1. 1 Modern JavaScript 01:54
  2. 2 Creating variables using const 04:06
  3. 3 Creating variables using let 03:48
  4. 4 Template strings 05:10
  5. 5 Default parameters 03:25
  6. 6 Arrow functions 05:58
  7. 7 Arrow function and this keyword 10:11
  8. 8 Destructuring object 08:14
  9. 9 Destructuring an array 02:09
  10. 10 Restructuring 04:57
  11. 11 Spread and rest operator 07:32
  12. 12 Classes constructor and super 14:23
  13. 13 Installing react 05:24
  14. 14 React files and folders introduction 06:23
  15. 15 Storing data in component state via ajax call 10:59
  16. 16 Rendering state data using map 05:48
  17. 17 Conditional rendering 04:18
  18. 18 Imports exports props 09:36
  19. 19 Handling click events 07:40
  20. 20 Destructuring inline styling and keys 04:24
  21. 21 Installing Laravel and database setup 06:06
  22. 22 Implement username 06:20
  23. 23 Route group, controllers and views 07:05
  24. 24 React js scafffolding 07:33
  25. 25 Create form in react component 03:40
  26. 26 Post model, migration and relationships 05:29
  27. 27 Handling form events in react 07:16
  28. 28 Make a post request to laravel backend 05:32
  29. 29 Create post and response json 05:50
  30. 30 Show the tweets in timeline 11:54
  31. 31 Merging tweets in the state and render 02:56
  32. 32 Render tweets 02:58
  33. 33 User avatar 05:47
  34. 34 User profile 08:39
  35. 35 Follow functionality 08:42
  36. 36 Show follow or unfollow 03:18
  37. 37 Implement follow functionality 06:48
  38. 38 Implement unfollow functionality 03:19
  39. 39 Showing the list of following 05:53
  40. 40 Showing the list of followers 04:58
  41. 41 Json response of posts 11:05
  42. 42 Loading component 05:36
  43. 43 Making it real time using setInterval 07:21
  44. 44 Real time setup with pusher and laravel echo 05:16
  45. 45 Event Broadcasting for real time updates 11:34
  46. 46 Real time posts to specific user based on following 09:23

Related courses

Frequently asked questions

What is Laravel with React JS - Build Twitter Like Real Time Web App about?
Discover the power of combining React Js with Laravel to create dynamic and interactive web applications. In this course, you'll learn to build a Twitter-like real-time web app while delving into Modern JavaScript and React Js from the…
Who teaches Laravel with React JS - Build Twitter Like Real Time Web App?
Laravel with React JS - Build Twitter Like Real Time Web App is taught by Udemy. You can find more courses by this instructor on the corresponding source page.
How long is Laravel with React JS - Build Twitter Like Real Time Web App?
Laravel with React JS - Build Twitter Like Real Time Web App contains 46 lessons with a total runtime of 4 hours 56 minutes. All lessons are available to watch online at your own pace.
Is Laravel with React JS - Build Twitter Like Real Time Web App free to watch?
Laravel with React JS - Build Twitter Like Real Time Web App is part of CourseFlix's premium catalog. A CourseFlix subscription unlocks the full video player; the course description, table of contents, and preview information are available to everyone.
Where can I watch Laravel with React JS - Build Twitter Like Real Time Web App online?
Laravel with React JS - Build Twitter Like Real Time Web App is available to watch online on CourseFlix at https://courseflix.net/course/laravel-with-react-js-build-twitter-like-real-time-web-app. The page hosts every lesson with the integrated video player; no download is required.