React Blog Website Design Tutorial | React UI Full Course for Beginners

How to create a blog website using React.js. Blog app React project from scratch for beginners. Design React blog app using functional React components and React Router Dom.
You are watching the first part. Here are the next parts:
Second Part (Rest API): • Node.js Blog App REST ...
Third Part (MERN Stack): • React Node.js Full Sta...
Buy me a coffee: www.buymeacoffee.com/lamadev
Source Code: github.com/safak/youtube/tree...
Join Lama Dev groups
Facebook: / lamadev
Instagram: / lamawebdev
Discord: / discord
0:00 Introduction
01:09 How to install a React App
04:33 React navbar tutorial
17:02 Creating React header
23:48 Using flexbox in React.js
26:39 React sidebar example
34:10 Blog post component
44:25 Single post component
58:35 Create a new post component
01:09:50 User settings component
01:22:00 React Login and Register Page
01:31:33 React Router Dom Tutorial
01:44:56 Outro

[@tobyroy336]

Creating a blog using React JS is a great way to learn a range of features. You have structured this exquisitely and I really can't thank you enough 🙏🏾

[@tk0779]

Thanks a lot for your tutorial. It is very useful for a beginner. I 've finished this with react-router-dom 6 that has to change to
If anyone is confused with the RRD6 like I was, these are the code inside the

[@crazyphysicss]

Thanks alot man

[@juskaranbuted4136]

thank you very much bro

[@CrystineKoh]

That’s what I’m struggling on. Thanks a lot

[@Ynottry]

Thank you man@@CrystineKoh

[@Alfa-fu8kz]

ty bro

[@losbur5416]

Whenever I visit this channel i understand how excited these lessons are especially for beginner like me. Thanks a lot, no doubts the channel will become very attractive sooner or later for who enjoy dev :)

[@menandmice]

I really like how you go through everything instead of copying and pasting. Tutorials become longer that way but it is still better in that way. Copying and pasting can used from time to time but not as general method in my view.

[@IvanSkodje]

Well said.

[@sanamhamza7441]

now i learned react after watching many tutorials, it was great for beginners, thanks alot !

[@3mercutio3]

That was awesome. Thank you so much !!! (Recommended you as far as I possibly could)
Really looking forward to the back-end part

[@oablom]

This is so underrated! I've learned more here than during a 6 week long backend (MERN) course in school. Thank you so much!

[@karaar368]

as a beginner I am going to say thank you much it's friendly for beginners like me and I learned a lot. I am going to continue the other part of the tutorial

[@dominiquekym7985]

Your design is so great and you do complete series. You are amazing. I envy you for how you master CSS and JS

[@nishametri8142]

Thank you so much Sir! for such amazing content in React JS. Amazing layout and design.It was a great learning!

[@Williams2809]

1:34:10 If this isn't working for you, try this:








Instead of Switch, import Routes

[@md.saydurrahman6906]

Thanks, it was helpful.

[@zaurhuseyn4432]

yeah youre right switch is the old version of react only in 2021 but now routes

[@prodsefv]

underrated channel
so clean and simple tutorial thx lama

[@jeekterrenal7136]

Thank you for this wonderful tutorial Lama Dev!
I learned a lot!

[@vaibhavverma4400]

Best React tutorial video i ever saw on youtube

[@piyushjoshi8905]

Another masterpiece from lama 😍❤️

[@atifhu]

this channel is so underrated, thanks for giving us such a quality content, best of luck

[@mohammadnaim9226]

Really simple and easy and also amazing tutorial man.Carry on and great wishes for you!!!

[@davidbai9800]

"Time is relative" hahahah. Such a good tutorial! Thanks!

[@mohammadfariduzzaman7962]

This is the best one for the beginner...I'm waiting for the next one adding Node and API to the same Blog website...😍😍👍

[@siddharthpandey8516]

this is the most amazing tutorial I have seen. I love your explanation as you code. Awesome!

[@mouctechy]

Lama So far so good React components and routes are clear to me now thanks you're my hero💪🏽

[@ailtonjunior7685]

For those who are having difficulty in the routes:
function App() {
return(



);
}

[@ankittomar1125]

Thanks Bro..

[@samriddhi1203]

i am still getting react-router-dom error

[@ankurtrivedi6943]

@@samriddhi1203 same with me

[@coder5336]

awesome keep it up looking forward the next part.

[@endowedisaiah1732]

As always your videos leave me speechless, may God reward you Sir. Thank you sincerely

[@leviudeh8843]

Thank you so much @LamaDev these has really help me a lot and I'm improving so much by watching you tutorial. Thank you.

[@stricktown614]

Your channel made my day! Thank you for such wonderful tutorials.

[@MertCalkan]

I would like to built a website like this , and I found this video! Thank you so much. I will watch all of it.

[@fa6805]

I finished building this in 1 day. That was a clear tutorial, thank you!! And now I just finished watching your 3hr React E-Commerce. I'll start coding it right away.

[@se1se2se3]

wow i completed it in one week lol

[@jose-kb1dg]

This is exactly what i was looking for, thank you. :)

[@adityarajguru7947]

Amazing video, Thank you so much for such tutorials!! :D

[@AdamElMou]

I LOVE IT BRO ! THANKS FOR SHARING YOUR KNOWLEDGE !

[@tsjaanaa9242]

you are an awesome and an amazing human being , all your builds are dope 100

[@germainrugaba1451]

Always awesome Lama, just awesome!!!

[@XicorYT]

Great design, you deserve more subs!

[@hurleywflow2227]

Thanks mate, for beginners like me, I think, using CSS and Component together like this make more sense and clean

[@olatunjiolaide2608]

@lama dev, your tutorials have been awesome, very educational and easy to understand. Thanks for all you do. Pls consider making a video on how to test our react application.

[@ajoychandrasaha697]

For a beginner like me, it is a great tutorial.

[@fionlin5682]

First tutorial I finished, thank you for this video 😊

[@anmol2757]

Thanks brother you are the G.O.A.T of development . Learnt lot from your videos

[@mariakononevskaya7796]

absolutely amazing titorial, thank you so much for it !

[@jesustzinon]

Lol man you dont know how helpfully this is going to be,im making a blog site for my job and im strugglin so much with the ui since im using reactstrap and its very very ugly, thanks a lot

[@phonedev6084]

You are a genius. I hope to see you have 500k sub.

[@coderlady_]

Hi, I am learning a lot from you, (especially css, I learned something new in this video) :)
Thank you

[@learnenglish5416]

Thank you so much Iam too confused in style components. But you you CSS for us Iam really grateful for that ..
Thank you man🙂❤️

[@kalpeshpatil741]

big love from India brother......doing great work with no benefit.

[@diegofergusson9113]

Thanks man!! you are amazing Lama

[@jhonnidarshan3094]

Bro your tutorials are awesome,God bless you

[@ruipinto1643]

Great video, I learned a lot of React concepts for the first time, however, maybe is it worth showing that in the design phase the websites should also be prepared for mobile and tablet users.

[@rahulsingh-bk3wd]

Thnaks for the help man it was a great video heven't completed the video but have been learning so much from it.

[@AlexandruBejenari]

Thank you for your tutorials. You are awesome!

[@Corntrop]

I love your designs. When mern part is coming?

[@elijahayodele173]

Thanks a lot for this beautiful project series 👏👏

[@ajit287]

Nice one Waiting for next part

[@ChrisTian-ox5nr]

Great Tutorial Llama you da best!!

[@WillSmith-qt7me]

Thank, Lama, for this blog tutorial

[@afzalharun8975]

I love your work. Keep it up for us Sir

[@emmanuelnyangweso9389]

Great tutorial in youtube, keep up good work.

[@berrypoppe5459]

Great tutorial thank for learning and I take your next course React Node.js. Thank you so much

[@davincimemes3631]

This is awesome! Thank you!!!

[@jatinkumar4410]

Amazing... Thanks for the tutorial...

[@matheusfelipe1727]

The best tutorial channel ever

[@melamelawen]

Yooo thank you so much for this bro. I just finished creating this and I'm feeling proud of my self and thankful for you.

[@alexis13delgado]

can u send my the finished code plz

[@scorpion32]

I really love your lessons , you deserve a lot more subscribers.
Are you going to also show how to deploy this project on a free hosting site?

[@LamaDev]

I will create a seperate video about deployment soon :) Thanks for your comment

[@shaonbiswas1569]

@@LamaDev plzzzz make add mobile responsive.

[@gnanashreechethan1209]

@@LamaDev sir i am stuck in 1st step , the command npx create -react-app isnt working

[@yousufsulaiman2211]

Thanks so much, such an amazing tut

[@KhanhNguyen-zj2cp]

thanks bro. I hope all the luck will come your way.

[@nick598l4d]

great video, I learned more about CSS.

[@rendevous9253]

Great project , thanks man

[@flyflor599]

Awesome Lama !

[@alenjose7924]

You are a great teacher please make videos on AI and React native also

[@aparecidafernanda2633]

Aprendendo muito, otimo para estudar, tudo bem explicado, obrigada

[@user-ss2jr8ss8l]

I love this calming voice

[@arijitdas5929]

Glad I discovered your channel

[@srikrishna5241]

hi lama, appreciate your effort. Could you please make a video explaining how to make the website responsive.

[@ifailu1]

great and well explained.

[@devanshubilthare5277]

Great work dude

[@tracybonham2568]

This is a great tutorial! But, within the last month or so, with the React Router v6 update, they changed the routing syntax. They replaced to . and the paths to exact element={} This broke a few things.

[@andrewpersaud4144]

always @5 that lol. Even today I open old projects to get the versions cuz I hate the changes in newer ones

[@pmsb_999]

How did you resolve it? Can you share the code?

[@arsenicwafer]

@@pmsb_999 I just looked at the documentation for the update.
for the conditionals, I put them on one line.
Example:

[@cevahirpalandoken1466]

​@@arsenicwafer Hello, I couldn't solve the problem. if you have the full version of the running application can you send it to me?

[@jobbyraju3875]

@@cevahirpalandoken1466 do you have the full code of the running application?

[@nathanzebedee5263]

thanks so much for this content!

[@ketanchopade6179]

Thank you so much,Great video sir ! Please make similar videos of ecommerce.

[@dianavillada2466]

Thank you so much for this tutorial. I am a beginner and really appreciate how through you are. I have a question about how you get the image url from pexels to use for the app? I requested an API key but have no idea how to use it

[@moviesbuddy4228]

Just Awesome ❤️

[@MargaMbande]

Very useful! Thanks

[@bishnuthapako]

I was struggling when I click write button render all the components including write component. I want to display only write component. Thank you so much you cleared my confusion. you are awesome.

[@ricky3441]

you're the best bro 🔥

[@darpananeja4751]

Just awesome!!!
I will surely make it!!!

[@shivani9840]

Hey Darpan! Have you ever taken the help of any tutorial to do a project? Would you be interested exploring opportunities in web development?

[@akimayenasouleamidou6449]

great tutorial, but try to handle media query in our css as well for small devices

[@patshalaaa]

Awesome learnt a lot

[@zahidulislam816]

love this project.

[@melikekozan7711]

Thank you soo much, every think is great

[@sethmedeiros3678]

This is great, thank you! You should make a discord channel!

[@sampathvallapala7307]

Bro love ❤ u so much . I learned a lot

[@abhishekmishra9841]

Thank you so much sir , 🙏🏻❤️

[@ankitrules22334]

Really loved it. If you can let us know the extensions you use for Visual Studio Code that would be great.

[@cse_ty_b_30_shikharjain3]

thanks for the tutorial

[@BulBulAhmed-cu3eu]

Your teaching style is awsome.. Love and respect teacher🥰.. Love from Bangladesh❤

[@Lamadev01_for_help_telgraam_me]

👆Send a direct message for help 🆙 ⬆️.

[@hikmatilloturayev109]

awesome video thank you

[@AdamMaichrzik]

You are AWESOME! Liked, subscribed, turned on the bell, joined the fb group. What can I do more for you? If I will get my job as a web developer you are definitely getting a coffee donate! :D

[@keertilata20]

Hey. thank you for this video, can you tell me which extensions are using ?

[@adante407]

You make some great content. Glad I discovered your channel. Could you use this a headless cms with a WP backend? 👍

[@cyronarieri3314]

i would love to know where you learnt CSS from or atleast recommend resources that touch comprehensively on css. otherwise its great content i have learnt alot of new things

[@sokealy5003]

Love it.