@@ziadhussein1 hmm if it was autoimported then library also wont be the issue i guess.. but try to rerun command: npm i react-scroll In case its still not working, on your website do a right click -> inspect -> console ->check the error.. Send it here in case that library reinstall didnt help
@@talhajavedcom If its properly imported and Link is still failing, one last thing can be wrong, and that is an issue in a library installatio that can be fixed with this command: npm install react-scroll In case its failing, Id check error on your website -> inspect -> console ->see the error
bro ur explanations and videos are top🔥thank u so much ! and please could u also do some various levels of full-stack projects using different stacks cause u've already made a great number of portfolio projects and time now for harder one ✊ Lucks !
Thanks, much appreciated! You are right, I will continue with MERN Stack projects (already did the first one few vids earlier) and then also NextJS projects.:)
Hi! I'm experiencing an issue with responsive design where my layout only works properly at 67% zoom. I've followed the steps in this video, but the problem persists. Can you help me resolve this issue? Thank you!
Hey it really depends on your screen size. I was doing this for 24" + mobile screen. In case you want to make it work for a different sizes, you need to add more and more media queries so it works for your screen. Without going back to code because its already been a while, I would say that your focus will be to play with the grid columns positioning. Lower the colums and use different numbers from grid X to grid X. I believe that this is also a great practice for you, take it as a challenge.. You will be definitely good at grid layouts after this! :)
Hey, I did one already, you can watch it there: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-pdf8TZp5RfE.html , I am planning to do more of them tho :)
What tools do you use to display your apps inside a cellphone model like what you have in your projects section? I'd like to show my own projects the same way
when you are in mobile nav, and you resize your window to medium. you can't close the mobile nav. so here's the fix for it: make changes here: <div onClick={handleMobileNav} className="block md:hidden pointer"> <AiOutlineMenu size={20} className={nav ? "hidden" : "block"} /> </div> and here inside mobile nav section: <div className="flex items-center justify-between"> <h1 className="text-3xl font-bold primary-color m-4">anix</h1> <div onClick={handleMobileNav} className="text-gray-500 m-4 pointer"> <AiOutlineClose size={20} /> </div> </div> ... now your mobile nav is dynamic and you have close button in mobile nav section rather than at normal nav.
after you click on menu list in mobile nav, your menu should collapse, but it isn't doing so here. to fix that issue here's the edit: <ul className="p-8 text-2xl"> <li className="p-2"> <a href="#home" onClick={() => setNav(!nav)}> Home </a> </li> ..... add onClick on rest of the anchor tag in mobilenav sections.
<div className={nav ? 'text-gray-300 fixed h-full left-0 top-0 w-[50%] border-r border-r-gray-900 bg-[#202121] duration-500 ease-in-out' : 'fixed left-[-100%] top-0 h-full ease-in-out duration-500' }> for going back in transition of our navbar. Is it possible that i can make pull request on ur repository?
ill pin your comment so anyone who wants to use also going back transition and will see it can take it :D for now the repo is still empty with some starter files only.. Thanks for your input!
My biggest doubt on creating a single page in React.js is too complecated with all guessing CSS values by trial and errors. Hello React guys, find a easy and simple solution soon ! Learn from Wordpress and Wixz web designers, even the best tool is WYSIWYG Web Builder software. Just for a simple front end design, you guys spending (wasting) too much time. infact we have to spend time on back end logics. By such tutorials I may hate React.js/Next.js soon as I have just entered. One thing is sure, that you guys haven't seen other side of world making front ends faster with amazing looks.
Though I am fresher for React.js, I see you are complicating things by dropping too much elements on the screen at a time. No proper idea and doing everything trial and error on the flow. Better add one by one and set the style properly and then move to next. For me my head spinning to watch you video.
Thanks for the feedback! I will take it one by one next time, I agree with you that it will bring more clarity. I hope your head didnt spin for a long time tho!
Awesome project sir learned a lot. In the description you said the next project will be mern stack please make it with jwt token authentication in the backend.
Hey can you help me? I'm new in React. I had built few projects with React but I'm always confused with one thing, how to write clean code with React, when we seprate our component to a different file, how to make a reuseable component correctly. And others. Can you make a video about it?
It depends on the scale of the project. It's not always about writing clean code. I start refactoring my code when I notice parts of the UI that need the same items. An example is a button. But there are different kinds of buttons, so you use if statements to render the button you want when the specified condition is met.
