How to use React without build steps or framework

#react #cdn #javascript #beginners

Why React without build steps? Why not. Sometimes we are boring with doing npm install bla bla bla. Let's doing React like jQuery things, just use CDN and run hahaha.

Let's start.

Just go to https://github.com/sonyarianto/react-without-buildsteps

There is single index.html file there and without build steps means we just use CDN version for all of our React operation. That's includes the router and the Babel to handle the JSX code.

Here is the CDN URLs that used on that projects.



<script src="https://cdn.jsdelivr.net/npm/react@18.2.0/umd/react.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/react-dom@18.2.0/umd/react-dom.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@remix-run/router@1.6.2/dist/router.umd.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/react-router@6.11.2/dist/umd/react-router.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/react-router-dom@6.11.2/dist/umd/react-router-dom.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@babel/standalone@7.22.4/babel.min.js"></script>

and then finally the demo is on

https://react-without-buildsteps.vercel.app/

I hope you enjoy it.

Read the remake version of this article at Buka Corner.

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.