Mastering Laravel: Build Instagram Clone with Livewire

Focused View

Namu Makwembo

8:33:31

0 View

1 - Introduction

1 - Install Laravel.mp4

02:45

2 - Install Breeze Auth Package.mp4

02:51

3 - GitHub Repository.txt

3 - Install Livewire.mp4

04:09

3 - vite.config.zip

4 - Install Daisy UI.mp4

03:53

4 - app.blade.zip

4 - tailwind.config.zip

5 - 5-Download-sidebar-avatar-and-Logo.mp4

02:18

5 - Download Sidebar Avatar Logo.mp4

02:18

5 - app.blade.zip

5 - avatar.blade.zip

5 - logo.zip

5 - sidebar.blade.zip

6 - Repository.html

6 - Repository.txt

2 - Home

7 - 6-Home-component.mp4

03:52

7 - Install Home Componentpage.mp4

03:52

7 - Repository.txt

7 - home.blade.zip

8 - Design story section.mp4

04:56

8 - home.blade.zip

9 - Design Suggestion section.mp4

08:04

9 - home.blade.zip

10 - Design mobile header.mp4

07:04

10 - home.blade.zip

3 - Post Item Component

11 - Make post component.mp4

04:22

11 - item.blade.zip

12 - Create Video Player.mp4

16:34

12 - video.blade.zip

13 - Footer section.mp4

08:42

13 - item.blade.zip

14 - Add swiper js to media section.mp4

12:14

14 - app.zip

14 - item.blade.zip

4 - Create Post Media Models

15 - 2023-08-12-043033-create-posts-table.zip

15 - Create Post model.mp4

07:25

15 - post.zip

15 - postfactory.zip

15 - user.zip

16 - 2023-08-12-043111-create-media-table.zip

16 - Create Media Model.mp4

12:39

16 - databaseseeder.zip

16 - media.zip

16 - mediafactory.zip

5 - Adding posts to home

17 - Adding posts to home.mp4

07:20

17 - home.blade.zip

17 - home.zip

17 - item.blade.zip

17 - item.zip

6 - Create New Post

18 - Make Create post component.mp4

04:52

18 - create.blade.zip

18 - create.zip

18 - tailwind.config.zip

19 - Design layout and left side.mp4

11:42

19 - create.blade.zip

19 - create.zip

20 - Design details side.mp4

04:51

20 - create.blade.zip

21 - Add properties and methods.mp4

13:20

21 - create.blade.zip

21 - create.zip

22 - Save Post Reel to Database.mp4

10:15

22 - create.zip

22 - home.zip

7 - Post view Components

23 - Create Post view modal component.mp4

10:14

23 - home.zip

23 - modal.zip

24 - Create view item.mp4

05:05

24 - item.blade.zip

24 - item.zip

25 - Details.mp4

04:51

25 - home.zip

25 - item.blade.zip

25 - item.zip

25 - modal.zip

8 - Create Comments Polymorphic Model

26 - 2023-08-22-065849-create-comments-table.zip

26 - Create Comment model with mfs.mp4

06:00

26 - comment.zip

26 - post.zip

26 - user.zip

27 - Fill up Comment Factory.mp4

08:32

27 - commentfactory.zip

27 - databaseseeder.zip

27 - home.zip

9 - Get Posts on demand

28 - Load more posts on scroll.mp4

06:56

28 - home.blade.zip

28 - home.zip

10 - Load comments in post view

29 - Design comments layout.mp4

05:24

29 - item.blade.zip

30 - Display comments from database.mp4

04:35

30 - item.blade.zip

30 - item.zip

31 - Get Replies and Decendants.mp4

07:44

31 - comment.blade.zip

31 - databaseseeder.zip

31 - item.blade.zip

31 - item.zip

31 - reply.blade.zip

32 - Add Comment To Post.mp4

04:33

32 - item.blade.zip

32 - item.zip

33 - Add Reply to comment.mp4

03:43

33 - comment.blade.zip

33 - item.zip

33 - reply.blade.zip

34 - Add instant comments to Post Item.mp4

05:31

34 - item.blade.zip

34 - item.zip

35 - Disable commenting.mp4

05:25

35 - item.blade.zip

11 - Add Like Posts

36 - Install like package.mp4

03:30

37 - Add Like to post.mp4

05:04

37 - item.blade.zip

37 - item.zip

38 - Hide Show like count.mp4

02:40

12 - Add Likes to Comments

39 - Add like to comment.mp4

07:27

39 - comment.blade.zip

39 - item.blade.zip

39 - item.zip

39 - reply.blade.zip

13 - Add BookmarksFavorites

