Are you tired of writing code to serve the right image size for different screen sizes and use image optimization services?
Next.js has already solved these problems for us with a built-in component called <Image>, and it’s just a matter of learning how to use it to make our developer lives easier.
Using the native HTML tag
—Background image example
— Card image example
— Trying to solve image issues without Next.js
How to use the Next.js component
— Background image
— Card image
We’ll use a demo app to show how to…
· A bit of web apps history: swinging back and forth
· How to consume the data on Next.js
— getStaticProps & the SSG approach
— getServerSideProps & the SSR on-demand approach
— Extra benefit of server-side functions
— Dynamic routes & getStaticPaths function
· Bonus: Serverless functions
· Demo app
Full Next JS Course: https://academy.eincode.com/next.js
In the old times, the apps’ core was on the back end, running on PHP, Ruby, etc.
Just open a WordPress website and navigate between pages: you’ll see that a new HTML doc is requested every time you navigate a different page…
What is Next.js?
What’s the main difference with React?
— What is SEO?
— Device hardware and internet speed
React vs. Next demos apps
— React demo
— Next demo
— Benefits of using Next
— When to use Next.js over React?
Full Course: https://academy.eincode.com/courses/next-js
Being a framework means that it’s got its own tooling, so, for example, there’s no need to add a router library because it’s already baked in. …
Front-end Engineer and keen tenkara fisherman