React.js social media application design tutorial. Create social media project using React functional components and React Hooks.
In the last tutorial, we created a social media Rest API using Node.js. If you didn’t watch that video, here you are https://youtu.be/ldGl6L4Vktk, and in the next part, we will combine that API and this design. To watch the last part: https://youtu.be/pFHyZvVxce0
Buy me a coffee: https://www.buymeacoffee.com/lamadev
Source Code: https://github.com/safak/youtube/tree/react-social-ui
Join Lama Dev groups
Facebook: https://www.facebook.com/groups/lamadev
Instagram: https://www.instagram.com/lamawebdev
Twitter: https://twitter.com/lamawebdev
Discord: https://discord.gg/yKremu4mPr
0:00 Introduction
1:38 Installation
8:22 Topbar Component
25:19 Body Components
32:42 Sidebar Component with Material Icons
43:56 Feed (Share, Post Components)
01:12:43 Rightbar Component
01:24:14 Using Dynamic Data
01:38:19 Like Functionality with useState Hook
01:42:21 Profile Page
02:02:47 Login and Register Pages
02:16:42 Future
source
Hello sir how you have create dummyData.js file
great teaching
I love your simplicity bro, I mean creating such high value content and putting it completely free on internet shows your gratitute and down to earth nature. You videos are extremely great and helpful for the coding community. I hope someday I can contribute for your efforts after getting a job.
Let me tell you, there are channels who are doing great stuffs like you, but most of their content are half done for you type means they hide some details of the application. I don't have problem with length and I like such full detailed tutorials like yours. Hence, Thankyou so much for everything you are doing for the community.
Hello, after this video is the next 3 hour video?
hey can someone give me same react application in angular
Outstanding sir❤
You are really experienced, i think it would take me a lot of time to reproduce Facebook like you, but i'm happy that i understood everything you said. It was really cool to see, thank you for the amazing resource.
Thank you for this video
Am encounter with error during the first step where to locate the folder..the line you typing 'npx create-react-app .' I can go through. Please help 🙏
Very Nice, Please what version of Node did you use for this project ?
Did u use java to create it
@48:35 🤣🤣
thanks for your awasome video! want to see more : )
The tutorial is comprehensive. Wow 💻👍🏽
absolutely amazing! If it has tips for responsive design it would be more usefull
only style css video
48:32 best part
Great work! Thank you!
best ever.. love you
very nice project sir, i learned alot, thank u so much ….
awesome tutorial, love you!
you are the best
greate sir your way of teaching is😍😍😍
Abey kitna pakyega?
Why do we not need whole assets path when we are in 'topbar' folder and not in 'public'?
Can someone please help me with the query? Thanks in advance!
at 15:22 in video
My position sticky isn't working on scroll all scrolls up even the topbar goes away
what a beautiful girl😹
Where is the responsive code
Hello friends. Please note that there are some changes. With the release of v5, the names of all related packages were changed from @material-ui/* to @mui/* as part of updated branding.
Nice tutorial on YouTube
Thank you! Good one!
48:34 Lama Dev being naughty 🤣
LAMA DEV, YOU'RE THE GOAT, BROTHER!!!
thank you bro for this ……
how to download the images/png/jpeg in your project
Alhamdulliah, Complete UI part and jump backend part! Thanks Lama Dev.
can u provide the link, where this is hosting, It will help while learning.
Sir you are a wow
it is with backend?
i'm unable to clone project from github
Very good
Why not work flex property inside the component/sidebar/feed/rightbar please tell me
Your tutorials are amazing Shafak .