How to Build and Deploy a Portfolio with Next.js that Will Land You Jobs

[@unchart_d]

Collaboration is the new way to grow as content creators, glad you working with others Kyle🎉

[@larhakobyan]

I’m really confused by your approach. You’re suggesting to follow along, but then you paste a 110-line code all at once. This code isn’t listed anywhere in your GitHub repo, and it’s not visible in your GitHub commits. Plus, the final code on your GitHub doesn’t match what you pasted earlier at all.

[@balajiganesh4246]

@@larhakobyan exactly

[@alexfurtado1759]

Everything falls apart whe he add MDX / Just ignore it (mdx)

[@yashiscoding]

Hamed has to be one of the best NextJS instructor on the internet. I learnt many complicated terms in simple explanations

[@Mark-sc2ew]

Perfect guide for MDX in Next.js, thank you!

[@AmandeepSingh-sx9ke]

Thank you Kyle. Your videos help so much. 🙏

[@LutherDePapier]

I think you could use "import 'server-only'" instead of the useEffect setMounted stuff to ensure that the theming process only works on the client.

[@halilural1988]

Great video to have a good portfolio app.

[@TheStudyGuy1]

Love your videos ❤

[@thisguyhasnochill4424]

6:41 Yeah bro i like how you created component in a second without explanation. What extension you have or what so we can create it fast too , i need to waste minute to create that, so 2 hour video is 2 days i guess

[@M1a2n3o43]

It is a very popular extension for react , i think it is called react snippets or something like that. It provides different snippets for react and the one he used is, `rafce` , you just type that and then press enter. There are other ones.

[@M1a2n3o43]

I think the eslint extension which you should already have installed has some snippets like the one i use often is `edf` short for export default function which i like more than rafce

[@nanatahirhammond1400]

Great video ❤❤❤

[@QuantumCanvas07]

