Slide 1

Slide 1 text

Matija Marohnić Introduction to A full stack React framework

Slide 2

Slide 2 text

Full stack? • frontend + backend • enjoying the bene fi ts of backend more cheaply • performance • SEO • may work without JS • etc.

Slide 3

Slide 3 text

React… framework? Isn’t React already a framework? • in this context React, Vue.js, Svelte etc. can be referred to as UI libraries • generation and management of the DOM • no bundling, serving, live reloading, routing, pre-fetching etc.

Slide 4

Slide 4 text

What about Next.js? • most popular full stack React framework • dynamic and static export, CSS support, image and font optimization… • tried it, but never particularly loved it

Slide 5

Slide 5 text

My experience with Next.js • Next.js hasn’t taught me much • features seem like results of requests • retrospectively, the static export feature seems ill-advised • better to use Eleventy or Astro • o ff ers a lot without much direction

Slide 6

Slide 6 text

next/image (for example) • a blackbox solution for buzzwords like LCP, CLS • doesn’t teach about responsive images, e.g. concepts like “art direction” • mentions stu ff like preload tags and priority hints, but no link

Slide 7

Slide 7 text

Fancy terms • serverless, edge computing, deployment services… • many courses on building, but not so many on delivering • I often felt like this:

Slide 8

Slide 8 text

Meet Remix!

Slide 9

Slide 9 text

Remix • no static export, teaches edge computing • only supports CSS fi les, no built-in Sass, CSS-in-JS etc. • no live-reload yet, but fast bundling with esbuild!

Slide 10

Slide 10 text

• close to The Platform → transferrable skills • “build better websites, sometimes with Remix” • teaches web development, not (just) Remix • I became better at Next.js 😄

Slide 11

Slide 11 text

• a lot of research → greater trust • The Edge • React Server Components • Remix vs Next.js

Slide 12

Slide 12 text

🧑💻 remix.run

Slide 13

Slide 13 text

🧑💻 silvenon.com

Slide 14

Slide 14 text

Remix • motivated me learn no-JS, caching, cookies… even databases! • it helped me fi nally get into full stack 🥳 • I’m building better user experiences

Slide 15

Slide 15 text

@silvenon Thanks!