This is a Portfolio Project developed by David Agbaniyaka
What I learned:
- Latest Next.js 13 features
- Next.js App Router
- Next.js Server Actions
- Client & Server Components
- TypeScript (Beginner & Intermediate)
- Tailwind CSS
- Context API
- Advanced Animations with Framer Motion
- React.Email & Resend
- Custom React hooks
- Fresh, modern UI design
- Light & Dark mode
- Responsive website
Key Notes: - Using custom hex colors in Tailwind CSS absolute position top-[-6rem] makes it uull up - How to be more specifit while exporting using Typescript When importing external images in next,js, we need to provide a with and a height - When adjusting image height and with, it adjusts the aspect ratio so use object cover to preserve the aspect ratio. - When using a fixed header, the header is taken out of the docxument flow, and therefore what comes after willl sit on top pf the page. To solve this we add some padding on top of the body. - When we want to create a 'Component Element' to wrap JSX content in, in the creation of the component, it has to recieve a 'children' prop e.g export default function SectionHeading({children}). -Create Context Hook in React. -scroll-mt-[value] in Tailwind CSS gives margin to a section of a page that was navigated to. -When we flex items that are many, they will be cramped up on one line. Use flex-wrap to allow them wrap to multiple lines. -How to use localstorage to make the browser remember what color mode our website is using. Credit: