Try React 18 with Vite, Typescript and Vercel

What's New In React 18?

The new version of React - React 18 alpha has just come out. From

New Improvements:

This tutorial will demonstrate a step-by-step guide to create your project using React 18 alpha, Typescript, Vite and deploy it to Vercel (freemium).

Create a Vite project

Required tools:

Run this command to create your new Vite project:
(Vite is a code generator similar to CRA but it takes < 1s to launch dev mode versus > 45s using CRA)

yarn create @vitejs/app my-project --template react-ts
cd my-project

Install the latest React 18 alpha version:

yarn add react@alpha react-dom@alpha

As @types/react doesn't understand the new React 18's APIs or types yet, we need to update "tsconfig.json" file: after "jsx": "react" add:

"types": ["react/next", "react-dom/next"]

Then run the new project:

yarn dev

vite v2.3.7 dev server running at:
  > Local: http://localhost:3000/
  ready in 174ms.

And that's it! We have React 18 up and running with Typescript in less than 1 second! Ready to rock.

Deploy to Vercel

First, we need to build this project:

yarn build

Then deploy the build (dist) directory to Vercel:

cd dist
npx vercel .

✅  Deployed to: [copied to clipboard] [11s]

Now, visit the link, we should have the app up and running there: