Make videos WITH REACT and NextJS announces Nested Routes
React is a pretty versatile library, but did you know you can also make videos with it?
π News
NextJS is one of the most popular meta-frameworks for React. On their own site they're declared as:
Next.js gives you the best developer experience with all the features you need for production: hybrid static & server rendering, TypeScript support, smart bundling, route pre-fetching, and more. No config needed.
They are constantly improving month to month. One of the more exciting features theyβre offering is Nested routes/layouts. I typically use Remix and this has been an amazing, intuitive feature.
So, what is it?
Letβs take this example from the remix site:
app
βββ root.jsx
βββ routes
βββ accounts.jsx
βββ dashboard.jsx
βββ expenses.jsx
βββ index.jsx
βββ reports.jsx
βββ sales
β βββ customers.jsx
β βββ deposits.jsx
β βββ index.jsx
β βββ invoices
β β βββ $invoiceId.jsx
β β βββ index.jsx
β βββ invoices.jsx
β βββ subscriptions.jsx
βββ sales.jsx
We have a folder structure. Each folder is its own route. Every folder (route) inside a folder is a nested route. These routes will appear as a nested part of the layout.
I suggest checking out this link for a more visual example:
https://remix.run/docs/en/v1/guides/routing#what-is-nested-routing
Essentially, subsections of the page will be their own layout. This allows for errors inside a nested part of the page to be handled easier.
Remotion is a really unique library that allows you to make videos with the React UI API. Really recommend checking it out if youβre a fan of React and want to try something fun.
π¦ More interesting articles
β React
π§ Other