I really appreciate what you do in WDS but I'd suggest you to mention that 3d touches can look great in marketing or portfolio websites but it might not always work if you're building a real world solution where you consider people from all groups to maintain accessibility standards (especially if you're building something for a state agency) where you'd have to go through a long list of documentations and formalities.

[@prasanthreddy935]

Thank you for videos❤❤

[@balajiganesh4246]

33:46 I am following the exact same code you have given. The dark theme is getting applied to only buttons and next, and not to the container background which remains white always. Any help would be appreciated

[@codewithsabri]

It sounds like the issue might be due to the missing "dark" class in your global styles.You can look them up in the project's repo and copy and paste in your global CSS file (globals.css)

[@gisellemartinez-sanchez3509]

oh oh oh! I thought I mistyped something so I was going back to re-watch! Did you figure out this issue?

[@gisellemartinez-sanchez3509]

Update update, if you update your globals.css with the updated version he has in the github repo this issue gets solved. it has to do with the theme section that he highlights in his explanation

[@balajiganesh4246]

@@gisellemartinez-sanchez3509 yes. I copy pasted the globals.css from his GitHub repo and it worked fine . He hasn't shown this step in this video.

[@balajiganesh4246]

@@gisellemartinez-sanchez3509 I copy pasted the globals.css from his git repo which fixed it . He didn't show that step in the video

[@coderflix]

Thanks for the video.

[@hassancoder1]

Thanks for your detailed explanation ❤

[@nanatahirhammond1400]

Great

[@afrique_cr9563]

Merci beaucoup depuis le Camerooon❤❤

[@QuantumCanvas07]

A portfolio can never land you a job if you don’t have experience doing stuff. If you're new to the field lemme tell you, job isn't always a way to gain experience. There're multiple different ways like participating in hackathons, build real world solutions, doing out of the box stuff or maybe by building some fun project.

[@PSPeeks]

My one issue is that he does a lot of copy & paste which is fine, but several times his split screen preview is covering blocks of the code. Other than that it's great.

[@meguminagumo]

yes and he doesn't bother to show us the hidden parts.

[@gisellemartinez-sanchez3509]

@@meguminagumo the hidden parts were in the github repo

[@jefrryarispratama2858]

I got this, Error: Only plain objects, and a few built-ins, can be passed to Client Components from Server Components. Classes or null prototypes are not supported. when i tried to submit the email form, does anyone has the same issue as me?

[@manishshaw1002]

Thanks Kyle.I am following the tutorial let's see how it helps me 😄

[@ObomheseR]

Kyle, i think you need to drop the repo on your own github account so we can make changes that we didn't see in the video... Trying to copy the code from the video is kinda difficult because the way he splitted the screen is not even Thanks though 👍

[@skills4761]

so what if I want to generate post and projects dynamically ?

[@AlThePal78]

so are you now more into next.js or react.js or are you liking them both and have different reasons to use any of them

[@ohmegatech666]

Next.js contains React. It uses React for the front end essentially and Node.js for the backend. Really, Next.js is basically the standard way to utilize React nowadays

[@ilan117]

Hello Hamed, always thank you so much for your content ❤ I have a question … I keep getting an error from the server components saying the following : Only plain objects, and a few built-ins, can be passed to Client Components… do you think we need to serialize the data or stringfy?

[@rifatmunna]

bro i can even build e-com website with fully nextjs still no job

[@LutherDePapier]

Welcome to the club. Employment be weird like that these days.

[@paakofibamfoquaicoe4193]

I may be wrong, but I suggest instead of finding a job, try solving problems. If I may ask, who is using your e-commerce web app?. Look for business around you and try creating a website for them. Start with free but make sure you are solving a problem with it. It's not easy, but it will work. I hope it helps.

[@gisellemartinez-sanchez3509]

try working on your soft skills! I really recommend Simple Programmer but he has A LOT of videos on youtube, you just need a few of the ones where he specifically focuses on basic soft skills

[@FootyFocusHd_10]

Next Auth Course please

[@ohmegatech666]

"npm add" does exactly the same thing as "npm install" or "npm i", as they are just aliases

[@dejo095]

Is there a github repo, this guy is just pasting whole components, and it takes alot of time to pause video at exact time and retype all from screen.

[@ridho6908]

Bro, you're not familiar with ocr technology yet?

[@balajiganesh4246]

Check the description. He has given the GitHub repo link

[@artaman23423]

Prettier auto save is not working, do we also need to install its vs code extension

[@ohmegatech666]

Yeah he should have mentioned that. You need to install the extension and you need to add some lines of code to your VSCode user settings JSON file like it shows in the Prettier extension page

[@prasannanaik1023]

Big ass monitor screen , unable to see properly. At least zoom it.

[@Pururin_Purin]

i cant get a job its over

[@SumYungGai-]

Same

[@paakofibamfoquaicoe4193]

Solve problem. Getting a job is difficult. But what I have learnt so far, is to become a problem solver. For instance I attended a seminar and with my obsession with solving problems, I engaged the caterer on how she prepares her invoices and expenses. According to her, she needs to pay an accountant to do that. As a developer, I explained to her how a system can help her. I have been able to develop a system for demonstration to solve this problem. It took me a weekend to develop it. What I am trying to say is to become a problem solver. With your understanding of web or mobile development, you won't necessarily need someone to employ you but you can employ others. It's not easy but start it anyway.

[@ilan117]

I feel you ❤

[@Adrenaliinz]

Same. And I have projects and github activity and like everything that;'s needed. ANd I spent a lot of time improving eveyrtghing and I constantly revise and improve and continue to code and build projects and I'm just sick of how much time and effort I've spent and it all seems invain.. :(

[@ramendrasoni3368]

Where can I get some projects to earn money..

[@asifur-rahaman-meeru]

It might be a good resource but not for me. Occasionally, I had trouble viewing the screen; the instructions aren't very focused and interactive. I really hate when codes are pasted into a tutorial; I prefer fast-forwarded code blocks. Anyway, cheers.

[@aung_mk]

no hate but this is the most frustrating tutorial ever.

[@balajiganesh4246]

Literally copy pasting code for 2 hours

[@gisellemartinez-sanchez3509]

no hate, but your comment is the most frustrating ever. 🤗

[@gisellemartinez-sanchez3509]

@@balajiganesh4246 He does a great job about explaining the different aspects and how they come together. Unless you have 0 experience on how react/next works this shouldn't be confusing for anyone. Also, it's a tutorial - it shows you a way to do it, then you do whatever you want. if you don't want to copy-paste you can do your own from scratch, on your own.

[@saipradeepmorla2115]

i really have huge respect for this content but damn too much copy pasting and not giving context fully at all.(although he provided github) it is too much hassle to go back and come back and that split screen is hiding some code. this is a problem if collaboration happens he doesnt put that much effort as if he put in making conent for his channel.

[@Jagadeesh-K-2802]

Your videos are great as always but I will not agree that a portfolio site will help me land jobs, coming from someone who has a portfolio with great lighthouse score and great projects in it PS: My portfolio ranks 1st on Google still no use

[@Ss-zg3yj]

Trash

[@SmileyJack.]

so out of hate you've watched a 140 minute video in 10 minutes?

[@devdhaif]

​@@SmileyJack.It's not trash But it is not that cool either

[@paakofibamfoquaicoe4193]

​@@devdhaifshare your KZbin link...

[@dev31218]

Not Gonna lie, this is the worst tutorial ever that too for a very basic project, could have been good if you let us copy the code too specially the tailwind.config file dude who is going to write that plus you are not letting us copy from you your github repo

[@user-ep4hf9qf3e]

this guy sucks dont bring him again

[@recursion.]

is this channel become like freecodecamp?