40 - Install Favorites Package.mp4

02:23

41 - Toggle Favorites.mp4

03:20

41 - item.blade.zip

41 - item.zip

14 - Add Follow system

42 - Install follow package.mp4

01:54

43 - Toggle Follow Users.mp4

04:59

43 - home.blade.zip

43 - home.zip

15 - User Profile

44 - Add username to Users.mp4

03:23

45 - Create profile component.mp4

02:48

46 - Download profilelayout.mp4

07:06

46 - home.blade.zip

46 - home.zip

46 - profile-layout.blade.zip

47 - Display Users Posts.mp4

05:37

47 - home.blade.zip

47 - home.zip

48 - Display Reels Saved Posts.mp4

10:21

48 - profile-layout.blade.zip

48 - reels.zip

48 - saved.zip

48 - web.zip

16 - Explore page

49 - Create Explore Page.mp4

05:44

49 - sidebar.blade.zip

49 - web.zip

50 - Show Explore Posts.mp4

08:54

50 - explore.blade.zip

50 - explore.zip

51 - Customize the video component.mp4

03:21

51 - explore.blade.zip

51 - video.blade.zip

17 - Reels page

52 - Create Reels Component.mp4

02:38

53 - Show Posts Reels.mp4

10:18

53 - reels.blade.zip

18 - Search

54 - Create Livewire Sidebar.mp4

01:57

55 - Add Search Functionality.mp4

13:59

55 - app.blade.zip

55 - sidebar.blade.zip

55 - sidebar.zip

19 - Add Broadcasting

56 - Introduction to Broadcasting.mp4

04:31

57 - Install pusher and Laravel Echo.mp4

03:27

58 - Create pusher account.mp4

04:21

20 - Notifications

59 - Create notification component.mp4

02:30

59 - sidebar.blade.zip

60 - Design notifications.mp4

06:52

60 - notifications.blade.zip

61 - Create NewFollowerNotification.mp4

06:23

61 - home.zip

61 - newfollowernotification.zip

62 - Create PostLikedNotification.mp4

06:06

62 - item.zip

62 - postlikednotification.zip

63 - Create NewCommentNotification.mp4

04:44

63 - item.zip

63 - newcommentnotification.zip

64 - Prevent Self Notifications.mp4

03:11

64 - item.zip

65 - Show NewFollower Notifications.mp4

08:11

65 - notifications.blade.zip

65 - notifications.zip

66 - Show PostLiked Notifications.mp4

06:29

66 - notifications.blade.zip

66 - page.zip

66 - web.zip

67 - Show NewComment Notifications.mp4

05:01

67 - notifications.blade.zip

68 - Listen to Notifications.mp4

06:09

68 - channels.zip

68 - notifications.blade.zip

68 - user.zip

21 - Chat Database Architecture

69 - 2023-11-20-155555-create-conversations-table.zip

69 - 2023-11-20-155604-create-messages-table.zip

69 - Create Models.mp4

07:11

69 - conversation.zip

69 - message.zip

22 - DesignDownload Chat Components

70 - Create Chat Index.mp4

08:28

70 - index.zip

70 - sidebar.blade.zip

70 - web.zip

71 - Create Chat list.mp4

02:22

71 - chat-list.blade.zip

72 - Create Chat Main.mp4

03:48

72 - chat-list.blade.zip

72 - main.zip

72 - sidebar.blade.zip

72 - web.zip

73 - Create Chat Component.mp4

03:25

73 - chat.blade.zip

23 - Make Chat System Dynamic

74 - Create Conversation.mp4

07:06

74 - home.zip

74 - profile-layout.blade.zip

75 - View Auth Conversations.mp4

05:26

75 - chatlist.zip

75 - chat-list.blade.zip

75 - user.zip

76 - Select Load Conversation.mp4

06:21

76 - chat.blade.zip

76 - chat.zip

76 - chat-list.blade.zip

76 - main.zip

77 - Send New Messages.mp4

06:31

77 - chat.blade.zip

77 - chat.zip

78 - Display New Messages.mp4

12:38

78 - chat.blade.zip

78 - chat.zip

78 - chat-list.blade.zip

79 - Live Update New Messages.mp4

04:59

79 - chat.zip

79 - chatlist.zip

80 - Scroll Chat to Bottom.mp4

05:25

80 - chat.blade.zip

80 - chat.zip

81 - LoadMore Messages.mp4

08:55

81 - chat.blade.zip

81 - chat.zip

82 - Mark Messages As read.mp4

03:12

82 - main.zip

83 - Broadcast New Message.mp4

05:01

83 - chat.zip

