Next Level ReactJs Portfolio Website (NEW 2023) ✅ | Responsive Portfolio | ReactJs Beginner Project
Вставка
- Опубліковано 14 жов 2024
- GOAL: 10k ❤️🔥 SUBSCRIBERS {{🔵SUBCRIBE TO MY CHANNEL }}
In this video, we will discuss
1. React Js project setup
2. Building your portfolio website
3. Using Styled Components, Material UI
4. Dynamic data for the portfolio
==========================================================
Check the complete portfolio: rishavchanda.g...
Code Link:
github.com/ris...
===========================================================
Web assets, animation, and themes: drive.google.c...
===========================================================
ReactJS tutorial provides basic and advanced concepts of ReactJS. Currently, ReactJS is one of the most popular JavaScript front-end libraries which has a strong foundation and a large community.
ReactJS is a declarative, efficient, and flexible JavaScript library for building reusable UI components. It is an open-source, component-based front-end library that is responsible only for the view layer of the application. It was initially developed and maintained by Facebook and later used in its products like WhatsApp & Instagram.
Our ReactJS tutorial includes all the topics which help to learn ReactJS. These are ReactJS Introduction, ReactJS Features, ReactJS Installation, Pros and Cons of ReactJS, ReactJS JSX, ReactJS Components, ReactJS State, ReactJS Props, ReactJS Forms, ReactJS Events, ReactJS Animation and many more.
Using this react js we are gonna go to build this awesome portfolio website and it's responsive too.
=========✓===============✓✓======
✨Tech I use every day ✨
💻Lenovo Yoga 6 AMD Ryzen 7: amzn.to/3IqmpAf
🎥Vivo V19 mobile cammera: amzn.to/3KyEA8y
🔅Ring Light: amzn.to/3rKBfLj
🎙Mauno Mic: amzn.to/3FRacTA
⽴Digitek tripod: amzn.to/3qNJ1Vk
🎧BoAt Rockerz 450 Headphone: amzn.to/3KC0S9J
📺Samsung 27-inch Curved: amzn.to/3KA1i07
🖱Logitech mouse: amzn.to/3fPKtA8
🖱Zebronics keyboard: amzn.to/3GVQgjz
💺Delta Office Chair: amzn.to/3KseZhA
🌟 Please leave a LIKE ❤️ and SUBSCRIBE for more AMAZING content! 🌟
Hey!! I am Rishav Chanda, Third-year Student at 📍 KIIT 🏫 pursuing Computer Science Engineering 🔌. I enjoy reading books 📚 and solving problems 📝 using Computer Science 💻. This channel is on college, growth 📈 and everything in between. New videos every week 📅. We'll be talking about productivity ⏳, work-life balance, career, and more.
📸 Instagram: / rishav_chanda
🌎 Website: rishavchanda.g...
📱 Twitter: / rishavchanda
📝 LinkedIn: / rishav-chanda-b89a791b3
📂 GitHub: github.com/ris...
✨ Tags ✨
Beautiful portfolio website, html css js portfolio website, react portfolio,react,react js,react full course,react course for beginners,react course in hindi,react course for absolute beginners,react course code with harry,react code with harry,code with harry react,react course 2023,react js full course in hindi,introduction to react js,create react app,react course free,latest react course in hindi,latest react course for beginners,reactjs installation windows 10,how to install react js in hindi,how to install react js in windows 10 in hindi,reactjs,reactjs installation,react js installation in hindi,install react js in hindi,install react in hindi,create react app in hindi,react create app in hindi,react setup in hindi,install react js 2020,insall reactjs in hindi,react js setup in windows,install reactjs in hindi,react js setup in hindi,react js install in hindi,react app in hindi,react,Download and Install React Js,setup react js in visual studio code,download and install react,react js,react native install windows,reactjs tutorial,React Js portfolio website, How make a react js portfolio website, how make next js portfolio website,React native on windows,install react on windows 10,react tutorial for beginners,react js,react tutorial,learn react,react course,reactjs tutorial,react crash course,react js tutorial,reactjs course,react tutorial for beginners,react.js,reactjs tutorial for beginners,reactJS,react,learn reactjs,tutorial,javascript,crash course,programming with mosh,code with mosh,web development,mosh hamedani,learn react js,
"react" "6"
"react js" "5"
"reactjs" "4"
"react tutorial" "7"
"reactjs tutorial" "4"
"react installation" "3"
"react.js" "4"
"react tutorial for beginners" "6"
"react js tutorial" "4"
"reactjs tutorial for beginners" "5"
"learn react for beginners" "3"
"react for beginners" "4"
"reactjs for beginners" "3"
"learn react" "5"
"javascript" "4"
"web development" "3"
✨ Hashtags ✨
#portfolio #reactjs #react #nodejs #reactinstallation #reactjssetup #reactprojects
I was researching how to style the page and make it responsive using ReactJS, then I found your video. Styling is my weak point and leaving it responsive. Amazing tutorial. Another subscriber.
00:02 Creating a modern portfolio website using ReactJs
02:11 Install dependencies and set up CSS styles for default React app.
06:00 Setting up default app.js file with CSS
08:00 Implementing custom theme and creating different components
13:11 Setting up the navigation bar and styling components
15:26 Styling navigation, container, and logo components.
19:36 Creating custom navigation links and button container
21:43 Styling the portfolio website
26:33 Implementing functional navigation and mobile menu
28:44 Creating a styled mobile menu with transition and animation
33:09 Creating hero container and its sections
35:17 Making the website responsive for different media screens
39:31 Adding text content and typewriter effect to the React application
41:45 Creating styles for resume button and subtitle text
46:11 Making buttons functional and adding images to the portfolio website
48:10 Implementing media query and animation
Best portfolio i have seen on the internet yet
really very good portfolio.❤
great bro keep working and give us this kind of projects 🙌🙌
Bhai super , full support👍
Bro which ui u use
Tailwind or material ui
Have u used virtual environment while creating this project?
i clone the git repo of this portfolio but when host it on netlify its showing just about and footer its not showing other section just showing bg og that sections. even when i open your hosted portfolio from your github its not showing any section except footer. why this problems are happening please solve that problems.
Hey rishab, could you make one video on portfolio website building without coding involved it would be a great help ! Like the ones in which we can edit using templates ... Fir people who dont know coding we are finding it difficult! Pls consider this request.
Ok sure I will try to make one video on it.
Man, you're awesome!
Thanks man. I'm very impressed with it. I'd be happy if I were allowed to use it
❤ hi pls i need a cool explanation about the hero background animation, is there a website where you got it or they were written by you, kindly walk us through it , i really appreciate, I'm currently using this template as my portfolio website and ive being receiving alot of nice comment about it.... so I'll need to prepare if I'm asked how i came about the animation
Thank you so much!!
Hey bro Even i am also from KIIT UNIVERSITY , Bhubaneswar
Good tutorial brother
on your github react-script missed
Great bro. What a Portfolio ❤
hey man you are awesome
Bhaiya thoda explain bhi krdo , apka level hamare se bohut high hai...
bro do you have version of this that uses only scss/scss instead of styled components?
bro can u pls provide manifest.json that you used in html ?thanks for making such great videos i will share with my friends
Rishav thank you
brother just a simple piece of advice. In this type of tutorial video don't put bg music
where do you exactly provide the dependencies we need to paste????
same, please say
which extention you use for autocomplete?
Good bhai niceee
hey i just found your channel, i like it so far and u gained a subscriber:) I don't seem to find the dependency list you talked about :/
Check it on GitHub
Ahh gotchu, ty mate:)
Excellent bro✨
my npx create react-app doesnt work anymore and evreything ive reasearched doesnt work
You make it so complex bro
can you make bullet points in experience section along wit 3d effects
It's beautifyl, but where can I get that svg from the background
can u help me out how you upload the images of education , Experience in firebase and get exact png link , like I try to upload the png in Google drive but only getting the png download link not the png link like you got at firebase ?
Bhaiya reactjs course bana do, iss level ki skill chahiye 🎉
I have an error in importing styled how to solve in appjs
Good work
Which extension You are using soi that you are easily getting all suggestion.
Bro,Did you find the name of the extension?
how do you add autocomplet css in react
website achy hai but aap samjha acha nh rahe na show karwarhy proper tareeqe sy but you have good skills.
Can I make the same template with vite app?
My check resume button is not working I have try every think....also not hovering..
Hey bro did you do in windows?
Yes, I'm using window...actually problem is with z-index that why button is not working...tnx for acknowledge my comment..
What did you do bro .. for making the button working??
Thank you bro
portfolio is good but lagging too much. plz do something about it.
can i use ur code to create my portfolio
Thank youu very much
bro where have you declared styled-components i am unable to see it!
just install it using "npm install styled-components"
can anyone tell me how to apply css on material UI i am not able to do it
your portfolio code is not working properly please check it once
portfolio was amazing.
But you are simply writing code by seeing from somewhere else, without explaining.
It looks like you have also simply copy pasted it.
don't waste ur time I thought this whole portfolio will be build in a single video, he didn't give any warnings that it will take more than 3-4 video.
Completely waste of time....
Quality content 👍
45:52 did anyone solved the check resume button error??
can i use the same website in my resume ??
Why are you talking and moving so fast on here? Surely you must realize anyone watching this is trying to learn instead of just typing and following along with you in such a manner as this.
drive folder is not opening please fix it
This portfolio is very beautiful but it doesn't work has much error
google drive folder link is not working
Have you updated your portfolio after this video also ..?
Is there contact form working?
your contact form is not working how to fix that
Hey ! Is your portfolio website responsive ?
Yea based on the title
How to react js image to get the link
give a Figma link this design
CSS for App.css not provided
Yes thank you for reminding me that I am providing it.
how to live this website
?
you akso say you give us the css and I can´t find it
podcast streaming app ka part 2
rishab bhai tora slow please
bhai portfolio ka code copy krne aaya tha achievements dekhkar inspire hoke jaa raha hu
Thanks 😊
Please give me complete source code
not beginner friendly
Gain a nice portfolio but didn't gain any knowledge.
better to copy past the whole thing, as he is not going to explain anything. You can watch the whole video keeping it mute as it is same anyways.
why the site is lagging like hell
bro the fonts they too small 😭
My bio role display is not working, I followed video
Check the GitHub repo, and match the code
Where is the source code
arre Bhai hindi me bhi baat kar sakte ho.
kisi ne animation change kiya h kya image background me
bhai pls teach in Hindi language
Apki puri video dekhi sare step kre fir bhi phone pr apki site chl nhi rhi thi time waste ho gya mera
This guy just wasted my time i started becoz of he is making portfolio in less time .After completing one video I got to know that he is taking the same time as others total time around 2 hour20 minutesss total waste of time . Man you should let us know about it prior starting the project . Useless creature totally unhappy u wasted my 2 hours bro
hat bkl isse gandi video nahi milegi kahi
00:02 Creating a modern portfolio website using ReactJs
02:11 Install dependencies and set up CSS styles for default React app.
06:00 Setting up default app.js file with CSS
08:00 Implementing custom theme and creating different components
13:11 Setting up the navigation bar and styling components
15:26 Styling navigation, container, and logo components.
19:36 Creating custom navigation links and button container
21:43 Styling the portfolio website
26:33 Implementing functional navigation and mobile menu
28:44 Creating a styled mobile menu with transition and animation
33:09 Creating hero container and its sections
35:17 Making the website responsive for different media screens
39:31 Adding text content and typewriter effect to the React application
41:45 Creating styles for resume button and subtitle text
46:11 Making buttons functional and adding images to the portfolio website
48:10 Implementing media query and animation
Crafted by Merlin AI.
your portfolio code is not working please check once