Nextjs layout tutorial: Build a shared layout with nav bar, styled with css modules
Build a shared layout with nav bar, styled with css modules. Learn to customise _app.js, page linking and css modules. UPDATE: I missed a function to close the menu when you click on mobile menu link. Please see new code on git hub, I have added it there! You would need the link for CODEPEN for Navbar code : https://codepen.io/ui-code-tv/pen/zYoQwaR Code on Github : https://github.com/ui-code-tv/myapp Other Next.js tutorials: NextJs data fetching tutorial getStaticProps and MYSQL: https://www.youtube.com/watch?v=uqlQB0oHSEE&t=2s NextJs data fetching tutorial using SWR and getStaticProps: https://www.youtube.com/watch?v=O2s_LvqQQgM&t=818s Other tutorial videos on React.js framework: Recharts tutorial - Build line chart: https://www.youtube.com/watch?v=z1KuuHLOY9c&t=1147s Reacharts custom SVG axis: https://www.youtube.com/watch?v=FbUumRuvzYI&t=8s React.js Styled-components: https://www.youtube.com/watch?v=A35oMQCAtBI&t=2196s React.js Query tutorial: https://www.youtube.com/watch?v=LutkuTmbFYg React.js animation tutorial using spring animation: https://www.youtube.com/watch?v=vbM-Mp4oWTM&t=369s Intro : (00:0:00) Customize _app.js and create layout component: (00:09:25) Create global and layout styles: (00:13:02) Navbar markup and styling: (00:15:43) Navbar toggle and animation code logic: (00:25:09) Add about and contact page : (00:37:40)
Download
0 formatsNo download links available.