83 - messagesentnotification.zip

84 - Listen to Broadcasted Message.mp4

08:34

84 - Repository.txt

84 - chat.blade.zip

84 - chat.zip

84 - chat-list.blade.zip

Description

Build an Instagram Clone with Laravel, Livewire, Alpine.js, and Tailwind CSS – Elevate Your Coding skills

What You'll Learn?

Mastering Modern Web Technologies: Dive into Laravel, Livewire, Alpinejs, and Tailwind CSS. Seamlessly integrate these for dynamic Single Page Applications (SPA
Building a Powerful Instagram Clone: Code an Instagram clone, covering Stories, Follow/Unfollow, Likes, Swipe, Commenting, Saving, and real-time updates.
Enhanced User Interaction: Elevate UX with search, hover effects, and engagement on Explore, Reel Pages, real-time messages, and notifications.
Creating Multimedia Posts with Considerations: Create multimedia posts, mastering file size optimization for both vidoes and Pictures.

Who is this for?

This course is intended for a diverse audience of aspiring and intermediate-level web developers seeking to advance their skills in modern web development. Whether you're a coding enthusiast looking to build on your existing knowledge or a professional seeking to expand your skill set, this course is designed for you. If you have a basic understanding of Laravel framework, Tailwind CSS, PHP, HTML, and CSS, you'll find the content particularly valuable. Entrepreneurs or individuals aiming to create dynamic, feature-rich web applications, especially those interested in building social media platforms or similar interactive websites, will benefit significantly from this course. The hands-on approach, coupled with practical examples in building an Instagram clone, ensures that learners not only grasp the concepts but also gain the confidence to implement them in real-world projects.

What You Need to Know?

To fully benefit from this course, it's recommended that students have a basic understanding of Laravel framework, Tailwind CSS, PHP, HTML, and CSS. While not mandatory, a foundational knowledge of these technologies will help you grasp the concepts more efficiently and enhance your learning experience. If you're a beginner, don't worry—we'll provide clear explanations and hands-on examples to help you bridge any gaps in your knowledge. This course is designed to cater to a range of skill levels, so whether you're familiar with these technologies or just starting, you'll find valuable insights and practical guidance to advance your web development skills

More details

Description
Embark on an exciting coding journey with our immersive course as we unravel the magic of web development together. Picture this: we'll be diving deep into the key features on the Home Page â€“ from the seamless Swipe and Like functionalities to the engaging Stories and the dynamics of Follow/Unfollow. Get ready to immerse yourself in user interaction as we explore Commenting, Saving posts, and effortlessly scrolling through the Home Feed.
But wait, there's more! We'll navigate the vast possibilities of Search Functionality, making it easy to connect with users by finding, exploring profiles, and initiating follows. Brace yourself as we step into the Explore Page, unveiling Hover Functionality and diving into interactive engagement with posts and comments.
Hold on tight as we experience the dynamic Reel Page â€“ play, like, save, and take a smooth ride through captivating reels. We won't stop there; we'll delve into real-time user interaction with Messages and Notifications, creating an immersive social experience that goes beyond the ordinary.
And guess what? That's just the beginning of our adventure! Learn to craft stunning posts, incorporating Mixed media posts while considering file size. Explore your profile with tabs for a comprehensive overview of your digital presence.
This is more than a course; it's a personalized journey into the heart of web development, where we don't just learn â€“ we actively build and refine our skills together
Who this course is for:
This course is intended for a diverse audience of aspiring and intermediate-level web developers seeking to advance their skills in modern web development. Whether you're a coding enthusiast looking to build on your existing knowledge or a professional seeking to expand your skill set, this course is designed for you. If you have a basic understanding of Laravel framework, Tailwind CSS, PHP, HTML, and CSS, you'll find the content particularly valuable. Entrepreneurs or individuals aiming to create dynamic, feature-rich web applications, especially those interested in building social media platforms or similar interactive websites, will benefit significantly from this course. The hands-on approach, coupled with practical examples in building an Instagram clone, ensures that learners not only grasp the concepts but also gain the confidence to implement them in real-world projects.

User Reviews

Rating

average 0

Total votes0

Focused display

PHP

Laravel

Instagram Marketing

Namu Makwembo

Instructor's Courses

I am a dedicated software engineering student and instructor based in Turkey. With a strong background in PHP, Laravel, CSS, HTML, and JavaScript, I have accumulated 5 years of valuable experience in the field. Ever since I wrote my first code in C++, programming has been an inseparable part of my life. As I continue to learn and grow, I find great joy in sharing the various programming tricks and skills I've acquired with fellow programmers in my community.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.